npm - @cqa-lib/cqa-ui - Versions diffs - 1.1.34 → 1.1.35 - Mend

@cqa-lib/cqa-ui 1.1.34 → 1.1.35

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/esm2020/lib/execution-screen/main-step-collapse/main-step-collapse.component.mjs +3 -3
package/fesm2015/cqa-lib-cqa-ui.mjs +2 -2
package/fesm2015/cqa-lib-cqa-ui.mjs.map +1 -1
package/fesm2020/cqa-lib-cqa-ui.mjs +2 -2
package/fesm2020/cqa-lib-cqa-ui.mjs.map +1 -1
package/package.json +1 -1

package/esm2020/lib/execution-screen/main-step-collapse/main-step-collapse.component.mjs CHANGED Viewed

@@ -60,10 +60,10 @@ export class MainStepCollapseComponent {
     }
 }
 MainStepCollapseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: MainStepCollapseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MainStepCollapseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: MainStepCollapseComponent, selector: "cqa-main-step-collapse", inputs: { title: "title", items: "items", expanded: "expanded", icon: "icon", count: "count", itemContentTemplate: "itemContentTemplate" }, outputs: { viewSteps: "viewSteps" }, host: { classAttribute: "cqa-ui-root" }, queries: [{ propertyName: "itemContentTpl", first: true, predicate: ["itemContent"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<!-- Header -->\n<div\n  class=\"cqa-pt-2 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-px-3 cqa-py-2 cqa-cursor-pointer cqa-bg-[#EEF2FF] cqa-rounded-[4px] cqa-border cqa-border-[#C6D2FF] cqa-border-solid\"\n  (click)=\"toggle()\">\n  <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-w-full\">\n    <!-- Chevron Icon (Left) -->\n    <!-- <svg [class.cqa-rotate-180]=\"isExpanded\" class=\"cqa-transition-transform\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M4 6L8 10L12 6\" stroke=\"#3F51B5\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n  </svg> -->\n    <div><svg [class.cqa-rotate-180]=\"isExpanded\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M4 6L8 10L12 6\" stroke=\"#4F39F6\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg></div>\n\n    <!-- Chain-Link Icon (if configured, otherwise default) -->\n    <!-- <div *ngIf=\"icon && icon.type === 'folder'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M11.6666 11.6667C11.976 11.6667 12.2728 11.5437 12.4916 11.325C12.7104 11.1062 12.8333 10.8094 12.8333 10.5V4.66667C12.8333 4.35725 12.7104 4.0605 12.4916 3.84171C12.2728 3.62292 11.976 3.5 11.6666 3.5H7.05829C6.86318 3.50191 6.67069 3.45486 6.49847 3.36314C6.32624 3.27142 6.17977 3.13797 6.07246 2.975L5.59996 2.275C5.49373 2.11369 5.34911 1.98128 5.17908 1.88965C5.00906 1.79802 4.81894 1.75003 4.62579 1.75H2.33329C2.02387 1.75 1.72713 1.87292 1.50833 2.09171C1.28954 2.3105 1.16663 2.60725 1.16663 2.91667V10.5C1.16663 10.8094 1.28954 11.1062 1.50833 11.325C1.72713 11.5437 2.02387 11.6667 2.33329 11.6667H11.6666Z\" fill=\"#EFF6FF\" stroke=\"#3F51B5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div>\n  <div *ngIf=\"icon && icon.type === 'loop'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <rect width=\"16\" height=\"16\" rx=\"4\" fill=\"#EBECFD\"/>\n      <path d=\"M9.66663 4.66666L11 5.99999L9.66663 7.33332\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M5 7.66667V7.33333C5 6.97971 5.14048 6.64057 5.39052 6.39052C5.64057 6.14048 5.97971 6 6.33333 6H11\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M6.33333 11.3333L5 9.99999L6.33333 8.66666\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M11 8.33334V8.66668C11 9.0203 10.8595 9.35944 10.6095 9.60949C10.3594 9.85953 10.0203 10 9.66667 10H5\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div> -->\n    <!-- Bar Icon (Bulleted List) -->\n    <div *ngIf=\"icon && icon.type === 'bar'\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <!-- First bullet and line -->\n        <circle cx=\"3\" cy=\"5\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"5\" x2=\"17\" y2=\"5\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Second bullet and line -->\n        <circle cx=\"3\" cy=\"10\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"10\" x2=\"17\" y2=\"10\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Third bullet and line -->\n        <circle cx=\"3\" cy=\"15\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"15\" x2=\"17\" y2=\"15\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n      </svg>\n    </div>\n\n    <!-- Default Chain-Link Icon (when no icon or icon type is not specified) -->\n    <div *ngIf=\"!icon || (icon.type !== 'bar' && icon.type !== 'folder' && icon.type !== 'loop' && icon.type !== 'custom')\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M7.50033 14.1663H5.83366C4.72859 14.1663 3.66878 13.7274 2.88738 12.946C2.10598 12.1646 1.66699 11.1047 1.66699 9.99967C1.66699 8.89461 2.10598 7.8348 2.88738 7.0534C3.66878 6.27199 4.72859 5.83301 5.83366 5.83301H7.50033\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path\n          d=\"M12.5 5.83301H14.1667C15.2717 5.83301 16.3315 6.27199 17.1129 7.0534C17.8943 7.8348 18.3333 8.89461 18.3333 9.99967C18.3333 11.1047 17.8943 12.1646 17.1129 12.946C16.3315 13.7274 15.2717 14.1663 14.1667 14.1663H12.5\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path d=\"M6.66699 10H13.3337\" stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg>\n    </div>\n\n    <!-- Custom Icon -->\n    <div *ngIf=\"icon && icon.type === 'custom' && icon.svg\" [innerHTML]=\"icon.svg\"></div>\n\n    <!-- Title -->\n    <span class=\"cqa-font-semibold cqa-text-[14px] cqa-leading-[17px] cqa-text-[#312C85] cqa-flex-1\">\n      {{ title }}\n    </span>\n\n    <!-- Badge -->\n    <span\n      class=\"cqa-px-2 cqa-py-[2px] cqa-rounded-[4px] cqa-bg-[#C6D2FF] cqa-text-[12px] cqa-leading-[16px] cqa-text-[#432DD7]\">\n      {{ getDisplayCount() }}\n    </span>\n  </div>\n</div>\n\n<!-- Expanded Content -->\n<div *ngIf=\"isExpanded\" class=\"cqa-mt-2 cqa-flex cqa-flex-col cqa-gap-2 cqa-px-2.5\">\n  <!-- When there are no items, display ng-content directly -->\n  <ng-container *ngIf=\"!items || items.length === 0\">\n      <ng-content></ng-content>\n  </ng-container>\n\n  <!-- When items exist, display them -->\n  <div *ngFor=\"let item of items\">\n\n    <!-- Item Header -->\n    <div class=\"cqa-bg-white cqa-border cqa-border-solid cqa-border-[#E5E5E5] cqa-rounded-md cqa-overflow-hidden\">\n      <div class=\"cqa-py-2 cqa-px-3 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3\">\n        <!-- Left side: Status and Title -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-flex-1\">\n          <!-- Status Icon (Filled Green Circle with Checkmark) -->\n          <div>\n            <!-- Success -->\n            <svg *ngIf=\"item.status === 'success'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <g clip-path=\"url(#clip0_48_121)\">\n                <path\n                  d=\"M10.0003 18.3337C14.6027 18.3337 18.3337 14.6027 18.3337 10.0003C18.3337 5.39795 14.6027 1.66699 10.0003 1.66699C5.39795 1.66699 1.66699 5.39795 1.66699 10.0003C1.66699 14.6027 5.39795 18.3337 10.0003 18.3337Z\"\n                  stroke=\"#00A63E\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n                <path d=\"M7.5 9.99967L9.16667 11.6663L12.5 8.33301\" stroke=\"#00A63E\" stroke-width=\"1.66667\"\n                  stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_48_121\">\n                  <rect width=\"20\" height=\"20\" fill=\"white\" />\n                </clipPath>\n              </defs>\n            </svg>\n            <!-- Failed -->\n            <svg *ngIf=\"item.status === 'failed'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#EF4444\" />\n              <path d=\"M7 7L13 13M13 7L7 13\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Pending -->\n            <svg *ngIf=\"item.status === 'pending'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#9CA3AF\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Running -->\n            <svg *ngIf=\"item.status === 'running'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#3B82F6\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n          </div>\n  \n          <!-- Title -->\n          <span class=\"cqa-text-[14px] cqa-leading-[18px]\">\n            {{ item.title }}\n          </span>\n        </div>\n  \n        <!-- Right side: Duration and View Steps Link -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3\">\n          <!-- Duration with Clock Icon -->\n          <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n            <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\"\n                stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              <path d=\"M6 3V6L8 7\" stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <span class=\"cqa-text-[14px] cqa-leading-[20px] cqa-text-[#6A7282]\">\n              {{ formatDuration(item.duration) }}\n            </span>\n          </div>\n  \n          <!-- View Steps Link -->\n          <a href=\"#\" (click)=\"onViewSteps(item, $event)\"\n            class=\"cqa-text-[12px] cqa-leading-[15px] cqa-font-semibold cqa-text-[#3F43EE] cqa-no-underline cqa-flex cqa-items-center cqa-gap-1 hover:cqa-underline\">\n            <span>{{ isItemExpanded(item.id) ? 'Hide steps' : 'View steps' }}</span>\n            <svg [class.cqa-rotate-90]=\"isItemExpanded(item.id)\" class=\"cqa-transition-transform\" width=\"16\" height=\"15\"\n              viewBox=\"0 0 16 15\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M8.6552 12.8184L7.55413 11.7668L10.852 8.5864H2.83984V7.05032H10.852L7.55413 3.87506L8.6552 2.81836L13.8398 7.81836L8.6552 12.8184Z\"\n                fill=\"#3F43EE\" />\n            </svg>\n          </a>\n        </div>\n      </div>\n    </div>\n\n    <!-- Steps Content (shown when item is expanded) -->\n    <div *ngIf=\"isItemExpanded(item.id)\">\n      <!-- Custom template via TemplateRef (from @ContentChild or @Input) - passes item as context -->\n      <ng-container *ngIf=\"itemContentTpl || itemContentTemplate\">\n        <div class=\"cqa-p-3\">\n          <ng-container\n            *ngTemplateOutlet=\"(itemContentTpl || itemContentTemplate)!; context: { $implicit: item, item: item }\"></ng-container>\n        </div>\n      </ng-container>\n\n      <!-- Custom content projection via ng-content - displayed for all expanded items -->\n      <ng-content select=\"[itemContent]\"></ng-content>\n    </div>\n  </div>\n</div>\n\n<!-- Custom content projection after all items - for steps loaded after API call -->\n<ng-content select=\"[afterItems]\"></ng-content>", directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+MainStepCollapseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: MainStepCollapseComponent, selector: "cqa-main-step-collapse", inputs: { title: "title", items: "items", expanded: "expanded", icon: "icon", count: "count", itemContentTemplate: "itemContentTemplate" }, outputs: { viewSteps: "viewSteps" }, host: { classAttribute: "cqa-ui-root" }, queries: [{ propertyName: "itemContentTpl", first: true, predicate: ["itemContent"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<!-- Header -->\n<div\n  class=\"cqa-mt-2 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-px-3 cqa-py-2 cqa-cursor-pointer cqa-bg-[#EEF2FF] cqa-rounded-[4px] cqa-border cqa-border-[#C6D2FF] cqa-border-solid\"\n  (click)=\"toggle()\">\n  <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-w-full\">\n    <!-- Chevron Icon (Left) -->\n    <!-- <svg [class.cqa-rotate-180]=\"isExpanded\" class=\"cqa-transition-transform\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M4 6L8 10L12 6\" stroke=\"#3F51B5\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n  </svg> -->\n    <div><svg [class.cqa-rotate-180]=\"isExpanded\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M4 6L8 10L12 6\" stroke=\"#4F39F6\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg></div>\n\n    <!-- Chain-Link Icon (if configured, otherwise default) -->\n    <!-- <div *ngIf=\"icon && icon.type === 'folder'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M11.6666 11.6667C11.976 11.6667 12.2728 11.5437 12.4916 11.325C12.7104 11.1062 12.8333 10.8094 12.8333 10.5V4.66667C12.8333 4.35725 12.7104 4.0605 12.4916 3.84171C12.2728 3.62292 11.976 3.5 11.6666 3.5H7.05829C6.86318 3.50191 6.67069 3.45486 6.49847 3.36314C6.32624 3.27142 6.17977 3.13797 6.07246 2.975L5.59996 2.275C5.49373 2.11369 5.34911 1.98128 5.17908 1.88965C5.00906 1.79802 4.81894 1.75003 4.62579 1.75H2.33329C2.02387 1.75 1.72713 1.87292 1.50833 2.09171C1.28954 2.3105 1.16663 2.60725 1.16663 2.91667V10.5C1.16663 10.8094 1.28954 11.1062 1.50833 11.325C1.72713 11.5437 2.02387 11.6667 2.33329 11.6667H11.6666Z\" fill=\"#EFF6FF\" stroke=\"#3F51B5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div>\n  <div *ngIf=\"icon && icon.type === 'loop'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <rect width=\"16\" height=\"16\" rx=\"4\" fill=\"#EBECFD\"/>\n      <path d=\"M9.66663 4.66666L11 5.99999L9.66663 7.33332\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M5 7.66667V7.33333C5 6.97971 5.14048 6.64057 5.39052 6.39052C5.64057 6.14048 5.97971 6 6.33333 6H11\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M6.33333 11.3333L5 9.99999L6.33333 8.66666\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M11 8.33334V8.66668C11 9.0203 10.8595 9.35944 10.6095 9.60949C10.3594 9.85953 10.0203 10 9.66667 10H5\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div> -->\n    <!-- Bar Icon (Bulleted List) -->\n    <div *ngIf=\"icon && icon.type === 'bar'\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <!-- First bullet and line -->\n        <circle cx=\"3\" cy=\"5\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"5\" x2=\"17\" y2=\"5\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Second bullet and line -->\n        <circle cx=\"3\" cy=\"10\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"10\" x2=\"17\" y2=\"10\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Third bullet and line -->\n        <circle cx=\"3\" cy=\"15\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"15\" x2=\"17\" y2=\"15\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n      </svg>\n    </div>\n\n    <!-- Default Chain-Link Icon (when no icon or icon type is not specified) -->\n    <div *ngIf=\"!icon || (icon.type !== 'bar' && icon.type !== 'folder' && icon.type !== 'loop' && icon.type !== 'custom')\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M7.50033 14.1663H5.83366C4.72859 14.1663 3.66878 13.7274 2.88738 12.946C2.10598 12.1646 1.66699 11.1047 1.66699 9.99967C1.66699 8.89461 2.10598 7.8348 2.88738 7.0534C3.66878 6.27199 4.72859 5.83301 5.83366 5.83301H7.50033\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path\n          d=\"M12.5 5.83301H14.1667C15.2717 5.83301 16.3315 6.27199 17.1129 7.0534C17.8943 7.8348 18.3333 8.89461 18.3333 9.99967C18.3333 11.1047 17.8943 12.1646 17.1129 12.946C16.3315 13.7274 15.2717 14.1663 14.1667 14.1663H12.5\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path d=\"M6.66699 10H13.3337\" stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg>\n    </div>\n\n    <!-- Custom Icon -->\n    <div *ngIf=\"icon && icon.type === 'custom' && icon.svg\" [innerHTML]=\"icon.svg\"></div>\n\n    <!-- Title -->\n    <span class=\"cqa-font-semibold cqa-text-[14px] cqa-leading-[17px] cqa-text-[#312C85] cqa-flex-1\">\n      {{ title }}\n    </span>\n\n    <!-- Badge -->\n    <span\n      class=\"cqa-px-2 cqa-py-[2px] cqa-rounded-[4px] cqa-bg-[#C6D2FF] cqa-text-[12px] cqa-leading-[16px] cqa-text-[#432DD7]\">\n      {{ getDisplayCount() }}\n    </span>\n  </div>\n</div>\n\n<!-- Expanded Content -->\n<div *ngIf=\"isExpanded\" class=\"cqa-mt-2 cqa-flex cqa-flex-col cqa-gap-2 cqa-px-2.5\">\n  <!-- When there are no items, display ng-content directly -->\n  <ng-container *ngIf=\"!items || items.length === 0\">\n      <ng-content></ng-content>\n  </ng-container>\n\n  <!-- When items exist, display them -->\n  <div *ngFor=\"let item of items\">\n\n    <!-- Item Header -->\n    <div class=\"cqa-bg-white cqa-border cqa-border-solid cqa-border-[#E5E5E5] cqa-rounded-md cqa-overflow-hidden\">\n      <div class=\"cqa-py-2 cqa-px-3 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3\">\n        <!-- Left side: Status and Title -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-flex-1\">\n          <!-- Status Icon (Filled Green Circle with Checkmark) -->\n          <div>\n            <!-- Success -->\n            <svg *ngIf=\"item.status === 'success'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <g clip-path=\"url(#clip0_48_121)\">\n                <path\n                  d=\"M10.0003 18.3337C14.6027 18.3337 18.3337 14.6027 18.3337 10.0003C18.3337 5.39795 14.6027 1.66699 10.0003 1.66699C5.39795 1.66699 1.66699 5.39795 1.66699 10.0003C1.66699 14.6027 5.39795 18.3337 10.0003 18.3337Z\"\n                  stroke=\"#00A63E\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n                <path d=\"M7.5 9.99967L9.16667 11.6663L12.5 8.33301\" stroke=\"#00A63E\" stroke-width=\"1.66667\"\n                  stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_48_121\">\n                  <rect width=\"20\" height=\"20\" fill=\"white\" />\n                </clipPath>\n              </defs>\n            </svg>\n            <!-- Failed -->\n            <svg *ngIf=\"item.status === 'failed'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#EF4444\" />\n              <path d=\"M7 7L13 13M13 7L7 13\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Pending -->\n            <svg *ngIf=\"item.status === 'pending'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#9CA3AF\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Running -->\n            <svg *ngIf=\"item.status === 'running'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#3B82F6\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n          </div>\n  \n          <!-- Title -->\n          <span class=\"cqa-text-[14px] cqa-leading-[18px]\">\n            {{ item.title }}\n          </span>\n        </div>\n  \n        <!-- Right side: Duration and View Steps Link -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3\">\n          <!-- Duration with Clock Icon -->\n          <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n            <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\"\n                stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              <path d=\"M6 3V6L8 7\" stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <span class=\"cqa-text-[14px] cqa-leading-[20px] cqa-text-[#6A7282]\">\n              {{ formatDuration(item.duration) }}\n            </span>\n          </div>\n  \n          <!-- View Steps Link -->\n          <a href=\"#\" (click)=\"onViewSteps(item, $event)\"\n            class=\"cqa-text-[12px] cqa-leading-[15px] cqa-font-semibold cqa-text-[#3F43EE] cqa-no-underline cqa-flex cqa-items-center cqa-gap-1 hover:cqa-underline\">\n            <span>{{ isItemExpanded(item.id) ? 'Hide steps' : 'View steps' }}</span>\n            <svg [class.cqa-rotate-90]=\"isItemExpanded(item.id)\" class=\"cqa-transition-transform\" width=\"16\" height=\"15\"\n              viewBox=\"0 0 16 15\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M8.6552 12.8184L7.55413 11.7668L10.852 8.5864H2.83984V7.05032H10.852L7.55413 3.87506L8.6552 2.81836L13.8398 7.81836L8.6552 12.8184Z\"\n                fill=\"#3F43EE\" />\n            </svg>\n          </a>\n        </div>\n      </div>\n    </div>\n\n    <!-- Steps Content (shown when item is expanded) -->\n    <div *ngIf=\"isItemExpanded(item.id)\">\n      <!-- Custom template via TemplateRef (from @ContentChild or @Input) - passes item as context -->\n      <ng-container *ngIf=\"itemContentTpl || itemContentTemplate\">\n        <div class=\"cqa-p-3\">\n          <ng-container\n            *ngTemplateOutlet=\"(itemContentTpl || itemContentTemplate)!; context: { $implicit: item, item: item }\"></ng-container>\n        </div>\n      </ng-container>\n\n      <!-- Custom content projection via ng-content - displayed for all expanded items -->\n      <ng-content select=\"[itemContent]\"></ng-content>\n    </div>\n  </div>\n</div>\n\n<!-- Custom content projection after all items - for steps loaded after API call -->\n<ng-content select=\"[afterItems]\"></ng-content>", directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: MainStepCollapseComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cqa-main-step-collapse', host: { class: 'cqa-ui-root' }, template: "<!-- Header -->\n<div\n  class=\"cqa-pt-2 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-px-3 cqa-py-2 cqa-cursor-pointer cqa-bg-[#EEF2FF] cqa-rounded-[4px] cqa-border cqa-border-[#C6D2FF] cqa-border-solid\"\n  (click)=\"toggle()\">\n  <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-w-full\">\n    <!-- Chevron Icon (Left) -->\n    <!-- <svg [class.cqa-rotate-180]=\"isExpanded\" class=\"cqa-transition-transform\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M4 6L8 10L12 6\" stroke=\"#3F51B5\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n  </svg> -->\n    <div><svg [class.cqa-rotate-180]=\"isExpanded\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M4 6L8 10L12 6\" stroke=\"#4F39F6\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg></div>\n\n    <!-- Chain-Link Icon (if configured, otherwise default) -->\n    <!-- <div *ngIf=\"icon && icon.type === 'folder'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M11.6666 11.6667C11.976 11.6667 12.2728 11.5437 12.4916 11.325C12.7104 11.1062 12.8333 10.8094 12.8333 10.5V4.66667C12.8333 4.35725 12.7104 4.0605 12.4916 3.84171C12.2728 3.62292 11.976 3.5 11.6666 3.5H7.05829C6.86318 3.50191 6.67069 3.45486 6.49847 3.36314C6.32624 3.27142 6.17977 3.13797 6.07246 2.975L5.59996 2.275C5.49373 2.11369 5.34911 1.98128 5.17908 1.88965C5.00906 1.79802 4.81894 1.75003 4.62579 1.75H2.33329C2.02387 1.75 1.72713 1.87292 1.50833 2.09171C1.28954 2.3105 1.16663 2.60725 1.16663 2.91667V10.5C1.16663 10.8094 1.28954 11.1062 1.50833 11.325C1.72713 11.5437 2.02387 11.6667 2.33329 11.6667H11.6666Z\" fill=\"#EFF6FF\" stroke=\"#3F51B5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div>\n  <div *ngIf=\"icon && icon.type === 'loop'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <rect width=\"16\" height=\"16\" rx=\"4\" fill=\"#EBECFD\"/>\n      <path d=\"M9.66663 4.66666L11 5.99999L9.66663 7.33332\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M5 7.66667V7.33333C5 6.97971 5.14048 6.64057 5.39052 6.39052C5.64057 6.14048 5.97971 6 6.33333 6H11\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M6.33333 11.3333L5 9.99999L6.33333 8.66666\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M11 8.33334V8.66668C11 9.0203 10.8595 9.35944 10.6095 9.60949C10.3594 9.85953 10.0203 10 9.66667 10H5\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div> -->\n    <!-- Bar Icon (Bulleted List) -->\n    <div *ngIf=\"icon && icon.type === 'bar'\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <!-- First bullet and line -->\n        <circle cx=\"3\" cy=\"5\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"5\" x2=\"17\" y2=\"5\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Second bullet and line -->\n        <circle cx=\"3\" cy=\"10\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"10\" x2=\"17\" y2=\"10\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Third bullet and line -->\n        <circle cx=\"3\" cy=\"15\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"15\" x2=\"17\" y2=\"15\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n      </svg>\n    </div>\n\n    <!-- Default Chain-Link Icon (when no icon or icon type is not specified) -->\n    <div *ngIf=\"!icon || (icon.type !== 'bar' && icon.type !== 'folder' && icon.type !== 'loop' && icon.type !== 'custom')\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M7.50033 14.1663H5.83366C4.72859 14.1663 3.66878 13.7274 2.88738 12.946C2.10598 12.1646 1.66699 11.1047 1.66699 9.99967C1.66699 8.89461 2.10598 7.8348 2.88738 7.0534C3.66878 6.27199 4.72859 5.83301 5.83366 5.83301H7.50033\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path\n          d=\"M12.5 5.83301H14.1667C15.2717 5.83301 16.3315 6.27199 17.1129 7.0534C17.8943 7.8348 18.3333 8.89461 18.3333 9.99967C18.3333 11.1047 17.8943 12.1646 17.1129 12.946C16.3315 13.7274 15.2717 14.1663 14.1667 14.1663H12.5\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path d=\"M6.66699 10H13.3337\" stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg>\n    </div>\n\n    <!-- Custom Icon -->\n    <div *ngIf=\"icon && icon.type === 'custom' && icon.svg\" [innerHTML]=\"icon.svg\"></div>\n\n    <!-- Title -->\n    <span class=\"cqa-font-semibold cqa-text-[14px] cqa-leading-[17px] cqa-text-[#312C85] cqa-flex-1\">\n      {{ title }}\n    </span>\n\n    <!-- Badge -->\n    <span\n      class=\"cqa-px-2 cqa-py-[2px] cqa-rounded-[4px] cqa-bg-[#C6D2FF] cqa-text-[12px] cqa-leading-[16px] cqa-text-[#432DD7]\">\n      {{ getDisplayCount() }}\n    </span>\n  </div>\n</div>\n\n<!-- Expanded Content -->\n<div *ngIf=\"isExpanded\" class=\"cqa-mt-2 cqa-flex cqa-flex-col cqa-gap-2 cqa-px-2.5\">\n  <!-- When there are no items, display ng-content directly -->\n  <ng-container *ngIf=\"!items || items.length === 0\">\n      <ng-content></ng-content>\n  </ng-container>\n\n  <!-- When items exist, display them -->\n  <div *ngFor=\"let item of items\">\n\n    <!-- Item Header -->\n    <div class=\"cqa-bg-white cqa-border cqa-border-solid cqa-border-[#E5E5E5] cqa-rounded-md cqa-overflow-hidden\">\n      <div class=\"cqa-py-2 cqa-px-3 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3\">\n        <!-- Left side: Status and Title -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-flex-1\">\n          <!-- Status Icon (Filled Green Circle with Checkmark) -->\n          <div>\n            <!-- Success -->\n            <svg *ngIf=\"item.status === 'success'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <g clip-path=\"url(#clip0_48_121)\">\n                <path\n                  d=\"M10.0003 18.3337C14.6027 18.3337 18.3337 14.6027 18.3337 10.0003C18.3337 5.39795 14.6027 1.66699 10.0003 1.66699C5.39795 1.66699 1.66699 5.39795 1.66699 10.0003C1.66699 14.6027 5.39795 18.3337 10.0003 18.3337Z\"\n                  stroke=\"#00A63E\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n                <path d=\"M7.5 9.99967L9.16667 11.6663L12.5 8.33301\" stroke=\"#00A63E\" stroke-width=\"1.66667\"\n                  stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_48_121\">\n                  <rect width=\"20\" height=\"20\" fill=\"white\" />\n                </clipPath>\n              </defs>\n            </svg>\n            <!-- Failed -->\n            <svg *ngIf=\"item.status === 'failed'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#EF4444\" />\n              <path d=\"M7 7L13 13M13 7L7 13\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Pending -->\n            <svg *ngIf=\"item.status === 'pending'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#9CA3AF\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Running -->\n            <svg *ngIf=\"item.status === 'running'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#3B82F6\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n          </div>\n  \n          <!-- Title -->\n          <span class=\"cqa-text-[14px] cqa-leading-[18px]\">\n            {{ item.title }}\n          </span>\n        </div>\n  \n        <!-- Right side: Duration and View Steps Link -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3\">\n          <!-- Duration with Clock Icon -->\n          <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n            <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\"\n                stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              <path d=\"M6 3V6L8 7\" stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <span class=\"cqa-text-[14px] cqa-leading-[20px] cqa-text-[#6A7282]\">\n              {{ formatDuration(item.duration) }}\n            </span>\n          </div>\n  \n          <!-- View Steps Link -->\n          <a href=\"#\" (click)=\"onViewSteps(item, $event)\"\n            class=\"cqa-text-[12px] cqa-leading-[15px] cqa-font-semibold cqa-text-[#3F43EE] cqa-no-underline cqa-flex cqa-items-center cqa-gap-1 hover:cqa-underline\">\n            <span>{{ isItemExpanded(item.id) ? 'Hide steps' : 'View steps' }}</span>\n            <svg [class.cqa-rotate-90]=\"isItemExpanded(item.id)\" class=\"cqa-transition-transform\" width=\"16\" height=\"15\"\n              viewBox=\"0 0 16 15\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M8.6552 12.8184L7.55413 11.7668L10.852 8.5864H2.83984V7.05032H10.852L7.55413 3.87506L8.6552 2.81836L13.8398 7.81836L8.6552 12.8184Z\"\n                fill=\"#3F43EE\" />\n            </svg>\n          </a>\n        </div>\n      </div>\n    </div>\n\n    <!-- Steps Content (shown when item is expanded) -->\n    <div *ngIf=\"isItemExpanded(item.id)\">\n      <!-- Custom template via TemplateRef (from @ContentChild or @Input) - passes item as context -->\n      <ng-container *ngIf=\"itemContentTpl || itemContentTemplate\">\n        <div class=\"cqa-p-3\">\n          <ng-container\n            *ngTemplateOutlet=\"(itemContentTpl || itemContentTemplate)!; context: { $implicit: item, item: item }\"></ng-container>\n        </div>\n      </ng-container>\n\n      <!-- Custom content projection via ng-content - displayed for all expanded items -->\n      <ng-content select=\"[itemContent]\"></ng-content>\n    </div>\n  </div>\n</div>\n\n<!-- Custom content projection after all items - for steps loaded after API call -->\n<ng-content select=\"[afterItems]\"></ng-content>", styles: [] }]
+            args: [{ selector: 'cqa-main-step-collapse', host: { class: 'cqa-ui-root' }, template: "<!-- Header -->\n<div\n  class=\"cqa-mt-2 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-px-3 cqa-py-2 cqa-cursor-pointer cqa-bg-[#EEF2FF] cqa-rounded-[4px] cqa-border cqa-border-[#C6D2FF] cqa-border-solid\"\n  (click)=\"toggle()\">\n  <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-w-full\">\n    <!-- Chevron Icon (Left) -->\n    <!-- <svg [class.cqa-rotate-180]=\"isExpanded\" class=\"cqa-transition-transform\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M4 6L8 10L12 6\" stroke=\"#3F51B5\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n  </svg> -->\n    <div><svg [class.cqa-rotate-180]=\"isExpanded\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M4 6L8 10L12 6\" stroke=\"#4F39F6\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg></div>\n\n    <!-- Chain-Link Icon (if configured, otherwise default) -->\n    <!-- <div *ngIf=\"icon && icon.type === 'folder'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M11.6666 11.6667C11.976 11.6667 12.2728 11.5437 12.4916 11.325C12.7104 11.1062 12.8333 10.8094 12.8333 10.5V4.66667C12.8333 4.35725 12.7104 4.0605 12.4916 3.84171C12.2728 3.62292 11.976 3.5 11.6666 3.5H7.05829C6.86318 3.50191 6.67069 3.45486 6.49847 3.36314C6.32624 3.27142 6.17977 3.13797 6.07246 2.975L5.59996 2.275C5.49373 2.11369 5.34911 1.98128 5.17908 1.88965C5.00906 1.79802 4.81894 1.75003 4.62579 1.75H2.33329C2.02387 1.75 1.72713 1.87292 1.50833 2.09171C1.28954 2.3105 1.16663 2.60725 1.16663 2.91667V10.5C1.16663 10.8094 1.28954 11.1062 1.50833 11.325C1.72713 11.5437 2.02387 11.6667 2.33329 11.6667H11.6666Z\" fill=\"#EFF6FF\" stroke=\"#3F51B5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div>\n  <div *ngIf=\"icon && icon.type === 'loop'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <rect width=\"16\" height=\"16\" rx=\"4\" fill=\"#EBECFD\"/>\n      <path d=\"M9.66663 4.66666L11 5.99999L9.66663 7.33332\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M5 7.66667V7.33333C5 6.97971 5.14048 6.64057 5.39052 6.39052C5.64057 6.14048 5.97971 6 6.33333 6H11\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M6.33333 11.3333L5 9.99999L6.33333 8.66666\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M11 8.33334V8.66668C11 9.0203 10.8595 9.35944 10.6095 9.60949C10.3594 9.85953 10.0203 10 9.66667 10H5\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div> -->\n    <!-- Bar Icon (Bulleted List) -->\n    <div *ngIf=\"icon && icon.type === 'bar'\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <!-- First bullet and line -->\n        <circle cx=\"3\" cy=\"5\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"5\" x2=\"17\" y2=\"5\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Second bullet and line -->\n        <circle cx=\"3\" cy=\"10\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"10\" x2=\"17\" y2=\"10\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Third bullet and line -->\n        <circle cx=\"3\" cy=\"15\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"15\" x2=\"17\" y2=\"15\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n      </svg>\n    </div>\n\n    <!-- Default Chain-Link Icon (when no icon or icon type is not specified) -->\n    <div *ngIf=\"!icon || (icon.type !== 'bar' && icon.type !== 'folder' && icon.type !== 'loop' && icon.type !== 'custom')\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M7.50033 14.1663H5.83366C4.72859 14.1663 3.66878 13.7274 2.88738 12.946C2.10598 12.1646 1.66699 11.1047 1.66699 9.99967C1.66699 8.89461 2.10598 7.8348 2.88738 7.0534C3.66878 6.27199 4.72859 5.83301 5.83366 5.83301H7.50033\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path\n          d=\"M12.5 5.83301H14.1667C15.2717 5.83301 16.3315 6.27199 17.1129 7.0534C17.8943 7.8348 18.3333 8.89461 18.3333 9.99967C18.3333 11.1047 17.8943 12.1646 17.1129 12.946C16.3315 13.7274 15.2717 14.1663 14.1667 14.1663H12.5\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path d=\"M6.66699 10H13.3337\" stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg>\n    </div>\n\n    <!-- Custom Icon -->\n    <div *ngIf=\"icon && icon.type === 'custom' && icon.svg\" [innerHTML]=\"icon.svg\"></div>\n\n    <!-- Title -->\n    <span class=\"cqa-font-semibold cqa-text-[14px] cqa-leading-[17px] cqa-text-[#312C85] cqa-flex-1\">\n      {{ title }}\n    </span>\n\n    <!-- Badge -->\n    <span\n      class=\"cqa-px-2 cqa-py-[2px] cqa-rounded-[4px] cqa-bg-[#C6D2FF] cqa-text-[12px] cqa-leading-[16px] cqa-text-[#432DD7]\">\n      {{ getDisplayCount() }}\n    </span>\n  </div>\n</div>\n\n<!-- Expanded Content -->\n<div *ngIf=\"isExpanded\" class=\"cqa-mt-2 cqa-flex cqa-flex-col cqa-gap-2 cqa-px-2.5\">\n  <!-- When there are no items, display ng-content directly -->\n  <ng-container *ngIf=\"!items || items.length === 0\">\n      <ng-content></ng-content>\n  </ng-container>\n\n  <!-- When items exist, display them -->\n  <div *ngFor=\"let item of items\">\n\n    <!-- Item Header -->\n    <div class=\"cqa-bg-white cqa-border cqa-border-solid cqa-border-[#E5E5E5] cqa-rounded-md cqa-overflow-hidden\">\n      <div class=\"cqa-py-2 cqa-px-3 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3\">\n        <!-- Left side: Status and Title -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-flex-1\">\n          <!-- Status Icon (Filled Green Circle with Checkmark) -->\n          <div>\n            <!-- Success -->\n            <svg *ngIf=\"item.status === 'success'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <g clip-path=\"url(#clip0_48_121)\">\n                <path\n                  d=\"M10.0003 18.3337C14.6027 18.3337 18.3337 14.6027 18.3337 10.0003C18.3337 5.39795 14.6027 1.66699 10.0003 1.66699C5.39795 1.66699 1.66699 5.39795 1.66699 10.0003C1.66699 14.6027 5.39795 18.3337 10.0003 18.3337Z\"\n                  stroke=\"#00A63E\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n                <path d=\"M7.5 9.99967L9.16667 11.6663L12.5 8.33301\" stroke=\"#00A63E\" stroke-width=\"1.66667\"\n                  stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_48_121\">\n                  <rect width=\"20\" height=\"20\" fill=\"white\" />\n                </clipPath>\n              </defs>\n            </svg>\n            <!-- Failed -->\n            <svg *ngIf=\"item.status === 'failed'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#EF4444\" />\n              <path d=\"M7 7L13 13M13 7L7 13\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Pending -->\n            <svg *ngIf=\"item.status === 'pending'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#9CA3AF\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Running -->\n            <svg *ngIf=\"item.status === 'running'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#3B82F6\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n          </div>\n  \n          <!-- Title -->\n          <span class=\"cqa-text-[14px] cqa-leading-[18px]\">\n            {{ item.title }}\n          </span>\n        </div>\n  \n        <!-- Right side: Duration and View Steps Link -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3\">\n          <!-- Duration with Clock Icon -->\n          <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n            <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\"\n                stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              <path d=\"M6 3V6L8 7\" stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <span class=\"cqa-text-[14px] cqa-leading-[20px] cqa-text-[#6A7282]\">\n              {{ formatDuration(item.duration) }}\n            </span>\n          </div>\n  \n          <!-- View Steps Link -->\n          <a href=\"#\" (click)=\"onViewSteps(item, $event)\"\n            class=\"cqa-text-[12px] cqa-leading-[15px] cqa-font-semibold cqa-text-[#3F43EE] cqa-no-underline cqa-flex cqa-items-center cqa-gap-1 hover:cqa-underline\">\n            <span>{{ isItemExpanded(item.id) ? 'Hide steps' : 'View steps' }}</span>\n            <svg [class.cqa-rotate-90]=\"isItemExpanded(item.id)\" class=\"cqa-transition-transform\" width=\"16\" height=\"15\"\n              viewBox=\"0 0 16 15\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M8.6552 12.8184L7.55413 11.7668L10.852 8.5864H2.83984V7.05032H10.852L7.55413 3.87506L8.6552 2.81836L13.8398 7.81836L8.6552 12.8184Z\"\n                fill=\"#3F43EE\" />\n            </svg>\n          </a>\n        </div>\n      </div>\n    </div>\n\n    <!-- Steps Content (shown when item is expanded) -->\n    <div *ngIf=\"isItemExpanded(item.id)\">\n      <!-- Custom template via TemplateRef (from @ContentChild or @Input) - passes item as context -->\n      <ng-container *ngIf=\"itemContentTpl || itemContentTemplate\">\n        <div class=\"cqa-p-3\">\n          <ng-container\n            *ngTemplateOutlet=\"(itemContentTpl || itemContentTemplate)!; context: { $implicit: item, item: item }\"></ng-container>\n        </div>\n      </ng-container>\n\n      <!-- Custom content projection via ng-content - displayed for all expanded items -->\n      <ng-content select=\"[itemContent]\"></ng-content>\n    </div>\n  </div>\n</div>\n\n<!-- Custom content projection after all items - for steps loaded after API call -->\n<ng-content select=\"[afterItems]\"></ng-content>", styles: [] }]
         }], propDecorators: { title: [{
                 type: Input
             }], items: [{
@@ -82,4 +82,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
             }], viewSteps: [{
                 type: Output
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWFpbi1zdGVwLWNvbGxhcHNlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvZXhlY3V0aW9uLXNjcmVlbi9tYWluLXN0ZXAtY29sbGFwc2UvbWFpbi1zdGVwLWNvbGxhcHNlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvZXhlY3V0aW9uLXNjcmVlbi9tYWluLXN0ZXAtY29sbGFwc2UvbWFpbi1zdGVwLWNvbGxhcHNlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQVUsV0FBVyxFQUFFLFlBQVksRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBZ0IxRyxNQUFNLE9BQU8seUJBQXlCO0lBTnRDO1FBT1csVUFBSyxHQUFXLGVBQWUsQ0FBQztRQUVoQyxhQUFRLEdBQVksSUFBSSxDQUFDO1FBS3hCLGNBQVMsR0FBRyxJQUFJLFlBQVksRUFBb0IsQ0FBQztRQUUzRCxlQUFVLEdBQVksSUFBSSxDQUFDO1FBQzNCLG1CQUFjLEdBQWtCLElBQUksQ0FBQyxDQUFDLG1EQUFtRDtLQTJEMUY7SUF6REMsUUFBUTtRQUNOLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQztJQUNsQyxDQUFDO0lBRUQsTUFBTTtRQUNKLElBQUksQ0FBQyxVQUFVLEdBQUcsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDO0lBQ3JDLENBQUM7SUFFRCxjQUFjLENBQUMsT0FBZTtRQUM1QixJQUFJLE9BQU8sR0FBRyxDQUFDLEVBQUU7WUFDZixPQUFPLEdBQUcsQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUM7U0FDM0M7UUFDRCxPQUFPLEdBQUcsT0FBTyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsR0FBRyxDQUFDO0lBQ2xDLENBQUM7SUFFRCxhQUFhLENBQUMsTUFBa0I7UUFDOUIsUUFBUSxNQUFNLEVBQUU7WUFDZCxLQUFLLFNBQVM7Z0JBQ1osT0FBTyxjQUFjLENBQUM7WUFDeEIsS0FBSyxRQUFRO2dCQUNYLE9BQU8sUUFBUSxDQUFDO1lBQ2xCLEtBQUssU0FBUztnQkFDWixPQUFPLFVBQVUsQ0FBQztZQUNwQixLQUFLLFNBQVM7Z0JBQ1osT0FBTyxNQUFNLENBQUM7WUFDaEI7Z0JBQ0UsT0FBTyxjQUFjLENBQUM7U0FDekI7SUFDSCxDQUFDO0lBR0QsV0FBVyxDQUFDLElBQXNCLEVBQUUsS0FBWTtRQUM5QyxLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7UUFDdkIsS0FBSyxDQUFDLGVBQWUsRUFBRSxDQUFDO1FBRXhCLHNHQUFzRztRQUN0RyxJQUFJLElBQUksQ0FBQyxjQUFjLEtBQUssSUFBSSxDQUFDLEVBQUUsRUFBRTtZQUNuQyxJQUFJLENBQUMsY0FBYyxHQUFHLElBQUksQ0FBQyxDQUFDLHdCQUF3QjtTQUNyRDthQUFNO1lBQ0wsSUFBSSxDQUFDLGNBQWMsR0FBRyxJQUFJLENBQUMsRUFBRSxDQUFDLENBQUMsd0RBQXdEO1NBQ3hGO1FBRUQsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDNUIsQ0FBQztJQUVELGNBQWMsQ0FBQyxNQUFjO1FBQzNCLE9BQU8sSUFBSSxDQUFDLGNBQWMsS0FBSyxNQUFNLENBQUM7SUFDeEMsQ0FBQztJQUVELGVBQWU7UUFDYiwrREFBK0Q7UUFDL0QsSUFBSSxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssSUFBSSxJQUFJLENBQUMsS0FBSyxDQUFDLE1BQU0sS0FBSyxDQUFDLENBQUMsSUFBSSxJQUFJLENBQUMsS0FBSyxLQUFLLFNBQVMsRUFBRTtZQUN4RSxPQUFPLElBQUksQ0FBQyxLQUFLLENBQUM7U0FDbkI7UUFDRCw2QkFBNkI7UUFDN0IsT0FBTyxJQUFJLENBQUMsS0FBSyxFQUFFLE1BQU0sSUFBSSxDQUFDLENBQUM7SUFDakMsQ0FBQzs7c0hBckVVLHlCQUF5QjswR0FBekIseUJBQXlCLDhXQU9DLFdBQVcsNkJDdkJsRCx5dFdBc0wrQzsyRkR0S2xDLHlCQUF5QjtrQkFOckMsU0FBUzsrQkFDRSx3QkFBd0IsUUFHNUIsRUFBRSxLQUFLLEVBQUUsYUFBYSxFQUFFOzhCQUdyQixLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxtQkFBbUI7c0JBQTNCLEtBQUs7Z0JBQzhDLGNBQWM7c0JBQWpFLFlBQVk7dUJBQUMsYUFBYSxFQUFFLEVBQUUsSUFBSSxFQUFFLFdBQVcsRUFBRTtnQkFDeEMsU0FBUztzQkFBbEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgRXZlbnRFbWl0dGVyLCBPbkluaXQsIFRlbXBsYXRlUmVmLCBDb250ZW50Q2hpbGQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFByZXJlcXVpc2l0ZUl0ZW0sIFN0ZXBTdGF0dXMgfSBmcm9tICcuLi9leGVjdXRpb24tc3RlcC5tb2RlbHMnO1xuXG5leHBvcnQgdHlwZSBJY29uVHlwZSA9ICdmb2xkZXInIHwgJ2xvb3AnIHwgJ2JhcicgfCAnY3VzdG9tJztcblxuZXhwb3J0IGludGVyZmFjZSBJY29uQ29uZmlnIHtcbiAgdHlwZTogSWNvblR5cGU7XG4gIHN2Zz86IHN0cmluZzsgLy8gQ3VzdG9tIFNWRyBzdHJpbmcgd2hlbiB0eXBlIGlzICdjdXN0b20nXG59XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2NxYS1tYWluLXN0ZXAtY29sbGFwc2UnLFxuICB0ZW1wbGF0ZVVybDogJy4vbWFpbi1zdGVwLWNvbGxhcHNlLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbXSxcbiAgaG9zdDogeyBjbGFzczogJ2NxYS11aS1yb290JyB9XG59KVxuZXhwb3J0IGNsYXNzIE1haW5TdGVwQ29sbGFwc2VDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICBASW5wdXQoKSB0aXRsZTogc3RyaW5nID0gJ1ByZXJlcXVpc2l0ZXMnO1xuICBASW5wdXQoKSBpdGVtcyE6IFByZXJlcXVpc2l0ZUl0ZW1bXTtcbiAgQElucHV0KCkgZXhwYW5kZWQ6IGJvb2xlYW4gPSB0cnVlO1xuICBASW5wdXQoKSBpY29uPzogSWNvbkNvbmZpZztcbiAgQElucHV0KCkgY291bnQ/OiBudW1iZXI7IC8vIENvdW50IHRvIGRpc3BsYXkgd2hlbiBpdGVtcyBhcnJheSBpcyBlbXB0eVxuICBASW5wdXQoKSBpdGVtQ29udGVudFRlbXBsYXRlPzogVGVtcGxhdGVSZWY8YW55PjsgLy8gVGVtcGxhdGUgZm9yIGN1c3RvbSBjb250ZW50IHVuZGVyIHN0ZXBzIChwcm9ncmFtbWF0aWMpXG4gIEBDb250ZW50Q2hpbGQoJ2l0ZW1Db250ZW50JywgeyByZWFkOiBUZW1wbGF0ZVJlZiB9KSBpdGVtQ29udGVudFRwbD86IFRlbXBsYXRlUmVmPGFueT47IC8vIFRlbXBsYXRlIHJlZmVyZW5jZSBmcm9tIG5nLXRlbXBsYXRlXG4gIEBPdXRwdXQoKSB2aWV3U3RlcHMgPSBuZXcgRXZlbnRFbWl0dGVyPFByZXJlcXVpc2l0ZUl0ZW0+KCk7XG5cbiAgaXNFeHBhbmRlZDogYm9vbGVhbiA9IHRydWU7XG4gIGV4cGFuZGVkSXRlbUlkOiBzdHJpbmcgfCBudWxsID0gbnVsbDsgLy8gVHJhY2sgd2hpY2ggaXRlbSdzIHN0ZXBzIGFyZSBjdXJyZW50bHkgZGlzcGxheWVkXG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgdGhpcy5pc0V4cGFuZGVkID0gdGhpcy5leHBhbmRlZDtcbiAgfVxuXG4gIHRvZ2dsZSgpOiB2b2lkIHtcbiAgICB0aGlzLmlzRXhwYW5kZWQgPSAhdGhpcy5pc0V4cGFuZGVkO1xuICB9XG5cbiAgZm9ybWF0RHVyYXRpb24oc2Vjb25kczogbnVtYmVyKTogc3RyaW5nIHtcbiAgICBpZiAoc2Vjb25kcyA8IDEpIHtcbiAgICAgIHJldHVybiBgJHsoc2Vjb25kcyAqIDEwMDApLnRvRml4ZWQoMCl9bXNgO1xuICAgIH1cbiAgICByZXR1cm4gYCR7c2Vjb25kcy50b0ZpeGVkKDEpfXNgO1xuICB9XG5cbiAgZ2V0U3RhdHVzSWNvbihzdGF0dXM6IFN0ZXBTdGF0dXMpOiBzdHJpbmcge1xuICAgIHN3aXRjaCAoc3RhdHVzKSB7XG4gICAgICBjYXNlICdzdWNjZXNzJzpcbiAgICAgICAgcmV0dXJuICdjaGVja19jaXJjbGUnO1xuICAgICAgY2FzZSAnZmFpbGVkJzpcbiAgICAgICAgcmV0dXJuICdjYW5jZWwnO1xuICAgICAgY2FzZSAncGVuZGluZyc6XG4gICAgICAgIHJldHVybiAnc2NoZWR1bGUnO1xuICAgICAgY2FzZSAncnVubmluZyc6XG4gICAgICAgIHJldHVybiAnc3luYyc7XG4gICAgICBkZWZhdWx0OlxuICAgICAgICByZXR1cm4gJ2hlbHBfb3V0bGluZSc7XG4gICAgfVxuICB9XG5cblxuICBvblZpZXdTdGVwcyhpdGVtOiBQcmVyZXF1aXNpdGVJdGVtLCBldmVudDogRXZlbnQpOiB2b2lkIHtcbiAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgIGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpO1xuICAgIFxuICAgIC8vIEFjY29yZGlvbiBiZWhhdmlvcjogaWYgY2xpY2tpbmcgdGhlIHNhbWUgaXRlbSwgY2xvc2UgaXQ7IG90aGVyd2lzZSwgY2xvc2UgcHJldmlvdXMgYW5kIG9wZW4gbmV3IG9uZVxuICAgIGlmICh0aGlzLmV4cGFuZGVkSXRlbUlkID09PSBpdGVtLmlkKSB7XG4gICAgICB0aGlzLmV4cGFuZGVkSXRlbUlkID0gbnVsbDsgLy8gQ2xvc2UgaWYgYWxyZWFkeSBvcGVuXG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuZXhwYW5kZWRJdGVtSWQgPSBpdGVtLmlkOyAvLyBPcGVuIHRoZSBjbGlja2VkIGl0ZW0gKGNsb3NlcyBwcmV2aW91cyBhdXRvbWF0aWNhbGx5KVxuICAgIH1cbiAgICBcbiAgICB0aGlzLnZpZXdTdGVwcy5lbWl0KGl0ZW0pO1xuICB9XG5cbiAgaXNJdGVtRXhwYW5kZWQoaXRlbUlkOiBzdHJpbmcpOiBib29sZWFuIHtcbiAgICByZXR1cm4gdGhpcy5leHBhbmRlZEl0ZW1JZCA9PT0gaXRlbUlkO1xuICB9XG5cbiAgZ2V0RGlzcGxheUNvdW50KCk6IG51bWJlciB7XG4gICAgLy8gSWYgaXRlbXMgaXMgZW1wdHkvdW5kZWZpbmVkIGFuZCBjb3VudCBpcyBwcm92aWRlZCwgdXNlIGNvdW50XG4gICAgaWYgKCghdGhpcy5pdGVtcyB8fCB0aGlzLml0ZW1zLmxlbmd0aCA9PT0gMCkgJiYgdGhpcy5jb3VudCAhPT0gdW5kZWZpbmVkKSB7XG4gICAgICByZXR1cm4gdGhpcy5jb3VudDtcbiAgICB9XG4gICAgLy8gT3RoZXJ3aXNlIHVzZSBpdGVtcyBsZW5ndGhcbiAgICByZXR1cm4gdGhpcy5pdGVtcz8ubGVuZ3RoIHx8IDA7XG4gIH1cbn1cbiIsIjwhLS0gSGVhZGVyIC0tPlxuPGRpdlxuICBjbGFzcz1cImNxYS1wdC0yIGNxYS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWp1c3RpZnktYmV0d2VlbiBjcWEtZ2FwLTMgY3FhLXB4LTMgY3FhLXB5LTIgY3FhLWN1cnNvci1wb2ludGVyIGNxYS1iZy1bI0VFRjJGRl0gY3FhLXJvdW5kZWQtWzRweF0gY3FhLWJvcmRlciBjcWEtYm9yZGVyLVsjQzZEMkZGXSBjcWEtYm9yZGVyLXNvbGlkXCJcbiAgKGNsaWNrKT1cInRvZ2dsZSgpXCI+XG4gIDxkaXYgY2xhc3M9XCJjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1nYXAtMyBjcWEtdy1mdWxsXCI+XG4gICAgPCEtLSBDaGV2cm9uIEljb24gKExlZnQpIC0tPlxuICAgIDwhLS0gPHN2ZyBbY2xhc3MuY3FhLXJvdGF0ZS0xODBdPVwiaXNFeHBhbmRlZFwiIGNsYXNzPVwiY3FhLXRyYW5zaXRpb24tdHJhbnNmb3JtXCIgd2lkdGg9XCIxNlwiIGhlaWdodD1cIjE2XCIgdmlld0JveD1cIjAgMCAxNiAxNlwiIGZpbGw9XCJub25lXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgIDxwYXRoIGQ9XCJNNCA2TDggMTBMMTIgNlwiIHN0cm9rZT1cIiMzRjUxQjVcIiBzdHJva2Utd2lkdGg9XCIxLjVcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIi8+XG4gIDwvc3ZnPiAtLT5cbiAgICA8ZGl2PjxzdmcgW2NsYXNzLmNxYS1yb3RhdGUtMTgwXT1cImlzRXhwYW5kZWRcIiB3aWR0aD1cIjE2XCIgaGVpZ2h0PVwiMTZcIiB2aWV3Qm94PVwiMCAwIDE2IDE2XCIgZmlsbD1cIm5vbmVcIlxuICAgICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCI+XG4gICAgICAgIDxwYXRoIGQ9XCJNNCA2TDggMTBMMTIgNlwiIHN0cm9rZT1cIiM0RjM5RjZcIiBzdHJva2Utd2lkdGg9XCIxLjMzMzMzXCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiXG4gICAgICAgICAgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIiAvPlxuICAgICAgPC9zdmc+PC9kaXY+XG5cbiAgICA8IS0tIENoYWluLUxpbmsgSWNvbiAoaWYgY29uZmlndXJlZCwgb3RoZXJ3aXNlIGRlZmF1bHQpIC0tPlxuICAgIDwhLS0gPGRpdiAqbmdJZj1cImljb24gJiYgaWNvbi50eXBlID09PSAnZm9sZGVyJ1wiPlxuICAgIDxzdmcgd2lkdGg9XCIxNlwiIGhlaWdodD1cIjE2XCIgdmlld0JveD1cIjAgMCAxNiAxNlwiIGZpbGw9XCJub25lXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgPHBhdGggZD1cIk0xMS42NjY2IDExLjY2NjdDMTEuOTc2IDExLjY2NjcgMTIuMjcyOCAxMS41NDM3IDEyLjQ5MTYgMTEuMzI1QzEyLjcxMDQgMTEuMTA2MiAxMi44MzMzIDEwLjgwOTQgMTIuODMzMyAxMC41VjQuNjY2NjdDMTIuODMzMyA0LjM1NzI1IDEyLjcxMDQgNC4wNjA1IDEyLjQ5MTYgMy44NDE3MUMxMi4yNzI4IDMuNjIyOTIgMTEuOTc2IDMuNSAxMS42NjY2IDMuNUg3LjA1ODI5QzYuODYzMTggMy41MDE5MSA2LjY3MDY5IDMuNDU0ODYgNi40OTg0NyAzLjM2MzE0QzYuMzI2MjQgMy4yNzE0MiA2LjE3OTc3IDMuMTM3OTcgNi4wNzI0NiAyLjk3NUw1LjU5OTk2IDIuMjc1QzUuNDkzNzMgMi4xMTM2OSA1LjM0OTExIDEuOTgxMjggNS4xNzkwOCAxLjg4OTY1QzUuMDA5MDYgMS43OTgwMiA0LjgxODk0IDEuNzUwMDMgNC42MjU3OSAxLjc1SDIuMzMzMjlDMi4wMjM4NyAxLjc1IDEuNzI3MTMgMS44NzI5MiAxLjUwODMzIDIuMDkxNzFDMS4yODk1NCAyLjMxMDUgMS4xNjY2MyAyLjYwNzI1IDEuMTY2NjMgMi45MTY2N1YxMC41QzEuMTY2NjMgMTAuODA5NCAxLjI4OTU0IDExLjEwNjIgMS41MDgzMyAxMS4zMjVDMS43MjcxMyAxMS41NDM3IDIuMDIzODcgMTEuNjY2NyAyLjMzMzI5IDExLjY2NjdIMTEuNjY2NlpcIiBmaWxsPVwiI0VGRjZGRlwiIHN0cm9rZT1cIiMzRjUxQjVcIiBzdHJva2Utd2lkdGg9XCIxLjE2NjY3XCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIvPlxuICAgIDwvc3ZnPlxuICA8L2Rpdj5cbiAgPGRpdiAqbmdJZj1cImljb24gJiYgaWNvbi50eXBlID09PSAnbG9vcCdcIj5cbiAgICA8c3ZnIHdpZHRoPVwiMTZcIiBoZWlnaHQ9XCIxNlwiIHZpZXdCb3g9XCIwIDAgMTYgMTZcIiBmaWxsPVwibm9uZVwiIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIj5cbiAgICAgIDxyZWN0IHdpZHRoPVwiMTZcIiBoZWlnaHQ9XCIxNlwiIHJ4PVwiNFwiIGZpbGw9XCIjRUJFQ0ZEXCIvPlxuICAgICAgPHBhdGggZD1cIk05LjY2NjYzIDQuNjY2NjZMMTEgNS45OTk5OUw5LjY2NjYzIDcuMzMzMzJcIiBzdHJva2U9XCIjM0Y1MUI1XCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIvPlxuICAgICAgPHBhdGggZD1cIk01IDcuNjY2NjdWNy4zMzMzM0M1IDYuOTc5NzEgNS4xNDA0OCA2LjY0MDU3IDUuMzkwNTIgNi4zOTA1MkM1LjY0MDU3IDYuMTQwNDggNS45Nzk3MSA2IDYuMzMzMzMgNkgxMVwiIHN0cm9rZT1cIiMzRjUxQjVcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIi8+XG4gICAgICA8cGF0aCBkPVwiTTYuMzMzMzMgMTEuMzMzM0w1IDkuOTk5OTlMNi4zMzMzMyA4LjY2NjY2XCIgc3Ryb2tlPVwiIzNGNTFCNVwiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIiBzdHJva2UtbGluZWpvaW49XCJyb3VuZFwiLz5cbiAgICAgIDxwYXRoIGQ9XCJNMTEgOC4zMzMzNFY4LjY2NjY4QzExIDkuMDIwMyAxMC44NTk1IDkuMzU5NDQgMTAuNjA5NSA5LjYwOTQ5QzEwLjM1OTQgOS44NTk1MyAxMC4wMjAzIDEwIDkuNjY2NjcgMTBINVwiIHN0cm9rZT1cIiMzRjUxQjVcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIi8+XG4gICAgPC9zdmc+XG4gIDwvZGl2PiAtLT5cbiAgICA8IS0tIEJhciBJY29uIChCdWxsZXRlZCBMaXN0KSAtLT5cbiAgICA8ZGl2ICpuZ0lmPVwiaWNvbiAmJiBpY29uLnR5cGUgPT09ICdiYXInXCI+XG4gICAgICA8c3ZnIHdpZHRoPVwiMjBcIiBoZWlnaHQ9XCIyMFwiIHZpZXdCb3g9XCIwIDAgMjAgMjBcIiBmaWxsPVwibm9uZVwiIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIj5cbiAgICAgICAgPCEtLSBGaXJzdCBidWxsZXQgYW5kIGxpbmUgLS0+XG4gICAgICAgIDxjaXJjbGUgY3g9XCIzXCIgY3k9XCI1XCIgcj1cIjJcIiBmaWxsPVwiIzRGMzlGNlwiLz5cbiAgICAgICAgPGxpbmUgeDE9XCI3XCIgeTE9XCI1XCIgeDI9XCIxN1wiIHkyPVwiNVwiIHN0cm9rZT1cIiM0RjM5RjZcIiBzdHJva2Utd2lkdGg9XCIxLjVcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIvPlxuICAgICAgICA8IS0tIFNlY29uZCBidWxsZXQgYW5kIGxpbmUgLS0+XG4gICAgICAgIDxjaXJjbGUgY3g9XCIzXCIgY3k9XCIxMFwiIHI9XCIyXCIgZmlsbD1cIiM0RjM5RjZcIi8+XG4gICAgICAgIDxsaW5lIHgxPVwiN1wiIHkxPVwiMTBcIiB4Mj1cIjE3XCIgeTI9XCIxMFwiIHN0cm9rZT1cIiM0RjM5RjZcIiBzdHJva2Utd2lkdGg9XCIxLjVcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIvPlxuICAgICAgICA8IS0tIFRoaXJkIGJ1bGxldCBhbmQgbGluZSAtLT5cbiAgICAgICAgPGNpcmNsZSBjeD1cIjNcIiBjeT1cIjE1XCIgcj1cIjJcIiBmaWxsPVwiIzRGMzlGNlwiLz5cbiAgICAgICAgPGxpbmUgeDE9XCI3XCIgeTE9XCIxNVwiIHgyPVwiMTdcIiB5Mj1cIjE1XCIgc3Ryb2tlPVwiIzRGMzlGNlwiIHN0cm9rZS13aWR0aD1cIjEuNVwiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIi8+XG4gICAgICA8L3N2Zz5cbiAgICA8L2Rpdj5cblxuICAgIDwhLS0gRGVmYXVsdCBDaGFpbi1MaW5rIEljb24gKHdoZW4gbm8gaWNvbiBvciBpY29uIHR5cGUgaXMgbm90IHNwZWNpZmllZCkgLS0+XG4gICAgPGRpdiAqbmdJZj1cIiFpY29uIHx8IChpY29uLnR5cGUgIT09ICdiYXInICYmIGljb24udHlwZSAhPT0gJ2ZvbGRlcicgJiYgaWNvbi50eXBlICE9PSAnbG9vcCcgJiYgaWNvbi50eXBlICE9PSAnY3VzdG9tJylcIj5cbiAgICAgIDxzdmcgd2lkdGg9XCIyMFwiIGhlaWdodD1cIjIwXCIgdmlld0JveD1cIjAgMCAyMCAyMFwiIGZpbGw9XCJub25lXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgICA8cGF0aFxuICAgICAgICAgIGQ9XCJNNy41MDAzMyAxNC4xNjYzSDUuODMzNjZDNC43Mjg1OSAxNC4xNjYzIDMuNjY4NzggMTMuNzI3NCAyLjg4NzM4IDEyLjk0NkMyLjEwNTk4IDEyLjE2NDYgMS42NjY5OSAxMS4xMDQ3IDEuNjY2OTkgOS45OTk2N0MxLjY2Njk5IDguODk0NjEgMi4xMDU5OCA3LjgzNDggMi44ODczOCA3LjA1MzRDMy42Njg3OCA2LjI3MTk5IDQuNzI4NTkgNS44MzMwMSA1LjgzMzY2IDUuODMzMDFINy41MDAzM1wiXG4gICAgICAgICAgc3Ryb2tlPVwiIzRGMzlGNlwiIHN0cm9rZS13aWR0aD1cIjEuNjY2NjdcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIiAvPlxuICAgICAgICA8cGF0aFxuICAgICAgICAgIGQ9XCJNMTIuNSA1LjgzMzAxSDE0LjE2NjdDMTUuMjcxNyA1LjgzMzAxIDE2LjMzMTUgNi4yNzE5OSAxNy4xMTI5IDcuMDUzNEMxNy44OTQzIDcuODM0OCAxOC4zMzMzIDguODk0NjEgMTguMzMzMyA5Ljk5OTY3QzE4LjMzMzMgMTEuMTA0NyAxNy44OTQzIDEyLjE2NDYgMTcuMTEyOSAxMi45NDZDMTYuMzMxNSAxMy43Mjc0IDE1LjI3MTcgMTQuMTY2MyAxNC4xNjY3IDE0LjE2NjNIMTIuNVwiXG4gICAgICAgICAgc3Ryb2tlPVwiIzRGMzlGNlwiIHN0cm9rZS13aWR0aD1cIjEuNjY2NjdcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIiAvPlxuICAgICAgICA8cGF0aCBkPVwiTTYuNjY2OTkgMTBIMTMuMzMzN1wiIHN0cm9rZT1cIiM0RjM5RjZcIiBzdHJva2Utd2lkdGg9XCIxLjY2NjY3XCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiXG4gICAgICAgICAgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIiAvPlxuICAgICAgPC9zdmc+XG4gICAgPC9kaXY+XG5cbiAgICA8IS0tIEN1c3RvbSBJY29uIC0tPlxuICAgIDxkaXYgKm5nSWY9XCJpY29uICYmIGljb24udHlwZSA9PT0gJ2N1c3RvbScgJiYgaWNvbi5zdmdcIiBbaW5uZXJIVE1MXT1cImljb24uc3ZnXCI+PC9kaXY+XG5cbiAgICA8IS0tIFRpdGxlIC0tPlxuICAgIDxzcGFuIGNsYXNzPVwiY3FhLWZvbnQtc2VtaWJvbGQgY3FhLXRleHQtWzE0cHhdIGNxYS1sZWFkaW5nLVsxN3B4XSBjcWEtdGV4dC1bIzMxMkM4NV0gY3FhLWZsZXgtMVwiPlxuICAgICAge3sgdGl0bGUgfX1cbiAgICA8L3NwYW4+XG5cbiAgICA8IS0tIEJhZGdlIC0tPlxuICAgIDxzcGFuXG4gICAgICBjbGFzcz1cImNxYS1weC0yIGNxYS1weS1bMnB4XSBjcWEtcm91bmRlZC1bNHB4XSBjcWEtYmctWyNDNkQyRkZdIGNxYS10ZXh0LVsxMnB4XSBjcWEtbGVhZGluZy1bMTZweF0gY3FhLXRleHQtWyM0MzJERDddXCI+XG4gICAgICB7eyBnZXREaXNwbGF5Q291bnQoKSB9fVxuICAgIDwvc3Bhbj5cbiAgPC9kaXY+XG48L2Rpdj5cblxuPCEtLSBFeHBhbmRlZCBDb250ZW50IC0tPlxuPGRpdiAqbmdJZj1cImlzRXhwYW5kZWRcIiBjbGFzcz1cImNxYS1tdC0yIGNxYS1mbGV4IGNxYS1mbGV4LWNvbCBjcWEtZ2FwLTIgY3FhLXB4LTIuNVwiPlxuICA8IS0tIFdoZW4gdGhlcmUgYXJlIG5vIGl0ZW1zLCBkaXNwbGF5IG5nLWNvbnRlbnQgZGlyZWN0bHkgLS0+XG4gIDxuZy1jb250YWluZXIgKm5nSWY9XCIhaXRlbXMgfHwgaXRlbXMubGVuZ3RoID09PSAwXCI+XG4gICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gIDwvbmctY29udGFpbmVyPlxuXG4gIDwhLS0gV2hlbiBpdGVtcyBleGlzdCwgZGlzcGxheSB0aGVtIC0tPlxuICA8ZGl2ICpuZ0Zvcj1cImxldCBpdGVtIG9mIGl0ZW1zXCI+XG5cbiAgICA8IS0tIEl0ZW0gSGVhZGVyIC0tPlxuICAgIDxkaXYgY2xhc3M9XCJjcWEtYmctd2hpdGUgY3FhLWJvcmRlciBjcWEtYm9yZGVyLXNvbGlkIGNxYS1ib3JkZXItWyNFNUU1RTVdIGNxYS1yb3VuZGVkLW1kIGNxYS1vdmVyZmxvdy1oaWRkZW5cIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJjcWEtcHktMiBjcWEtcHgtMyBjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1qdXN0aWZ5LWJldHdlZW4gY3FhLWdhcC0zXCI+XG4gICAgICAgIDwhLS0gTGVmdCBzaWRlOiBTdGF0dXMgYW5kIFRpdGxlIC0tPlxuICAgICAgICA8ZGl2IGNsYXNzPVwiY3FhLWZsZXggY3FhLWl0ZW1zLWNlbnRlciBjcWEtZ2FwLTMgY3FhLWZsZXgtMVwiPlxuICAgICAgICAgIDwhLS0gU3RhdHVzIEljb24gKEZpbGxlZCBHcmVlbiBDaXJjbGUgd2l0aCBDaGVja21hcmspIC0tPlxuICAgICAgICAgIDxkaXY+XG4gICAgICAgICAgICA8IS0tIFN1Y2Nlc3MgLS0+XG4gICAgICAgICAgICA8c3ZnICpuZ0lmPVwiaXRlbS5zdGF0dXMgPT09ICdzdWNjZXNzJ1wiIHdpZHRoPVwiMjBcIiBoZWlnaHQ9XCIyMFwiIHZpZXdCb3g9XCIwIDAgMjAgMjBcIiBmaWxsPVwibm9uZVwiXG4gICAgICAgICAgICAgIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIj5cbiAgICAgICAgICAgICAgPGcgY2xpcC1wYXRoPVwidXJsKCNjbGlwMF80OF8xMjEpXCI+XG4gICAgICAgICAgICAgICAgPHBhdGhcbiAgICAgICAgICAgICAgICAgIGQ9XCJNMTAuMDAwMyAxOC4zMzM3QzE0LjYwMjcgMTguMzMzNyAxOC4zMzM3IDE0LjYwMjcgMTguMzMzNyAxMC4wMDAzQzE4LjMzMzcgNS4zOTc5NSAxNC42MDI3IDEuNjY2OTkgMTAuMDAwMyAxLjY2Njk5QzUuMzk3OTUgMS42NjY5OSAxLjY2Njk5IDUuMzk3OTUgMS42NjY5OSAxMC4wMDAzQzEuNjY2OTkgMTQuNjAyNyA1LjM5Nzk1IDE4LjMzMzcgMTAuMDAwMyAxOC4zMzM3WlwiXG4gICAgICAgICAgICAgICAgICBzdHJva2U9XCIjMDBBNjNFXCIgc3Ryb2tlLXdpZHRoPVwiMS42NjY2N1wiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIiBzdHJva2UtbGluZWpvaW49XCJyb3VuZFwiIC8+XG4gICAgICAgICAgICAgICAgPHBhdGggZD1cIk03LjUgOS45OTk2N0w5LjE2NjY3IDExLjY2NjNMMTIuNSA4LjMzMzAxXCIgc3Ryb2tlPVwiIzAwQTYzRVwiIHN0cm9rZS13aWR0aD1cIjEuNjY2NjdcIlxuICAgICAgICAgICAgICAgICAgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIgLz5cbiAgICAgICAgICAgICAgPC9nPlxuICAgICAgICAgICAgICA8ZGVmcz5cbiAgICAgICAgICAgICAgICA8Y2xpcFBhdGggaWQ9XCJjbGlwMF80OF8xMjFcIj5cbiAgICAgICAgICAgICAgICAgIDxyZWN0IHdpZHRoPVwiMjBcIiBoZWlnaHQ9XCIyMFwiIGZpbGw9XCJ3aGl0ZVwiIC8+XG4gICAgICAgICAgICAgICAgPC9jbGlwUGF0aD5cbiAgICAgICAgICAgICAgPC9kZWZzPlxuICAgICAgICAgICAgPC9zdmc+XG4gICAgICAgICAgICA8IS0tIEZhaWxlZCAtLT5cbiAgICAgICAgICAgIDxzdmcgKm5nSWY9XCJpdGVtLnN0YXR1cyA9PT0gJ2ZhaWxlZCdcIiB3aWR0aD1cIjIwXCIgaGVpZ2h0PVwiMjBcIiB2aWV3Qm94PVwiMCAwIDIwIDIwXCIgZmlsbD1cIm5vbmVcIlxuICAgICAgICAgICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCI+XG4gICAgICAgICAgICAgIDxjaXJjbGUgY3g9XCIxMFwiIGN5PVwiMTBcIiByPVwiMTBcIiBmaWxsPVwiI0VGNDQ0NFwiIC8+XG4gICAgICAgICAgICAgIDxwYXRoIGQ9XCJNNyA3TDEzIDEzTTEzIDdMNyAxM1wiIHN0cm9rZT1cIndoaXRlXCIgc3Ryb2tlLXdpZHRoPVwiMlwiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIlxuICAgICAgICAgICAgICAgIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIgLz5cbiAgICAgICAgICAgIDwvc3ZnPlxuICAgICAgICAgICAgPCEtLSBQZW5kaW5nIC0tPlxuICAgICAgICAgICAgPHN2ZyAqbmdJZj1cIml0ZW0uc3RhdHVzID09PSAncGVuZGluZydcIiB3aWR0aD1cIjIwXCIgaGVpZ2h0PVwiMjBcIiB2aWV3Qm94PVwiMCAwIDIwIDIwXCIgZmlsbD1cIm5vbmVcIlxuICAgICAgICAgICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCI+XG4gICAgICAgICAgICAgIDxjaXJjbGUgY3g9XCIxMFwiIGN5PVwiMTBcIiByPVwiMTBcIiBmaWxsPVwiIzlDQTNBRlwiIC8+XG4gICAgICAgICAgICAgIDxwYXRoIGQ9XCJNMTAgNlYxMEwxMyAxMlwiIHN0cm9rZT1cIndoaXRlXCIgc3Ryb2tlLXdpZHRoPVwiMlwiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIiBzdHJva2UtbGluZWpvaW49XCJyb3VuZFwiIC8+XG4gICAgICAgICAgICA8L3N2Zz5cbiAgICAgICAgICAgIDwhLS0gUnVubmluZyAtLT5cbiAgICAgICAgICAgIDxzdmcgKm5nSWY9XCJpdGVtLnN0YXR1cyA9PT0gJ3J1bm5pbmcnXCIgd2lkdGg9XCIyMFwiIGhlaWdodD1cIjIwXCIgdmlld0JveD1cIjAgMCAyMCAyMFwiIGZpbGw9XCJub25lXCJcbiAgICAgICAgICAgICAgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgICAgICAgICA8Y2lyY2xlIGN4PVwiMTBcIiBjeT1cIjEwXCIgcj1cIjEwXCIgZmlsbD1cIiMzQjgyRjZcIiAvPlxuICAgICAgICAgICAgICA8cGF0aCBkPVwiTTEwIDZWMTBMMTMgMTJcIiBzdHJva2U9XCJ3aGl0ZVwiIHN0cm9rZS13aWR0aD1cIjJcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIiAvPlxuICAgICAgICAgICAgPC9zdmc+XG4gICAgICAgICAgPC9kaXY+XG4gIFxuICAgICAgICAgIDwhLS0gVGl0bGUgLS0+XG4gICAgICAgICAgPHNwYW4gY2xhc3M9XCJjcWEtdGV4dC1bMTRweF0gY3FhLWxlYWRpbmctWzE4cHhdXCI+XG4gICAgICAgICAgICB7eyBpdGVtLnRpdGxlIH19XG4gICAgICAgICAgPC9zcGFuPlxuICAgICAgICA8L2Rpdj5cbiAgXG4gICAgICAgIDwhLS0gUmlnaHQgc2lkZTogRHVyYXRpb24gYW5kIFZpZXcgU3RlcHMgTGluayAtLT5cbiAgICAgICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWdhcC0zXCI+XG4gICAgICAgICAgPCEtLSBEdXJhdGlvbiB3aXRoIENsb2NrIEljb24gLS0+XG4gICAgICAgICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWdhcC0xXCI+XG4gICAgICAgICAgICA8c3ZnIHdpZHRoPVwiMTJcIiBoZWlnaHQ9XCIxMlwiIHZpZXdCb3g9XCIwIDAgMTIgMTJcIiBmaWxsPVwibm9uZVwiIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIj5cbiAgICAgICAgICAgICAgPHBhdGhcbiAgICAgICAgICAgICAgICBkPVwiTTYgMTFDOC43NjE0MiAxMSAxMSA4Ljc2MTQyIDExIDZDMTEgMy4yMzg1OCA4Ljc2MTQyIDEgNiAxQzMuMjM4NTggMSAxIDMuMjM4NTggMSA2QzEgOC43NjE0MiAzLjIzODU4IDExIDYgMTFaXCJcbiAgICAgICAgICAgICAgICBzdHJva2U9XCIjNkE3MjgyXCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIgLz5cbiAgICAgICAgICAgICAgPHBhdGggZD1cIk02IDNWNkw4IDdcIiBzdHJva2U9XCIjNkE3MjgyXCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIgLz5cbiAgICAgICAgICAgIDwvc3ZnPlxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJjcWEtdGV4dC1bMTRweF0gY3FhLWxlYWRpbmctWzIwcHhdIGNxYS10ZXh0LVsjNkE3MjgyXVwiPlxuICAgICAgICAgICAgICB7eyBmb3JtYXREdXJhdGlvbihpdGVtLmR1cmF0aW9uKSB9fVxuICAgICAgICAgICAgPC9zcGFuPlxuICAgICAgICAgIDwvZGl2PlxuICBcbiAgICAgICAgICA8IS0tIFZpZXcgU3RlcHMgTGluayAtLT5cbiAgICAgICAgICA8YSBocmVmPVwiI1wiIChjbGljayk9XCJvblZpZXdTdGVwcyhpdGVtLCAkZXZlbnQpXCJcbiAgICAgICAgICAgIGNsYXNzPVwiY3FhLXRleHQtWzEycHhdIGNxYS1sZWFkaW5nLVsxNXB4XSBjcWEtZm9udC1zZW1pYm9sZCBjcWEtdGV4dC1bIzNGNDNFRV0gY3FhLW5vLXVuZGVybGluZSBjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1nYXAtMSBob3ZlcjpjcWEtdW5kZXJsaW5lXCI+XG4gICAgICAgICAgICA8c3Bhbj57eyBpc0l0ZW1FeHBhbmRlZChpdGVtLmlkKSA/ICdIaWRlIHN0ZXBzJyA6ICdWaWV3IHN0ZXBzJyB9fTwvc3Bhbj5cbiAgICAgICAgICAgIDxzdmcgW2NsYXNzLmNxYS1yb3RhdGUtOTBdPVwiaXNJdGVtRXhwYW5kZWQoaXRlbS5pZClcIiBjbGFzcz1cImNxYS10cmFuc2l0aW9uLXRyYW5zZm9ybVwiIHdpZHRoPVwiMTZcIiBoZWlnaHQ9XCIxNVwiXG4gICAgICAgICAgICAgIHZpZXdCb3g9XCIwIDAgMTYgMTVcIiBmaWxsPVwibm9uZVwiIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIj5cbiAgICAgICAgICAgICAgPHBhdGhcbiAgICAgICAgICAgICAgICBkPVwiTTguNjU1MiAxMi44MTg0TDcuNTU0MTMgMTEuNzY2OEwxMC44NTIgOC41ODY0SDIuODM5ODRWNy4wNTAzMkgxMC44NTJMNy41NTQxMyAzLjg3NTA2TDguNjU1MiAyLjgxODM2TDEzLjgzOTggNy44MTgzNkw4LjY1NTIgMTIuODE4NFpcIlxuICAgICAgICAgICAgICAgIGZpbGw9XCIjM0Y0M0VFXCIgLz5cbiAgICAgICAgICAgIDwvc3ZnPlxuICAgICAgICAgIDwvYT5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cblxuICAgIDwhLS0gU3RlcHMgQ29udGVudCAoc2hvd24gd2hlbiBpdGVtIGlzIGV4cGFuZGVkKSAtLT5cbiAgICA8ZGl2ICpuZ0lmPVwiaXNJdGVtRXhwYW5kZWQoaXRlbS5pZClcIj5cbiAgICAgIDwhLS0gQ3VzdG9tIHRlbXBsYXRlIHZpYSBUZW1wbGF0ZVJlZiAoZnJvbSBAQ29udGVudENoaWxkIG9yIEBJbnB1dCkgLSBwYXNzZXMgaXRlbSBhcyBjb250ZXh0IC0tPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIml0ZW1Db250ZW50VHBsIHx8IGl0ZW1Db250ZW50VGVtcGxhdGVcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImNxYS1wLTNcIj5cbiAgICAgICAgICA8bmctY29udGFpbmVyXG4gICAgICAgICAgICAqbmdUZW1wbGF0ZU91dGxldD1cIihpdGVtQ29udGVudFRwbCB8fCBpdGVtQ29udGVudFRlbXBsYXRlKSE7IGNvbnRleHQ6IHsgJGltcGxpY2l0OiBpdGVtLCBpdGVtOiBpdGVtIH1cIj48L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L25nLWNvbnRhaW5lcj5cblxuICAgICAgPCEtLSBDdXN0b20gY29udGVudCBwcm9qZWN0aW9uIHZpYSBuZy1jb250ZW50IC0gZGlzcGxheWVkIGZvciBhbGwgZXhwYW5kZWQgaXRlbXMgLS0+XG4gICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJbaXRlbUNvbnRlbnRdXCI+PC9uZy1jb250ZW50PlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbjwvZGl2PlxuXG48IS0tIEN1c3RvbSBjb250ZW50IHByb2plY3Rpb24gYWZ0ZXIgYWxsIGl0ZW1zIC0gZm9yIHN0ZXBzIGxvYWRlZCBhZnRlciBBUEkgY2FsbCAtLT5cbjxuZy1jb250ZW50IHNlbGVjdD1cIlthZnRlckl0ZW1zXVwiPjwvbmctY29udGVudD4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWFpbi1zdGVwLWNvbGxhcHNlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvZXhlY3V0aW9uLXNjcmVlbi9tYWluLXN0ZXAtY29sbGFwc2UvbWFpbi1zdGVwLWNvbGxhcHNlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvZXhlY3V0aW9uLXNjcmVlbi9tYWluLXN0ZXAtY29sbGFwc2UvbWFpbi1zdGVwLWNvbGxhcHNlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQVUsV0FBVyxFQUFFLFlBQVksRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBZ0IxRyxNQUFNLE9BQU8seUJBQXlCO0lBTnRDO1FBT1csVUFBSyxHQUFXLGVBQWUsQ0FBQztRQUVoQyxhQUFRLEdBQVksSUFBSSxDQUFDO1FBS3hCLGNBQVMsR0FBRyxJQUFJLFlBQVksRUFBb0IsQ0FBQztRQUUzRCxlQUFVLEdBQVksSUFBSSxDQUFDO1FBQzNCLG1CQUFjLEdBQWtCLElBQUksQ0FBQyxDQUFDLG1EQUFtRDtLQTJEMUY7SUF6REMsUUFBUTtRQUNOLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQztJQUNsQyxDQUFDO0lBRUQsTUFBTTtRQUNKLElBQUksQ0FBQyxVQUFVLEdBQUcsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDO0lBQ3JDLENBQUM7SUFFRCxjQUFjLENBQUMsT0FBZTtRQUM1QixJQUFJLE9BQU8sR0FBRyxDQUFDLEVBQUU7WUFDZixPQUFPLEdBQUcsQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUM7U0FDM0M7UUFDRCxPQUFPLEdBQUcsT0FBTyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsR0FBRyxDQUFDO0lBQ2xDLENBQUM7SUFFRCxhQUFhLENBQUMsTUFBa0I7UUFDOUIsUUFBUSxNQUFNLEVBQUU7WUFDZCxLQUFLLFNBQVM7Z0JBQ1osT0FBTyxjQUFjLENBQUM7WUFDeEIsS0FBSyxRQUFRO2dCQUNYLE9BQU8sUUFBUSxDQUFDO1lBQ2xCLEtBQUssU0FBUztnQkFDWixPQUFPLFVBQVUsQ0FBQztZQUNwQixLQUFLLFNBQVM7Z0JBQ1osT0FBTyxNQUFNLENBQUM7WUFDaEI7Z0JBQ0UsT0FBTyxjQUFjLENBQUM7U0FDekI7SUFDSCxDQUFDO0lBR0QsV0FBVyxDQUFDLElBQXNCLEVBQUUsS0FBWTtRQUM5QyxLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7UUFDdkIsS0FBSyxDQUFDLGVBQWUsRUFBRSxDQUFDO1FBRXhCLHNHQUFzRztRQUN0RyxJQUFJLElBQUksQ0FBQyxjQUFjLEtBQUssSUFBSSxDQUFDLEVBQUUsRUFBRTtZQUNuQyxJQUFJLENBQUMsY0FBYyxHQUFHLElBQUksQ0FBQyxDQUFDLHdCQUF3QjtTQUNyRDthQUFNO1lBQ0wsSUFBSSxDQUFDLGNBQWMsR0FBRyxJQUFJLENBQUMsRUFBRSxDQUFDLENBQUMsd0RBQXdEO1NBQ3hGO1FBRUQsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDNUIsQ0FBQztJQUVELGNBQWMsQ0FBQyxNQUFjO1FBQzNCLE9BQU8sSUFBSSxDQUFDLGNBQWMsS0FBSyxNQUFNLENBQUM7SUFDeEMsQ0FBQztJQUVELGVBQWU7UUFDYiwrREFBK0Q7UUFDL0QsSUFBSSxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssSUFBSSxJQUFJLENBQUMsS0FBSyxDQUFDLE1BQU0sS0FBSyxDQUFDLENBQUMsSUFBSSxJQUFJLENBQUMsS0FBSyxLQUFLLFNBQVMsRUFBRTtZQUN4RSxPQUFPLElBQUksQ0FBQyxLQUFLLENBQUM7U0FDbkI7UUFDRCw2QkFBNkI7UUFDN0IsT0FBTyxJQUFJLENBQUMsS0FBSyxFQUFFLE1BQU0sSUFBSSxDQUFDLENBQUM7SUFDakMsQ0FBQzs7c0hBckVVLHlCQUF5QjswR0FBekIseUJBQXlCLDhXQU9DLFdBQVcsNkJDdkJsRCx5dFdBc0wrQzsyRkR0S2xDLHlCQUF5QjtrQkFOckMsU0FBUzsrQkFDRSx3QkFBd0IsUUFHNUIsRUFBRSxLQUFLLEVBQUUsYUFBYSxFQUFFOzhCQUdyQixLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxtQkFBbUI7c0JBQTNCLEtBQUs7Z0JBQzhDLGNBQWM7c0JBQWpFLFlBQVk7dUJBQUMsYUFBYSxFQUFFLEVBQUUsSUFBSSxFQUFFLFdBQVcsRUFBRTtnQkFDeEMsU0FBUztzQkFBbEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgRXZlbnRFbWl0dGVyLCBPbkluaXQsIFRlbXBsYXRlUmVmLCBDb250ZW50Q2hpbGQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFByZXJlcXVpc2l0ZUl0ZW0sIFN0ZXBTdGF0dXMgfSBmcm9tICcuLi9leGVjdXRpb24tc3RlcC5tb2RlbHMnO1xuXG5leHBvcnQgdHlwZSBJY29uVHlwZSA9ICdmb2xkZXInIHwgJ2xvb3AnIHwgJ2JhcicgfCAnY3VzdG9tJztcblxuZXhwb3J0IGludGVyZmFjZSBJY29uQ29uZmlnIHtcbiAgdHlwZTogSWNvblR5cGU7XG4gIHN2Zz86IHN0cmluZzsgLy8gQ3VzdG9tIFNWRyBzdHJpbmcgd2hlbiB0eXBlIGlzICdjdXN0b20nXG59XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2NxYS1tYWluLXN0ZXAtY29sbGFwc2UnLFxuICB0ZW1wbGF0ZVVybDogJy4vbWFpbi1zdGVwLWNvbGxhcHNlLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbXSxcbiAgaG9zdDogeyBjbGFzczogJ2NxYS11aS1yb290JyB9XG59KVxuZXhwb3J0IGNsYXNzIE1haW5TdGVwQ29sbGFwc2VDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICBASW5wdXQoKSB0aXRsZTogc3RyaW5nID0gJ1ByZXJlcXVpc2l0ZXMnO1xuICBASW5wdXQoKSBpdGVtcyE6IFByZXJlcXVpc2l0ZUl0ZW1bXTtcbiAgQElucHV0KCkgZXhwYW5kZWQ6IGJvb2xlYW4gPSB0cnVlO1xuICBASW5wdXQoKSBpY29uPzogSWNvbkNvbmZpZztcbiAgQElucHV0KCkgY291bnQ/OiBudW1iZXI7IC8vIENvdW50IHRvIGRpc3BsYXkgd2hlbiBpdGVtcyBhcnJheSBpcyBlbXB0eVxuICBASW5wdXQoKSBpdGVtQ29udGVudFRlbXBsYXRlPzogVGVtcGxhdGVSZWY8YW55PjsgLy8gVGVtcGxhdGUgZm9yIGN1c3RvbSBjb250ZW50IHVuZGVyIHN0ZXBzIChwcm9ncmFtbWF0aWMpXG4gIEBDb250ZW50Q2hpbGQoJ2l0ZW1Db250ZW50JywgeyByZWFkOiBUZW1wbGF0ZVJlZiB9KSBpdGVtQ29udGVudFRwbD86IFRlbXBsYXRlUmVmPGFueT47IC8vIFRlbXBsYXRlIHJlZmVyZW5jZSBmcm9tIG5nLXRlbXBsYXRlXG4gIEBPdXRwdXQoKSB2aWV3U3RlcHMgPSBuZXcgRXZlbnRFbWl0dGVyPFByZXJlcXVpc2l0ZUl0ZW0+KCk7XG5cbiAgaXNFeHBhbmRlZDogYm9vbGVhbiA9IHRydWU7XG4gIGV4cGFuZGVkSXRlbUlkOiBzdHJpbmcgfCBudWxsID0gbnVsbDsgLy8gVHJhY2sgd2hpY2ggaXRlbSdzIHN0ZXBzIGFyZSBjdXJyZW50bHkgZGlzcGxheWVkXG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgdGhpcy5pc0V4cGFuZGVkID0gdGhpcy5leHBhbmRlZDtcbiAgfVxuXG4gIHRvZ2dsZSgpOiB2b2lkIHtcbiAgICB0aGlzLmlzRXhwYW5kZWQgPSAhdGhpcy5pc0V4cGFuZGVkO1xuICB9XG5cbiAgZm9ybWF0RHVyYXRpb24oc2Vjb25kczogbnVtYmVyKTogc3RyaW5nIHtcbiAgICBpZiAoc2Vjb25kcyA8IDEpIHtcbiAgICAgIHJldHVybiBgJHsoc2Vjb25kcyAqIDEwMDApLnRvRml4ZWQoMCl9bXNgO1xuICAgIH1cbiAgICByZXR1cm4gYCR7c2Vjb25kcy50b0ZpeGVkKDEpfXNgO1xuICB9XG5cbiAgZ2V0U3RhdHVzSWNvbihzdGF0dXM6IFN0ZXBTdGF0dXMpOiBzdHJpbmcge1xuICAgIHN3aXRjaCAoc3RhdHVzKSB7XG4gICAgICBjYXNlICdzdWNjZXNzJzpcbiAgICAgICAgcmV0dXJuICdjaGVja19jaXJjbGUnO1xuICAgICAgY2FzZSAnZmFpbGVkJzpcbiAgICAgICAgcmV0dXJuICdjYW5jZWwnO1xuICAgICAgY2FzZSAncGVuZGluZyc6XG4gICAgICAgIHJldHVybiAnc2NoZWR1bGUnO1xuICAgICAgY2FzZSAncnVubmluZyc6XG4gICAgICAgIHJldHVybiAnc3luYyc7XG4gICAgICBkZWZhdWx0OlxuICAgICAgICByZXR1cm4gJ2hlbHBfb3V0bGluZSc7XG4gICAgfVxuICB9XG5cblxuICBvblZpZXdTdGVwcyhpdGVtOiBQcmVyZXF1aXNpdGVJdGVtLCBldmVudDogRXZlbnQpOiB2b2lkIHtcbiAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgIGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpO1xuICAgIFxuICAgIC8vIEFjY29yZGlvbiBiZWhhdmlvcjogaWYgY2xpY2tpbmcgdGhlIHNhbWUgaXRlbSwgY2xvc2UgaXQ7IG90aGVyd2lzZSwgY2xvc2UgcHJldmlvdXMgYW5kIG9wZW4gbmV3IG9uZVxuICAgIGlmICh0aGlzLmV4cGFuZGVkSXRlbUlkID09PSBpdGVtLmlkKSB7XG4gICAgICB0aGlzLmV4cGFuZGVkSXRlbUlkID0gbnVsbDsgLy8gQ2xvc2UgaWYgYWxyZWFkeSBvcGVuXG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuZXhwYW5kZWRJdGVtSWQgPSBpdGVtLmlkOyAvLyBPcGVuIHRoZSBjbGlja2VkIGl0ZW0gKGNsb3NlcyBwcmV2aW91cyBhdXRvbWF0aWNhbGx5KVxuICAgIH1cbiAgICBcbiAgICB0aGlzLnZpZXdTdGVwcy5lbWl0KGl0ZW0pO1xuICB9XG5cbiAgaXNJdGVtRXhwYW5kZWQoaXRlbUlkOiBzdHJpbmcpOiBib29sZWFuIHtcbiAgICByZXR1cm4gdGhpcy5leHBhbmRlZEl0ZW1JZCA9PT0gaXRlbUlkO1xuICB9XG5cbiAgZ2V0RGlzcGxheUNvdW50KCk6IG51bWJlciB7XG4gICAgLy8gSWYgaXRlbXMgaXMgZW1wdHkvdW5kZWZpbmVkIGFuZCBjb3VudCBpcyBwcm92aWRlZCwgdXNlIGNvdW50XG4gICAgaWYgKCghdGhpcy5pdGVtcyB8fCB0aGlzLml0ZW1zLmxlbmd0aCA9PT0gMCkgJiYgdGhpcy5jb3VudCAhPT0gdW5kZWZpbmVkKSB7XG4gICAgICByZXR1cm4gdGhpcy5jb3VudDtcbiAgICB9XG4gICAgLy8gT3RoZXJ3aXNlIHVzZSBpdGVtcyBsZW5ndGhcbiAgICByZXR1cm4gdGhpcy5pdGVtcz8ubGVuZ3RoIHx8IDA7XG4gIH1cbn1cbiIsIjwhLS0gSGVhZGVyIC0tPlxuPGRpdlxuICBjbGFzcz1cImNxYS1tdC0yIGNxYS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWp1c3RpZnktYmV0d2VlbiBjcWEtZ2FwLTMgY3FhLXB4LTMgY3FhLXB5LTIgY3FhLWN1cnNvci1wb2ludGVyIGNxYS1iZy1bI0VFRjJGRl0gY3FhLXJvdW5kZWQtWzRweF0gY3FhLWJvcmRlciBjcWEtYm9yZGVyLVsjQzZEMkZGXSBjcWEtYm9yZGVyLXNvbGlkXCJcbiAgKGNsaWNrKT1cInRvZ2dsZSgpXCI+XG4gIDxkaXYgY2xhc3M9XCJjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1nYXAtMyBjcWEtdy1mdWxsXCI+XG4gICAgPCEtLSBDaGV2cm9uIEljb24gKExlZnQpIC0tPlxuICAgIDwhLS0gPHN2ZyBbY2xhc3MuY3FhLXJvdGF0ZS0xODBdPVwiaXNFeHBhbmRlZFwiIGNsYXNzPVwiY3FhLXRyYW5zaXRpb24tdHJhbnNmb3JtXCIgd2lkdGg9XCIxNlwiIGhlaWdodD1cIjE2XCIgdmlld0JveD1cIjAgMCAxNiAxNlwiIGZpbGw9XCJub25lXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgIDxwYXRoIGQ9XCJNNCA2TDggMTBMMTIgNlwiIHN0cm9rZT1cIiMzRjUxQjVcIiBzdHJva2Utd2lkdGg9XCIxLjVcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIi8+XG4gIDwvc3ZnPiAtLT5cbiAgICA8ZGl2PjxzdmcgW2NsYXNzLmNxYS1yb3RhdGUtMTgwXT1cImlzRXhwYW5kZWRcIiB3aWR0aD1cIjE2XCIgaGVpZ2h0PVwiMTZcIiB2aWV3Qm94PVwiMCAwIDE2IDE2XCIgZmlsbD1cIm5vbmVcIlxuICAgICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCI+XG4gICAgICAgIDxwYXRoIGQ9XCJNNCA2TDggMTBMMTIgNlwiIHN0cm9rZT1cIiM0RjM5RjZcIiBzdHJva2Utd2lkdGg9XCIxLjMzMzMzXCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiXG4gICAgICAgICAgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIiAvPlxuICAgICAgPC9zdmc+PC9kaXY+XG5cbiAgICA8IS0tIENoYWluLUxpbmsgSWNvbiAoaWYgY29uZmlndXJlZCwgb3RoZXJ3aXNlIGRlZmF1bHQpIC0tPlxuICAgIDwhLS0gPGRpdiAqbmdJZj1cImljb24gJiYgaWNvbi50eXBlID09PSAnZm9sZGVyJ1wiPlxuICAgIDxzdmcgd2lkdGg9XCIxNlwiIGhlaWdodD1cIjE2XCIgdmlld0JveD1cIjAgMCAxNiAxNlwiIGZpbGw9XCJub25lXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgPHBhdGggZD1cIk0xMS42NjY2IDExLjY2NjdDMTEuOTc2IDExLjY2NjcgMTIuMjcyOCAxMS41NDM3IDEyLjQ5MTYgMTEuMzI1QzEyLjcxMDQgMTEuMTA2MiAxMi44MzMzIDEwLjgwOTQgMTIuODMzMyAxMC41VjQuNjY2NjdDMTIuODMzMyA0LjM1NzI1IDEyLjcxMDQgNC4wNjA1IDEyLjQ5MTYgMy44NDE3MUMxMi4yNzI4IDMuNjIyOTIgMTEuOTc2IDMuNSAxMS42NjY2IDMuNUg3LjA1ODI5QzYuODYzMTggMy41MDE5MSA2LjY3MDY5IDMuNDU0ODYgNi40OTg0NyAzLjM2MzE0QzYuMzI2MjQgMy4yNzE0MiA2LjE3OTc3IDMuMTM3OTcgNi4wNzI0NiAyLjk3NUw1LjU5OTk2IDIuMjc1QzUuNDkzNzMgMi4xMTM2OSA1LjM0OTExIDEuOTgxMjggNS4xNzkwOCAxLjg4OTY1QzUuMDA5MDYgMS43OTgwMiA0LjgxODk0IDEuNzUwMDMgNC42MjU3OSAxLjc1SDIuMzMzMjlDMi4wMjM4NyAxLjc1IDEuNzI3MTMgMS44NzI5MiAxLjUwODMzIDIuMDkxNzFDMS4yODk1NCAyLjMxMDUgMS4xNjY2MyAyLjYwNzI1IDEuMTY2NjMgMi45MTY2N1YxMC41QzEuMTY2NjMgMTAuODA5NCAxLjI4OTU0IDExLjEwNjIgMS41MDgzMyAxMS4zMjVDMS43MjcxMyAxMS41NDM3IDIuMDIzODcgMTEuNjY2NyAyLjMzMzI5IDExLjY2NjdIMTEuNjY2NlpcIiBmaWxsPVwiI0VGRjZGRlwiIHN0cm9rZT1cIiMzRjUxQjVcIiBzdHJva2Utd2lkdGg9XCIxLjE2NjY3XCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIvPlxuICAgIDwvc3ZnPlxuICA8L2Rpdj5cbiAgPGRpdiAqbmdJZj1cImljb24gJiYgaWNvbi50eXBlID09PSAnbG9vcCdcIj5cbiAgICA8c3ZnIHdpZHRoPVwiMTZcIiBoZWlnaHQ9XCIxNlwiIHZpZXdCb3g9XCIwIDAgMTYgMTZcIiBmaWxsPVwibm9uZVwiIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIj5cbiAgICAgIDxyZWN0IHdpZHRoPVwiMTZcIiBoZWlnaHQ9XCIxNlwiIHJ4PVwiNFwiIGZpbGw9XCIjRUJFQ0ZEXCIvPlxuICAgICAgPHBhdGggZD1cIk05LjY2NjYzIDQuNjY2NjZMMTEgNS45OTk5OUw5LjY2NjYzIDcuMzMzMzJcIiBzdHJva2U9XCIjM0Y1MUI1XCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIvPlxuICAgICAgPHBhdGggZD1cIk01IDcuNjY2NjdWNy4zMzMzM0M1IDYuOTc5NzEgNS4xNDA0OCA2LjY0MDU3IDUuMzkwNTIgNi4zOTA1MkM1LjY0MDU3IDYuMTQwNDggNS45Nzk3MSA2IDYuMzMzMzMgNkgxMVwiIHN0cm9rZT1cIiMzRjUxQjVcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIi8+XG4gICAgICA8cGF0aCBkPVwiTTYuMzMzMzMgMTEuMzMzM0w1IDkuOTk5OTlMNi4zMzMzMyA4LjY2NjY2XCIgc3Ryb2tlPVwiIzNGNTFCNVwiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIiBzdHJva2UtbGluZWpvaW49XCJyb3VuZFwiLz5cbiAgICAgIDxwYXRoIGQ9XCJNMTEgOC4zMzMzNFY4LjY2NjY4QzExIDkuMDIwMyAxMC44NTk1IDkuMzU5NDQgMTAuNjA5NSA5LjYwOTQ5QzEwLjM1OTQgOS44NTk1MyAxMC4wMjAzIDEwIDkuNjY2NjcgMTBINVwiIHN0cm9rZT1cIiMzRjUxQjVcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIi8+XG4gICAgPC9zdmc+XG4gIDwvZGl2PiAtLT5cbiAgICA8IS0tIEJhciBJY29uIChCdWxsZXRlZCBMaXN0KSAtLT5cbiAgICA8ZGl2ICpuZ0lmPVwiaWNvbiAmJiBpY29uLnR5cGUgPT09ICdiYXInXCI+XG4gICAgICA8c3ZnIHdpZHRoPVwiMjBcIiBoZWlnaHQ9XCIyMFwiIHZpZXdCb3g9XCIwIDAgMjAgMjBcIiBmaWxsPVwibm9uZVwiIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIj5cbiAgICAgICAgPCEtLSBGaXJzdCBidWxsZXQgYW5kIGxpbmUgLS0+XG4gICAgICAgIDxjaXJjbGUgY3g9XCIzXCIgY3k9XCI1XCIgcj1cIjJcIiBmaWxsPVwiIzRGMzlGNlwiLz5cbiAgICAgICAgPGxpbmUgeDE9XCI3XCIgeTE9XCI1XCIgeDI9XCIxN1wiIHkyPVwiNVwiIHN0cm9rZT1cIiM0RjM5RjZcIiBzdHJva2Utd2lkdGg9XCIxLjVcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIvPlxuICAgICAgICA8IS0tIFNlY29uZCBidWxsZXQgYW5kIGxpbmUgLS0+XG4gICAgICAgIDxjaXJjbGUgY3g9XCIzXCIgY3k9XCIxMFwiIHI9XCIyXCIgZmlsbD1cIiM0RjM5RjZcIi8+XG4gICAgICAgIDxsaW5lIHgxPVwiN1wiIHkxPVwiMTBcIiB4Mj1cIjE3XCIgeTI9XCIxMFwiIHN0cm9rZT1cIiM0RjM5RjZcIiBzdHJva2Utd2lkdGg9XCIxLjVcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIvPlxuICAgICAgICA8IS0tIFRoaXJkIGJ1bGxldCBhbmQgbGluZSAtLT5cbiAgICAgICAgPGNpcmNsZSBjeD1cIjNcIiBjeT1cIjE1XCIgcj1cIjJcIiBmaWxsPVwiIzRGMzlGNlwiLz5cbiAgICAgICAgPGxpbmUgeDE9XCI3XCIgeTE9XCIxNVwiIHgyPVwiMTdcIiB5Mj1cIjE1XCIgc3Ryb2tlPVwiIzRGMzlGNlwiIHN0cm9rZS13aWR0aD1cIjEuNVwiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIi8+XG4gICAgICA8L3N2Zz5cbiAgICA8L2Rpdj5cblxuICAgIDwhLS0gRGVmYXVsdCBDaGFpbi1MaW5rIEljb24gKHdoZW4gbm8gaWNvbiBvciBpY29uIHR5cGUgaXMgbm90IHNwZWNpZmllZCkgLS0+XG4gICAgPGRpdiAqbmdJZj1cIiFpY29uIHx8IChpY29uLnR5cGUgIT09ICdiYXInICYmIGljb24udHlwZSAhPT0gJ2ZvbGRlcicgJiYgaWNvbi50eXBlICE9PSAnbG9vcCcgJiYgaWNvbi50eXBlICE9PSAnY3VzdG9tJylcIj5cbiAgICAgIDxzdmcgd2lkdGg9XCIyMFwiIGhlaWdodD1cIjIwXCIgdmlld0JveD1cIjAgMCAyMCAyMFwiIGZpbGw9XCJub25lXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgICA8cGF0aFxuICAgICAgICAgIGQ9XCJNNy41MDAzMyAxNC4xNjYzSDUuODMzNjZDNC43Mjg1OSAxNC4xNjYzIDMuNjY4NzggMTMuNzI3NCAyLjg4NzM4IDEyLjk0NkMyLjEwNTk4IDEyLjE2NDYgMS42NjY5OSAxMS4xMDQ3IDEuNjY2OTkgOS45OTk2N0MxLjY2Njk5IDguODk0NjEgMi4xMDU5OCA3LjgzNDggMi44ODczOCA3LjA1MzRDMy42Njg3OCA2LjI3MTk5IDQuNzI4NTkgNS44MzMwMSA1LjgzMzY2IDUuODMzMDFINy41MDAzM1wiXG4gICAgICAgICAgc3Ryb2tlPVwiIzRGMzlGNlwiIHN0cm9rZS13aWR0aD1cIjEuNjY2NjdcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIiAvPlxuICAgICAgICA8cGF0aFxuICAgICAgICAgIGQ9XCJNMTIuNSA1LjgzMzAxSDE0LjE2NjdDMTUuMjcxNyA1LjgzMzAxIDE2LjMzMTUgNi4yNzE5OSAxNy4xMTI5IDcuMDUzNEMxNy44OTQzIDcuODM0OCAxOC4zMzMzIDguODk0NjEgMTguMzMzMyA5Ljk5OTY3QzE4LjMzMzMgMTEuMTA0NyAxNy44OTQzIDEyLjE2NDYgMTcuMTEyOSAxMi45NDZDMTYuMzMxNSAxMy43Mjc0IDE1LjI3MTcgMTQuMTY2MyAxNC4xNjY3IDE0LjE2NjNIMTIuNVwiXG4gICAgICAgICAgc3Ryb2tlPVwiIzRGMzlGNlwiIHN0cm9rZS13aWR0aD1cIjEuNjY2NjdcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIiAvPlxuICAgICAgICA8cGF0aCBkPVwiTTYuNjY2OTkgMTBIMTMuMzMzN1wiIHN0cm9rZT1cIiM0RjM5RjZcIiBzdHJva2Utd2lkdGg9XCIxLjY2NjY3XCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiXG4gICAgICAgICAgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIiAvPlxuICAgICAgPC9zdmc+XG4gICAgPC9kaXY+XG5cbiAgICA8IS0tIEN1c3RvbSBJY29uIC0tPlxuICAgIDxkaXYgKm5nSWY9XCJpY29uICYmIGljb24udHlwZSA9PT0gJ2N1c3RvbScgJiYgaWNvbi5zdmdcIiBbaW5uZXJIVE1MXT1cImljb24uc3ZnXCI+PC9kaXY+XG5cbiAgICA8IS0tIFRpdGxlIC0tPlxuICAgIDxzcGFuIGNsYXNzPVwiY3FhLWZvbnQtc2VtaWJvbGQgY3FhLXRleHQtWzE0cHhdIGNxYS1sZWFkaW5nLVsxN3B4XSBjcWEtdGV4dC1bIzMxMkM4NV0gY3FhLWZsZXgtMVwiPlxuICAgICAge3sgdGl0bGUgfX1cbiAgICA8L3NwYW4+XG5cbiAgICA8IS0tIEJhZGdlIC0tPlxuICAgIDxzcGFuXG4gICAgICBjbGFzcz1cImNxYS1weC0yIGNxYS1weS1bMnB4XSBjcWEtcm91bmRlZC1bNHB4XSBjcWEtYmctWyNDNkQyRkZdIGNxYS10ZXh0LVsxMnB4XSBjcWEtbGVhZGluZy1bMTZweF0gY3FhLXRleHQtWyM0MzJERDddXCI+XG4gICAgICB7eyBnZXREaXNwbGF5Q291bnQoKSB9fVxuICAgIDwvc3Bhbj5cbiAgPC9kaXY+XG48L2Rpdj5cblxuPCEtLSBFeHBhbmRlZCBDb250ZW50IC0tPlxuPGRpdiAqbmdJZj1cImlzRXhwYW5kZWRcIiBjbGFzcz1cImNxYS1tdC0yIGNxYS1mbGV4IGNxYS1mbGV4LWNvbCBjcWEtZ2FwLTIgY3FhLXB4LTIuNVwiPlxuICA8IS0tIFdoZW4gdGhlcmUgYXJlIG5vIGl0ZW1zLCBkaXNwbGF5IG5nLWNvbnRlbnQgZGlyZWN0bHkgLS0+XG4gIDxuZy1jb250YWluZXIgKm5nSWY9XCIhaXRlbXMgfHwgaXRlbXMubGVuZ3RoID09PSAwXCI+XG4gICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gIDwvbmctY29udGFpbmVyPlxuXG4gIDwhLS0gV2hlbiBpdGVtcyBleGlzdCwgZGlzcGxheSB0aGVtIC0tPlxuICA8ZGl2ICpuZ0Zvcj1cImxldCBpdGVtIG9mIGl0ZW1zXCI+XG5cbiAgICA8IS0tIEl0ZW0gSGVhZGVyIC0tPlxuICAgIDxkaXYgY2xhc3M9XCJjcWEtYmctd2hpdGUgY3FhLWJvcmRlciBjcWEtYm9yZGVyLXNvbGlkIGNxYS1ib3JkZXItWyNFNUU1RTVdIGNxYS1yb3VuZGVkLW1kIGNxYS1vdmVyZmxvdy1oaWRkZW5cIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJjcWEtcHktMiBjcWEtcHgtMyBjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1qdXN0aWZ5LWJldHdlZW4gY3FhLWdhcC0zXCI+XG4gICAgICAgIDwhLS0gTGVmdCBzaWRlOiBTdGF0dXMgYW5kIFRpdGxlIC0tPlxuICAgICAgICA8ZGl2IGNsYXNzPVwiY3FhLWZsZXggY3FhLWl0ZW1zLWNlbnRlciBjcWEtZ2FwLTMgY3FhLWZsZXgtMVwiPlxuICAgICAgICAgIDwhLS0gU3RhdHVzIEljb24gKEZpbGxlZCBHcmVlbiBDaXJjbGUgd2l0aCBDaGVja21hcmspIC0tPlxuICAgICAgICAgIDxkaXY+XG4gICAgICAgICAgICA8IS0tIFN1Y2Nlc3MgLS0+XG4gICAgICAgICAgICA8c3ZnICpuZ0lmPVwiaXRlbS5zdGF0dXMgPT09ICdzdWNjZXNzJ1wiIHdpZHRoPVwiMjBcIiBoZWlnaHQ9XCIyMFwiIHZpZXdCb3g9XCIwIDAgMjAgMjBcIiBmaWxsPVwibm9uZVwiXG4gICAgICAgICAgICAgIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIj5cbiAgICAgICAgICAgICAgPGcgY2xpcC1wYXRoPVwidXJsKCNjbGlwMF80OF8xMjEpXCI+XG4gICAgICAgICAgICAgICAgPHBhdGhcbiAgICAgICAgICAgICAgICAgIGQ9XCJNMTAuMDAwMyAxOC4zMzM3QzE0LjYwMjcgMTguMzMzNyAxOC4zMzM3IDE0LjYwMjcgMTguMzMzNyAxMC4wMDAzQzE4LjMzMzcgNS4zOTc5NSAxNC42MDI3IDEuNjY2OTkgMTAuMDAwMyAxLjY2Njk5QzUuMzk3OTUgMS42NjY5OSAxLjY2Njk5IDUuMzk3OTUgMS42NjY5OSAxMC4wMDAzQzEuNjY2OTkgMTQuNjAyNyA1LjM5Nzk1IDE4LjMzMzcgMTAuMDAwMyAxOC4zMzM3WlwiXG4gICAgICAgICAgICAgICAgICBzdHJva2U9XCIjMDBBNjNFXCIgc3Ryb2tlLXdpZHRoPVwiMS42NjY2N1wiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIiBzdHJva2UtbGluZWpvaW49XCJyb3VuZFwiIC8+XG4gICAgICAgICAgICAgICAgPHBhdGggZD1cIk03LjUgOS45OTk2N0w5LjE2NjY3IDExLjY2NjNMMTIuNSA4LjMzMzAxXCIgc3Ryb2tlPVwiIzAwQTYzRVwiIHN0cm9rZS13aWR0aD1cIjEuNjY2NjdcIlxuICAgICAgICAgICAgICAgICAgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIgLz5cbiAgICAgICAgICAgICAgPC9nPlxuICAgICAgICAgICAgICA8ZGVmcz5cbiAgICAgICAgICAgICAgICA8Y2xpcFBhdGggaWQ9XCJjbGlwMF80OF8xMjFcIj5cbiAgICAgICAgICAgICAgICAgIDxyZWN0IHdpZHRoPVwiMjBcIiBoZWlnaHQ9XCIyMFwiIGZpbGw9XCJ3aGl0ZVwiIC8+XG4gICAgICAgICAgICAgICAgPC9jbGlwUGF0aD5cbiAgICAgICAgICAgICAgPC9kZWZzPlxuICAgICAgICAgICAgPC9zdmc+XG4gICAgICAgICAgICA8IS0tIEZhaWxlZCAtLT5cbiAgICAgICAgICAgIDxzdmcgKm5nSWY9XCJpdGVtLnN0YXR1cyA9PT0gJ2ZhaWxlZCdcIiB3aWR0aD1cIjIwXCIgaGVpZ2h0PVwiMjBcIiB2aWV3Qm94PVwiMCAwIDIwIDIwXCIgZmlsbD1cIm5vbmVcIlxuICAgICAgICAgICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCI+XG4gICAgICAgICAgICAgIDxjaXJjbGUgY3g9XCIxMFwiIGN5PVwiMTBcIiByPVwiMTBcIiBmaWxsPVwiI0VGNDQ0NFwiIC8+XG4gICAgICAgICAgICAgIDxwYXRoIGQ9XCJNNyA3TDEzIDEzTTEzIDdMNyAxM1wiIHN0cm9rZT1cIndoaXRlXCIgc3Ryb2tlLXdpZHRoPVwiMlwiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIlxuICAgICAgICAgICAgICAgIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIgLz5cbiAgICAgICAgICAgIDwvc3ZnPlxuICAgICAgICAgICAgPCEtLSBQZW5kaW5nIC0tPlxuICAgICAgICAgICAgPHN2ZyAqbmdJZj1cIml0ZW0uc3RhdHVzID09PSAncGVuZGluZydcIiB3aWR0aD1cIjIwXCIgaGVpZ2h0PVwiMjBcIiB2aWV3Qm94PVwiMCAwIDIwIDIwXCIgZmlsbD1cIm5vbmVcIlxuICAgICAgICAgICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCI+XG4gICAgICAgICAgICAgIDxjaXJjbGUgY3g9XCIxMFwiIGN5PVwiMTBcIiByPVwiMTBcIiBmaWxsPVwiIzlDQTNBRlwiIC8+XG4gICAgICAgICAgICAgIDxwYXRoIGQ9XCJNMTAgNlYxMEwxMyAxMlwiIHN0cm9rZT1cIndoaXRlXCIgc3Ryb2tlLXdpZHRoPVwiMlwiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIiBzdHJva2UtbGluZWpvaW49XCJyb3VuZFwiIC8+XG4gICAgICAgICAgICA8L3N2Zz5cbiAgICAgICAgICAgIDwhLS0gUnVubmluZyAtLT5cbiAgICAgICAgICAgIDxzdmcgKm5nSWY9XCJpdGVtLnN0YXR1cyA9PT0gJ3J1bm5pbmcnXCIgd2lkdGg9XCIyMFwiIGhlaWdodD1cIjIwXCIgdmlld0JveD1cIjAgMCAyMCAyMFwiIGZpbGw9XCJub25lXCJcbiAgICAgICAgICAgICAgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgICAgICAgICA8Y2lyY2xlIGN4PVwiMTBcIiBjeT1cIjEwXCIgcj1cIjEwXCIgZmlsbD1cIiMzQjgyRjZcIiAvPlxuICAgICAgICAgICAgICA8cGF0aCBkPVwiTTEwIDZWMTBMMTMgMTJcIiBzdHJva2U9XCJ3aGl0ZVwiIHN0cm9rZS13aWR0aD1cIjJcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIiAvPlxuICAgICAgICAgICAgPC9zdmc+XG4gICAgICAgICAgPC9kaXY+XG4gIFxuICAgICAgICAgIDwhLS0gVGl0bGUgLS0+XG4gICAgICAgICAgPHNwYW4gY2xhc3M9XCJjcWEtdGV4dC1bMTRweF0gY3FhLWxlYWRpbmctWzE4cHhdXCI+XG4gICAgICAgICAgICB7eyBpdGVtLnRpdGxlIH19XG4gICAgICAgICAgPC9zcGFuPlxuICAgICAgICA8L2Rpdj5cbiAgXG4gICAgICAgIDwhLS0gUmlnaHQgc2lkZTogRHVyYXRpb24gYW5kIFZpZXcgU3RlcHMgTGluayAtLT5cbiAgICAgICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWdhcC0zXCI+XG4gICAgICAgICAgPCEtLSBEdXJhdGlvbiB3aXRoIENsb2NrIEljb24gLS0+XG4gICAgICAgICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWdhcC0xXCI+XG4gICAgICAgICAgICA8c3ZnIHdpZHRoPVwiMTJcIiBoZWlnaHQ9XCIxMlwiIHZpZXdCb3g9XCIwIDAgMTIgMTJcIiBmaWxsPVwibm9uZVwiIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIj5cbiAgICAgICAgICAgICAgPHBhdGhcbiAgICAgICAgICAgICAgICBkPVwiTTYgMTFDOC43NjE0MiAxMSAxMSA4Ljc2MTQyIDExIDZDMTEgMy4yMzg1OCA4Ljc2MTQyIDEgNiAxQzMuMjM4NTggMSAxIDMuMjM4NTggMSA2QzEgOC43NjE0MiAzLjIzODU4IDExIDYgMTFaXCJcbiAgICAgICAgICAgICAgICBzdHJva2U9XCIjNkE3MjgyXCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIgLz5cbiAgICAgICAgICAgICAgPHBhdGggZD1cIk02IDNWNkw4IDdcIiBzdHJva2U9XCIjNkE3MjgyXCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIgLz5cbiAgICAgICAgICAgIDwvc3ZnPlxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJjcWEtdGV4dC1bMTRweF0gY3FhLWxlYWRpbmctWzIwcHhdIGNxYS10ZXh0LVsjNkE3MjgyXVwiPlxuICAgICAgICAgICAgICB7eyBmb3JtYXREdXJhdGlvbihpdGVtLmR1cmF0aW9uKSB9fVxuICAgICAgICAgICAgPC9zcGFuPlxuICAgICAgICAgIDwvZGl2PlxuICBcbiAgICAgICAgICA8IS0tIFZpZXcgU3RlcHMgTGluayAtLT5cbiAgICAgICAgICA8YSBocmVmPVwiI1wiIChjbGljayk9XCJvblZpZXdTdGVwcyhpdGVtLCAkZXZlbnQpXCJcbiAgICAgICAgICAgIGNsYXNzPVwiY3FhLXRleHQtWzEycHhdIGNxYS1sZWFkaW5nLVsxNXB4XSBjcWEtZm9udC1zZW1pYm9sZCBjcWEtdGV4dC1bIzNGNDNFRV0gY3FhLW5vLXVuZGVybGluZSBjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1nYXAtMSBob3ZlcjpjcWEtdW5kZXJsaW5lXCI+XG4gICAgICAgICAgICA8c3Bhbj57eyBpc0l0ZW1FeHBhbmRlZChpdGVtLmlkKSA/ICdIaWRlIHN0ZXBzJyA6ICdWaWV3IHN0ZXBzJyB9fTwvc3Bhbj5cbiAgICAgICAgICAgIDxzdmcgW2NsYXNzLmNxYS1yb3RhdGUtOTBdPVwiaXNJdGVtRXhwYW5kZWQoaXRlbS5pZClcIiBjbGFzcz1cImNxYS10cmFuc2l0aW9uLXRyYW5zZm9ybVwiIHdpZHRoPVwiMTZcIiBoZWlnaHQ9XCIxNVwiXG4gICAgICAgICAgICAgIHZpZXdCb3g9XCIwIDAgMTYgMTVcIiBmaWxsPVwibm9uZVwiIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIj5cbiAgICAgICAgICAgICAgPHBhdGhcbiAgICAgICAgICAgICAgICBkPVwiTTguNjU1MiAxMi44MTg0TDcuNTU0MTMgMTEuNzY2OEwxMC44NTIgOC41ODY0SDIuODM5ODRWNy4wNTAzMkgxMC44NTJMNy41NTQxMyAzLjg3NTA2TDguNjU1MiAyLjgxODM2TDEzLjgzOTggNy44MTgzNkw4LjY1NTIgMTIuODE4NFpcIlxuICAgICAgICAgICAgICAgIGZpbGw9XCIjM0Y0M0VFXCIgLz5cbiAgICAgICAgICAgIDwvc3ZnPlxuICAgICAgICAgIDwvYT5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cblxuICAgIDwhLS0gU3RlcHMgQ29udGVudCAoc2hvd24gd2hlbiBpdGVtIGlzIGV4cGFuZGVkKSAtLT5cbiAgICA8ZGl2ICpuZ0lmPVwiaXNJdGVtRXhwYW5kZWQoaXRlbS5pZClcIj5cbiAgICAgIDwhLS0gQ3VzdG9tIHRlbXBsYXRlIHZpYSBUZW1wbGF0ZVJlZiAoZnJvbSBAQ29udGVudENoaWxkIG9yIEBJbnB1dCkgLSBwYXNzZXMgaXRlbSBhcyBjb250ZXh0IC0tPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIml0ZW1Db250ZW50VHBsIHx8IGl0ZW1Db250ZW50VGVtcGxhdGVcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImNxYS1wLTNcIj5cbiAgICAgICAgICA8bmctY29udGFpbmVyXG4gICAgICAgICAgICAqbmdUZW1wbGF0ZU91dGxldD1cIihpdGVtQ29udGVudFRwbCB8fCBpdGVtQ29udGVudFRlbXBsYXRlKSE7IGNvbnRleHQ6IHsgJGltcGxpY2l0OiBpdGVtLCBpdGVtOiBpdGVtIH1cIj48L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L25nLWNvbnRhaW5lcj5cblxuICAgICAgPCEtLSBDdXN0b20gY29udGVudCBwcm9qZWN0aW9uIHZpYSBuZy1jb250ZW50IC0gZGlzcGxheWVkIGZvciBhbGwgZXhwYW5kZWQgaXRlbXMgLS0+XG4gICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJbaXRlbUNvbnRlbnRdXCI+PC9uZy1jb250ZW50PlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbjwvZGl2PlxuXG48IS0tIEN1c3RvbSBjb250ZW50IHByb2plY3Rpb24gYWZ0ZXIgYWxsIGl0ZW1zIC0gZm9yIHN0ZXBzIGxvYWRlZCBhZnRlciBBUEkgY2FsbCAtLT5cbjxuZy1jb250ZW50IHNlbGVjdD1cIlthZnRlckl0ZW1zXVwiPjwvbmctY29udGVudD4iXX0=

package/fesm2015/cqa-lib-cqa-ui.mjs CHANGED Viewed

@@ -6821,10 +6821,10 @@ class MainStepCollapseComponent {
     }
 }
 MainStepCollapseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: MainStepCollapseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MainStepCollapseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: MainStepCollapseComponent, selector: "cqa-main-step-collapse", inputs: { title: "title", items: "items", expanded: "expanded", icon: "icon", count: "count", itemContentTemplate: "itemContentTemplate" }, outputs: { viewSteps: "viewSteps" }, host: { classAttribute: "cqa-ui-root" }, queries: [{ propertyName: "itemContentTpl", first: true, predicate: ["itemContent"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<!-- Header -->\n<div\n  class=\"cqa-pt-2 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-px-3 cqa-py-2 cqa-cursor-pointer cqa-bg-[#EEF2FF] cqa-rounded-[4px] cqa-border cqa-border-[#C6D2FF] cqa-border-solid\"\n  (click)=\"toggle()\">\n  <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-w-full\">\n    <!-- Chevron Icon (Left) -->\n    <!-- <svg [class.cqa-rotate-180]=\"isExpanded\" class=\"cqa-transition-transform\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M4 6L8 10L12 6\" stroke=\"#3F51B5\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n  </svg> -->\n    <div><svg [class.cqa-rotate-180]=\"isExpanded\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M4 6L8 10L12 6\" stroke=\"#4F39F6\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg></div>\n\n    <!-- Chain-Link Icon (if configured, otherwise default) -->\n    <!-- <div *ngIf=\"icon && icon.type === 'folder'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M11.6666 11.6667C11.976 11.6667 12.2728 11.5437 12.4916 11.325C12.7104 11.1062 12.8333 10.8094 12.8333 10.5V4.66667C12.8333 4.35725 12.7104 4.0605 12.4916 3.84171C12.2728 3.62292 11.976 3.5 11.6666 3.5H7.05829C6.86318 3.50191 6.67069 3.45486 6.49847 3.36314C6.32624 3.27142 6.17977 3.13797 6.07246 2.975L5.59996 2.275C5.49373 2.11369 5.34911 1.98128 5.17908 1.88965C5.00906 1.79802 4.81894 1.75003 4.62579 1.75H2.33329C2.02387 1.75 1.72713 1.87292 1.50833 2.09171C1.28954 2.3105 1.16663 2.60725 1.16663 2.91667V10.5C1.16663 10.8094 1.28954 11.1062 1.50833 11.325C1.72713 11.5437 2.02387 11.6667 2.33329 11.6667H11.6666Z\" fill=\"#EFF6FF\" stroke=\"#3F51B5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div>\n  <div *ngIf=\"icon && icon.type === 'loop'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <rect width=\"16\" height=\"16\" rx=\"4\" fill=\"#EBECFD\"/>\n      <path d=\"M9.66663 4.66666L11 5.99999L9.66663 7.33332\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M5 7.66667V7.33333C5 6.97971 5.14048 6.64057 5.39052 6.39052C5.64057 6.14048 5.97971 6 6.33333 6H11\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M6.33333 11.3333L5 9.99999L6.33333 8.66666\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M11 8.33334V8.66668C11 9.0203 10.8595 9.35944 10.6095 9.60949C10.3594 9.85953 10.0203 10 9.66667 10H5\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div> -->\n    <!-- Bar Icon (Bulleted List) -->\n    <div *ngIf=\"icon && icon.type === 'bar'\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <!-- First bullet and line -->\n        <circle cx=\"3\" cy=\"5\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"5\" x2=\"17\" y2=\"5\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Second bullet and line -->\n        <circle cx=\"3\" cy=\"10\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"10\" x2=\"17\" y2=\"10\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Third bullet and line -->\n        <circle cx=\"3\" cy=\"15\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"15\" x2=\"17\" y2=\"15\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n      </svg>\n    </div>\n\n    <!-- Default Chain-Link Icon (when no icon or icon type is not specified) -->\n    <div *ngIf=\"!icon || (icon.type !== 'bar' && icon.type !== 'folder' && icon.type !== 'loop' && icon.type !== 'custom')\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M7.50033 14.1663H5.83366C4.72859 14.1663 3.66878 13.7274 2.88738 12.946C2.10598 12.1646 1.66699 11.1047 1.66699 9.99967C1.66699 8.89461 2.10598 7.8348 2.88738 7.0534C3.66878 6.27199 4.72859 5.83301 5.83366 5.83301H7.50033\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path\n          d=\"M12.5 5.83301H14.1667C15.2717 5.83301 16.3315 6.27199 17.1129 7.0534C17.8943 7.8348 18.3333 8.89461 18.3333 9.99967C18.3333 11.1047 17.8943 12.1646 17.1129 12.946C16.3315 13.7274 15.2717 14.1663 14.1667 14.1663H12.5\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path d=\"M6.66699 10H13.3337\" stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg>\n    </div>\n\n    <!-- Custom Icon -->\n    <div *ngIf=\"icon && icon.type === 'custom' && icon.svg\" [innerHTML]=\"icon.svg\"></div>\n\n    <!-- Title -->\n    <span class=\"cqa-font-semibold cqa-text-[14px] cqa-leading-[17px] cqa-text-[#312C85] cqa-flex-1\">\n      {{ title }}\n    </span>\n\n    <!-- Badge -->\n    <span\n      class=\"cqa-px-2 cqa-py-[2px] cqa-rounded-[4px] cqa-bg-[#C6D2FF] cqa-text-[12px] cqa-leading-[16px] cqa-text-[#432DD7]\">\n      {{ getDisplayCount() }}\n    </span>\n  </div>\n</div>\n\n<!-- Expanded Content -->\n<div *ngIf=\"isExpanded\" class=\"cqa-mt-2 cqa-flex cqa-flex-col cqa-gap-2 cqa-px-2.5\">\n  <!-- When there are no items, display ng-content directly -->\n  <ng-container *ngIf=\"!items || items.length === 0\">\n      <ng-content></ng-content>\n  </ng-container>\n\n  <!-- When items exist, display them -->\n  <div *ngFor=\"let item of items\">\n\n    <!-- Item Header -->\n    <div class=\"cqa-bg-white cqa-border cqa-border-solid cqa-border-[#E5E5E5] cqa-rounded-md cqa-overflow-hidden\">\n      <div class=\"cqa-py-2 cqa-px-3 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3\">\n        <!-- Left side: Status and Title -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-flex-1\">\n          <!-- Status Icon (Filled Green Circle with Checkmark) -->\n          <div>\n            <!-- Success -->\n            <svg *ngIf=\"item.status === 'success'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <g clip-path=\"url(#clip0_48_121)\">\n                <path\n                  d=\"M10.0003 18.3337C14.6027 18.3337 18.3337 14.6027 18.3337 10.0003C18.3337 5.39795 14.6027 1.66699 10.0003 1.66699C5.39795 1.66699 1.66699 5.39795 1.66699 10.0003C1.66699 14.6027 5.39795 18.3337 10.0003 18.3337Z\"\n                  stroke=\"#00A63E\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n                <path d=\"M7.5 9.99967L9.16667 11.6663L12.5 8.33301\" stroke=\"#00A63E\" stroke-width=\"1.66667\"\n                  stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_48_121\">\n                  <rect width=\"20\" height=\"20\" fill=\"white\" />\n                </clipPath>\n              </defs>\n            </svg>\n            <!-- Failed -->\n            <svg *ngIf=\"item.status === 'failed'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#EF4444\" />\n              <path d=\"M7 7L13 13M13 7L7 13\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Pending -->\n            <svg *ngIf=\"item.status === 'pending'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#9CA3AF\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Running -->\n            <svg *ngIf=\"item.status === 'running'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#3B82F6\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n          </div>\n  \n          <!-- Title -->\n          <span class=\"cqa-text-[14px] cqa-leading-[18px]\">\n            {{ item.title }}\n          </span>\n        </div>\n  \n        <!-- Right side: Duration and View Steps Link -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3\">\n          <!-- Duration with Clock Icon -->\n          <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n            <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\"\n                stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              <path d=\"M6 3V6L8 7\" stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <span class=\"cqa-text-[14px] cqa-leading-[20px] cqa-text-[#6A7282]\">\n              {{ formatDuration(item.duration) }}\n            </span>\n          </div>\n  \n          <!-- View Steps Link -->\n          <a href=\"#\" (click)=\"onViewSteps(item, $event)\"\n            class=\"cqa-text-[12px] cqa-leading-[15px] cqa-font-semibold cqa-text-[#3F43EE] cqa-no-underline cqa-flex cqa-items-center cqa-gap-1 hover:cqa-underline\">\n            <span>{{ isItemExpanded(item.id) ? 'Hide steps' : 'View steps' }}</span>\n            <svg [class.cqa-rotate-90]=\"isItemExpanded(item.id)\" class=\"cqa-transition-transform\" width=\"16\" height=\"15\"\n              viewBox=\"0 0 16 15\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M8.6552 12.8184L7.55413 11.7668L10.852 8.5864H2.83984V7.05032H10.852L7.55413 3.87506L8.6552 2.81836L13.8398 7.81836L8.6552 12.8184Z\"\n                fill=\"#3F43EE\" />\n            </svg>\n          </a>\n        </div>\n      </div>\n    </div>\n\n    <!-- Steps Content (shown when item is expanded) -->\n    <div *ngIf=\"isItemExpanded(item.id)\">\n      <!-- Custom template via TemplateRef (from @ContentChild or @Input) - passes item as context -->\n      <ng-container *ngIf=\"itemContentTpl || itemContentTemplate\">\n        <div class=\"cqa-p-3\">\n          <ng-container\n            *ngTemplateOutlet=\"(itemContentTpl || itemContentTemplate)!; context: { $implicit: item, item: item }\"></ng-container>\n        </div>\n      </ng-container>\n\n      <!-- Custom content projection via ng-content - displayed for all expanded items -->\n      <ng-content select=\"[itemContent]\"></ng-content>\n    </div>\n  </div>\n</div>\n\n<!-- Custom content projection after all items - for steps loaded after API call -->\n<ng-content select=\"[afterItems]\"></ng-content>", directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+MainStepCollapseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: MainStepCollapseComponent, selector: "cqa-main-step-collapse", inputs: { title: "title", items: "items", expanded: "expanded", icon: "icon", count: "count", itemContentTemplate: "itemContentTemplate" }, outputs: { viewSteps: "viewSteps" }, host: { classAttribute: "cqa-ui-root" }, queries: [{ propertyName: "itemContentTpl", first: true, predicate: ["itemContent"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<!-- Header -->\n<div\n  class=\"cqa-mt-2 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-px-3 cqa-py-2 cqa-cursor-pointer cqa-bg-[#EEF2FF] cqa-rounded-[4px] cqa-border cqa-border-[#C6D2FF] cqa-border-solid\"\n  (click)=\"toggle()\">\n  <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-w-full\">\n    <!-- Chevron Icon (Left) -->\n    <!-- <svg [class.cqa-rotate-180]=\"isExpanded\" class=\"cqa-transition-transform\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M4 6L8 10L12 6\" stroke=\"#3F51B5\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n  </svg> -->\n    <div><svg [class.cqa-rotate-180]=\"isExpanded\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M4 6L8 10L12 6\" stroke=\"#4F39F6\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg></div>\n\n    <!-- Chain-Link Icon (if configured, otherwise default) -->\n    <!-- <div *ngIf=\"icon && icon.type === 'folder'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M11.6666 11.6667C11.976 11.6667 12.2728 11.5437 12.4916 11.325C12.7104 11.1062 12.8333 10.8094 12.8333 10.5V4.66667C12.8333 4.35725 12.7104 4.0605 12.4916 3.84171C12.2728 3.62292 11.976 3.5 11.6666 3.5H7.05829C6.86318 3.50191 6.67069 3.45486 6.49847 3.36314C6.32624 3.27142 6.17977 3.13797 6.07246 2.975L5.59996 2.275C5.49373 2.11369 5.34911 1.98128 5.17908 1.88965C5.00906 1.79802 4.81894 1.75003 4.62579 1.75H2.33329C2.02387 1.75 1.72713 1.87292 1.50833 2.09171C1.28954 2.3105 1.16663 2.60725 1.16663 2.91667V10.5C1.16663 10.8094 1.28954 11.1062 1.50833 11.325C1.72713 11.5437 2.02387 11.6667 2.33329 11.6667H11.6666Z\" fill=\"#EFF6FF\" stroke=\"#3F51B5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div>\n  <div *ngIf=\"icon && icon.type === 'loop'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <rect width=\"16\" height=\"16\" rx=\"4\" fill=\"#EBECFD\"/>\n      <path d=\"M9.66663 4.66666L11 5.99999L9.66663 7.33332\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M5 7.66667V7.33333C5 6.97971 5.14048 6.64057 5.39052 6.39052C5.64057 6.14048 5.97971 6 6.33333 6H11\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M6.33333 11.3333L5 9.99999L6.33333 8.66666\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M11 8.33334V8.66668C11 9.0203 10.8595 9.35944 10.6095 9.60949C10.3594 9.85953 10.0203 10 9.66667 10H5\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div> -->\n    <!-- Bar Icon (Bulleted List) -->\n    <div *ngIf=\"icon && icon.type === 'bar'\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <!-- First bullet and line -->\n        <circle cx=\"3\" cy=\"5\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"5\" x2=\"17\" y2=\"5\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Second bullet and line -->\n        <circle cx=\"3\" cy=\"10\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"10\" x2=\"17\" y2=\"10\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Third bullet and line -->\n        <circle cx=\"3\" cy=\"15\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"15\" x2=\"17\" y2=\"15\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n      </svg>\n    </div>\n\n    <!-- Default Chain-Link Icon (when no icon or icon type is not specified) -->\n    <div *ngIf=\"!icon || (icon.type !== 'bar' && icon.type !== 'folder' && icon.type !== 'loop' && icon.type !== 'custom')\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M7.50033 14.1663H5.83366C4.72859 14.1663 3.66878 13.7274 2.88738 12.946C2.10598 12.1646 1.66699 11.1047 1.66699 9.99967C1.66699 8.89461 2.10598 7.8348 2.88738 7.0534C3.66878 6.27199 4.72859 5.83301 5.83366 5.83301H7.50033\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path\n          d=\"M12.5 5.83301H14.1667C15.2717 5.83301 16.3315 6.27199 17.1129 7.0534C17.8943 7.8348 18.3333 8.89461 18.3333 9.99967C18.3333 11.1047 17.8943 12.1646 17.1129 12.946C16.3315 13.7274 15.2717 14.1663 14.1667 14.1663H12.5\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path d=\"M6.66699 10H13.3337\" stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg>\n    </div>\n\n    <!-- Custom Icon -->\n    <div *ngIf=\"icon && icon.type === 'custom' && icon.svg\" [innerHTML]=\"icon.svg\"></div>\n\n    <!-- Title -->\n    <span class=\"cqa-font-semibold cqa-text-[14px] cqa-leading-[17px] cqa-text-[#312C85] cqa-flex-1\">\n      {{ title }}\n    </span>\n\n    <!-- Badge -->\n    <span\n      class=\"cqa-px-2 cqa-py-[2px] cqa-rounded-[4px] cqa-bg-[#C6D2FF] cqa-text-[12px] cqa-leading-[16px] cqa-text-[#432DD7]\">\n      {{ getDisplayCount() }}\n    </span>\n  </div>\n</div>\n\n<!-- Expanded Content -->\n<div *ngIf=\"isExpanded\" class=\"cqa-mt-2 cqa-flex cqa-flex-col cqa-gap-2 cqa-px-2.5\">\n  <!-- When there are no items, display ng-content directly -->\n  <ng-container *ngIf=\"!items || items.length === 0\">\n      <ng-content></ng-content>\n  </ng-container>\n\n  <!-- When items exist, display them -->\n  <div *ngFor=\"let item of items\">\n\n    <!-- Item Header -->\n    <div class=\"cqa-bg-white cqa-border cqa-border-solid cqa-border-[#E5E5E5] cqa-rounded-md cqa-overflow-hidden\">\n      <div class=\"cqa-py-2 cqa-px-3 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3\">\n        <!-- Left side: Status and Title -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-flex-1\">\n          <!-- Status Icon (Filled Green Circle with Checkmark) -->\n          <div>\n            <!-- Success -->\n            <svg *ngIf=\"item.status === 'success'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <g clip-path=\"url(#clip0_48_121)\">\n                <path\n                  d=\"M10.0003 18.3337C14.6027 18.3337 18.3337 14.6027 18.3337 10.0003C18.3337 5.39795 14.6027 1.66699 10.0003 1.66699C5.39795 1.66699 1.66699 5.39795 1.66699 10.0003C1.66699 14.6027 5.39795 18.3337 10.0003 18.3337Z\"\n                  stroke=\"#00A63E\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n                <path d=\"M7.5 9.99967L9.16667 11.6663L12.5 8.33301\" stroke=\"#00A63E\" stroke-width=\"1.66667\"\n                  stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_48_121\">\n                  <rect width=\"20\" height=\"20\" fill=\"white\" />\n                </clipPath>\n              </defs>\n            </svg>\n            <!-- Failed -->\n            <svg *ngIf=\"item.status === 'failed'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#EF4444\" />\n              <path d=\"M7 7L13 13M13 7L7 13\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Pending -->\n            <svg *ngIf=\"item.status === 'pending'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#9CA3AF\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Running -->\n            <svg *ngIf=\"item.status === 'running'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#3B82F6\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n          </div>\n  \n          <!-- Title -->\n          <span class=\"cqa-text-[14px] cqa-leading-[18px]\">\n            {{ item.title }}\n          </span>\n        </div>\n  \n        <!-- Right side: Duration and View Steps Link -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3\">\n          <!-- Duration with Clock Icon -->\n          <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n            <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\"\n                stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              <path d=\"M6 3V6L8 7\" stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <span class=\"cqa-text-[14px] cqa-leading-[20px] cqa-text-[#6A7282]\">\n              {{ formatDuration(item.duration) }}\n            </span>\n          </div>\n  \n          <!-- View Steps Link -->\n          <a href=\"#\" (click)=\"onViewSteps(item, $event)\"\n            class=\"cqa-text-[12px] cqa-leading-[15px] cqa-font-semibold cqa-text-[#3F43EE] cqa-no-underline cqa-flex cqa-items-center cqa-gap-1 hover:cqa-underline\">\n            <span>{{ isItemExpanded(item.id) ? 'Hide steps' : 'View steps' }}</span>\n            <svg [class.cqa-rotate-90]=\"isItemExpanded(item.id)\" class=\"cqa-transition-transform\" width=\"16\" height=\"15\"\n              viewBox=\"0 0 16 15\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M8.6552 12.8184L7.55413 11.7668L10.852 8.5864H2.83984V7.05032H10.852L7.55413 3.87506L8.6552 2.81836L13.8398 7.81836L8.6552 12.8184Z\"\n                fill=\"#3F43EE\" />\n            </svg>\n          </a>\n        </div>\n      </div>\n    </div>\n\n    <!-- Steps Content (shown when item is expanded) -->\n    <div *ngIf=\"isItemExpanded(item.id)\">\n      <!-- Custom template via TemplateRef (from @ContentChild or @Input) - passes item as context -->\n      <ng-container *ngIf=\"itemContentTpl || itemContentTemplate\">\n        <div class=\"cqa-p-3\">\n          <ng-container\n            *ngTemplateOutlet=\"(itemContentTpl || itemContentTemplate)!; context: { $implicit: item, item: item }\"></ng-container>\n        </div>\n      </ng-container>\n\n      <!-- Custom content projection via ng-content - displayed for all expanded items -->\n      <ng-content select=\"[itemContent]\"></ng-content>\n    </div>\n  </div>\n</div>\n\n<!-- Custom content projection after all items - for steps loaded after API call -->\n<ng-content select=\"[afterItems]\"></ng-content>", directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: MainStepCollapseComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cqa-main-step-collapse', host: { class: 'cqa-ui-root' }, template: "<!-- Header -->\n<div\n  class=\"cqa-pt-2 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-px-3 cqa-py-2 cqa-cursor-pointer cqa-bg-[#EEF2FF] cqa-rounded-[4px] cqa-border cqa-border-[#C6D2FF] cqa-border-solid\"\n  (click)=\"toggle()\">\n  <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-w-full\">\n    <!-- Chevron Icon (Left) -->\n    <!-- <svg [class.cqa-rotate-180]=\"isExpanded\" class=\"cqa-transition-transform\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M4 6L8 10L12 6\" stroke=\"#3F51B5\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n  </svg> -->\n    <div><svg [class.cqa-rotate-180]=\"isExpanded\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M4 6L8 10L12 6\" stroke=\"#4F39F6\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg></div>\n\n    <!-- Chain-Link Icon (if configured, otherwise default) -->\n    <!-- <div *ngIf=\"icon && icon.type === 'folder'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M11.6666 11.6667C11.976 11.6667 12.2728 11.5437 12.4916 11.325C12.7104 11.1062 12.8333 10.8094 12.8333 10.5V4.66667C12.8333 4.35725 12.7104 4.0605 12.4916 3.84171C12.2728 3.62292 11.976 3.5 11.6666 3.5H7.05829C6.86318 3.50191 6.67069 3.45486 6.49847 3.36314C6.32624 3.27142 6.17977 3.13797 6.07246 2.975L5.59996 2.275C5.49373 2.11369 5.34911 1.98128 5.17908 1.88965C5.00906 1.79802 4.81894 1.75003 4.62579 1.75H2.33329C2.02387 1.75 1.72713 1.87292 1.50833 2.09171C1.28954 2.3105 1.16663 2.60725 1.16663 2.91667V10.5C1.16663 10.8094 1.28954 11.1062 1.50833 11.325C1.72713 11.5437 2.02387 11.6667 2.33329 11.6667H11.6666Z\" fill=\"#EFF6FF\" stroke=\"#3F51B5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div>\n  <div *ngIf=\"icon && icon.type === 'loop'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <rect width=\"16\" height=\"16\" rx=\"4\" fill=\"#EBECFD\"/>\n      <path d=\"M9.66663 4.66666L11 5.99999L9.66663 7.33332\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M5 7.66667V7.33333C5 6.97971 5.14048 6.64057 5.39052 6.39052C5.64057 6.14048 5.97971 6 6.33333 6H11\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M6.33333 11.3333L5 9.99999L6.33333 8.66666\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M11 8.33334V8.66668C11 9.0203 10.8595 9.35944 10.6095 9.60949C10.3594 9.85953 10.0203 10 9.66667 10H5\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div> -->\n    <!-- Bar Icon (Bulleted List) -->\n    <div *ngIf=\"icon && icon.type === 'bar'\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <!-- First bullet and line -->\n        <circle cx=\"3\" cy=\"5\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"5\" x2=\"17\" y2=\"5\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Second bullet and line -->\n        <circle cx=\"3\" cy=\"10\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"10\" x2=\"17\" y2=\"10\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Third bullet and line -->\n        <circle cx=\"3\" cy=\"15\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"15\" x2=\"17\" y2=\"15\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n      </svg>\n    </div>\n\n    <!-- Default Chain-Link Icon (when no icon or icon type is not specified) -->\n    <div *ngIf=\"!icon || (icon.type !== 'bar' && icon.type !== 'folder' && icon.type !== 'loop' && icon.type !== 'custom')\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M7.50033 14.1663H5.83366C4.72859 14.1663 3.66878 13.7274 2.88738 12.946C2.10598 12.1646 1.66699 11.1047 1.66699 9.99967C1.66699 8.89461 2.10598 7.8348 2.88738 7.0534C3.66878 6.27199 4.72859 5.83301 5.83366 5.83301H7.50033\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path\n          d=\"M12.5 5.83301H14.1667C15.2717 5.83301 16.3315 6.27199 17.1129 7.0534C17.8943 7.8348 18.3333 8.89461 18.3333 9.99967C18.3333 11.1047 17.8943 12.1646 17.1129 12.946C16.3315 13.7274 15.2717 14.1663 14.1667 14.1663H12.5\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path d=\"M6.66699 10H13.3337\" stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg>\n    </div>\n\n    <!-- Custom Icon -->\n    <div *ngIf=\"icon && icon.type === 'custom' && icon.svg\" [innerHTML]=\"icon.svg\"></div>\n\n    <!-- Title -->\n    <span class=\"cqa-font-semibold cqa-text-[14px] cqa-leading-[17px] cqa-text-[#312C85] cqa-flex-1\">\n      {{ title }}\n    </span>\n\n    <!-- Badge -->\n    <span\n      class=\"cqa-px-2 cqa-py-[2px] cqa-rounded-[4px] cqa-bg-[#C6D2FF] cqa-text-[12px] cqa-leading-[16px] cqa-text-[#432DD7]\">\n      {{ getDisplayCount() }}\n    </span>\n  </div>\n</div>\n\n<!-- Expanded Content -->\n<div *ngIf=\"isExpanded\" class=\"cqa-mt-2 cqa-flex cqa-flex-col cqa-gap-2 cqa-px-2.5\">\n  <!-- When there are no items, display ng-content directly -->\n  <ng-container *ngIf=\"!items || items.length === 0\">\n      <ng-content></ng-content>\n  </ng-container>\n\n  <!-- When items exist, display them -->\n  <div *ngFor=\"let item of items\">\n\n    <!-- Item Header -->\n    <div class=\"cqa-bg-white cqa-border cqa-border-solid cqa-border-[#E5E5E5] cqa-rounded-md cqa-overflow-hidden\">\n      <div class=\"cqa-py-2 cqa-px-3 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3\">\n        <!-- Left side: Status and Title -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-flex-1\">\n          <!-- Status Icon (Filled Green Circle with Checkmark) -->\n          <div>\n            <!-- Success -->\n            <svg *ngIf=\"item.status === 'success'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <g clip-path=\"url(#clip0_48_121)\">\n                <path\n                  d=\"M10.0003 18.3337C14.6027 18.3337 18.3337 14.6027 18.3337 10.0003C18.3337 5.39795 14.6027 1.66699 10.0003 1.66699C5.39795 1.66699 1.66699 5.39795 1.66699 10.0003C1.66699 14.6027 5.39795 18.3337 10.0003 18.3337Z\"\n                  stroke=\"#00A63E\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n                <path d=\"M7.5 9.99967L9.16667 11.6663L12.5 8.33301\" stroke=\"#00A63E\" stroke-width=\"1.66667\"\n                  stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_48_121\">\n                  <rect width=\"20\" height=\"20\" fill=\"white\" />\n                </clipPath>\n              </defs>\n            </svg>\n            <!-- Failed -->\n            <svg *ngIf=\"item.status === 'failed'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#EF4444\" />\n              <path d=\"M7 7L13 13M13 7L7 13\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Pending -->\n            <svg *ngIf=\"item.status === 'pending'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#9CA3AF\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Running -->\n            <svg *ngIf=\"item.status === 'running'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#3B82F6\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n          </div>\n  \n          <!-- Title -->\n          <span class=\"cqa-text-[14px] cqa-leading-[18px]\">\n            {{ item.title }}\n          </span>\n        </div>\n  \n        <!-- Right side: Duration and View Steps Link -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3\">\n          <!-- Duration with Clock Icon -->\n          <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n            <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\"\n                stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              <path d=\"M6 3V6L8 7\" stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <span class=\"cqa-text-[14px] cqa-leading-[20px] cqa-text-[#6A7282]\">\n              {{ formatDuration(item.duration) }}\n            </span>\n          </div>\n  \n          <!-- View Steps Link -->\n          <a href=\"#\" (click)=\"onViewSteps(item, $event)\"\n            class=\"cqa-text-[12px] cqa-leading-[15px] cqa-font-semibold cqa-text-[#3F43EE] cqa-no-underline cqa-flex cqa-items-center cqa-gap-1 hover:cqa-underline\">\n            <span>{{ isItemExpanded(item.id) ? 'Hide steps' : 'View steps' }}</span>\n            <svg [class.cqa-rotate-90]=\"isItemExpanded(item.id)\" class=\"cqa-transition-transform\" width=\"16\" height=\"15\"\n              viewBox=\"0 0 16 15\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M8.6552 12.8184L7.55413 11.7668L10.852 8.5864H2.83984V7.05032H10.852L7.55413 3.87506L8.6552 2.81836L13.8398 7.81836L8.6552 12.8184Z\"\n                fill=\"#3F43EE\" />\n            </svg>\n          </a>\n        </div>\n      </div>\n    </div>\n\n    <!-- Steps Content (shown when item is expanded) -->\n    <div *ngIf=\"isItemExpanded(item.id)\">\n      <!-- Custom template via TemplateRef (from @ContentChild or @Input) - passes item as context -->\n      <ng-container *ngIf=\"itemContentTpl || itemContentTemplate\">\n        <div class=\"cqa-p-3\">\n          <ng-container\n            *ngTemplateOutlet=\"(itemContentTpl || itemContentTemplate)!; context: { $implicit: item, item: item }\"></ng-container>\n        </div>\n      </ng-container>\n\n      <!-- Custom content projection via ng-content - displayed for all expanded items -->\n      <ng-content select=\"[itemContent]\"></ng-content>\n    </div>\n  </div>\n</div>\n\n<!-- Custom content projection after all items - for steps loaded after API call -->\n<ng-content select=\"[afterItems]\"></ng-content>", styles: [] }]
+            args: [{ selector: 'cqa-main-step-collapse', host: { class: 'cqa-ui-root' }, template: "<!-- Header -->\n<div\n  class=\"cqa-mt-2 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-px-3 cqa-py-2 cqa-cursor-pointer cqa-bg-[#EEF2FF] cqa-rounded-[4px] cqa-border cqa-border-[#C6D2FF] cqa-border-solid\"\n  (click)=\"toggle()\">\n  <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-w-full\">\n    <!-- Chevron Icon (Left) -->\n    <!-- <svg [class.cqa-rotate-180]=\"isExpanded\" class=\"cqa-transition-transform\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M4 6L8 10L12 6\" stroke=\"#3F51B5\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n  </svg> -->\n    <div><svg [class.cqa-rotate-180]=\"isExpanded\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M4 6L8 10L12 6\" stroke=\"#4F39F6\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg></div>\n\n    <!-- Chain-Link Icon (if configured, otherwise default) -->\n    <!-- <div *ngIf=\"icon && icon.type === 'folder'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M11.6666 11.6667C11.976 11.6667 12.2728 11.5437 12.4916 11.325C12.7104 11.1062 12.8333 10.8094 12.8333 10.5V4.66667C12.8333 4.35725 12.7104 4.0605 12.4916 3.84171C12.2728 3.62292 11.976 3.5 11.6666 3.5H7.05829C6.86318 3.50191 6.67069 3.45486 6.49847 3.36314C6.32624 3.27142 6.17977 3.13797 6.07246 2.975L5.59996 2.275C5.49373 2.11369 5.34911 1.98128 5.17908 1.88965C5.00906 1.79802 4.81894 1.75003 4.62579 1.75H2.33329C2.02387 1.75 1.72713 1.87292 1.50833 2.09171C1.28954 2.3105 1.16663 2.60725 1.16663 2.91667V10.5C1.16663 10.8094 1.28954 11.1062 1.50833 11.325C1.72713 11.5437 2.02387 11.6667 2.33329 11.6667H11.6666Z\" fill=\"#EFF6FF\" stroke=\"#3F51B5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div>\n  <div *ngIf=\"icon && icon.type === 'loop'\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <rect width=\"16\" height=\"16\" rx=\"4\" fill=\"#EBECFD\"/>\n      <path d=\"M9.66663 4.66666L11 5.99999L9.66663 7.33332\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M5 7.66667V7.33333C5 6.97971 5.14048 6.64057 5.39052 6.39052C5.64057 6.14048 5.97971 6 6.33333 6H11\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M6.33333 11.3333L5 9.99999L6.33333 8.66666\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n      <path d=\"M11 8.33334V8.66668C11 9.0203 10.8595 9.35944 10.6095 9.60949C10.3594 9.85953 10.0203 10 9.66667 10H5\" stroke=\"#3F51B5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div> -->\n    <!-- Bar Icon (Bulleted List) -->\n    <div *ngIf=\"icon && icon.type === 'bar'\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <!-- First bullet and line -->\n        <circle cx=\"3\" cy=\"5\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"5\" x2=\"17\" y2=\"5\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Second bullet and line -->\n        <circle cx=\"3\" cy=\"10\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"10\" x2=\"17\" y2=\"10\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n        <!-- Third bullet and line -->\n        <circle cx=\"3\" cy=\"15\" r=\"2\" fill=\"#4F39F6\"/>\n        <line x1=\"7\" y1=\"15\" x2=\"17\" y2=\"15\" stroke=\"#4F39F6\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n      </svg>\n    </div>\n\n    <!-- Default Chain-Link Icon (when no icon or icon type is not specified) -->\n    <div *ngIf=\"!icon || (icon.type !== 'bar' && icon.type !== 'folder' && icon.type !== 'loop' && icon.type !== 'custom')\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M7.50033 14.1663H5.83366C4.72859 14.1663 3.66878 13.7274 2.88738 12.946C2.10598 12.1646 1.66699 11.1047 1.66699 9.99967C1.66699 8.89461 2.10598 7.8348 2.88738 7.0534C3.66878 6.27199 4.72859 5.83301 5.83366 5.83301H7.50033\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path\n          d=\"M12.5 5.83301H14.1667C15.2717 5.83301 16.3315 6.27199 17.1129 7.0534C17.8943 7.8348 18.3333 8.89461 18.3333 9.99967C18.3333 11.1047 17.8943 12.1646 17.1129 12.946C16.3315 13.7274 15.2717 14.1663 14.1667 14.1663H12.5\"\n          stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        <path d=\"M6.66699 10H13.3337\" stroke=\"#4F39F6\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\n          stroke-linejoin=\"round\" />\n      </svg>\n    </div>\n\n    <!-- Custom Icon -->\n    <div *ngIf=\"icon && icon.type === 'custom' && icon.svg\" [innerHTML]=\"icon.svg\"></div>\n\n    <!-- Title -->\n    <span class=\"cqa-font-semibold cqa-text-[14px] cqa-leading-[17px] cqa-text-[#312C85] cqa-flex-1\">\n      {{ title }}\n    </span>\n\n    <!-- Badge -->\n    <span\n      class=\"cqa-px-2 cqa-py-[2px] cqa-rounded-[4px] cqa-bg-[#C6D2FF] cqa-text-[12px] cqa-leading-[16px] cqa-text-[#432DD7]\">\n      {{ getDisplayCount() }}\n    </span>\n  </div>\n</div>\n\n<!-- Expanded Content -->\n<div *ngIf=\"isExpanded\" class=\"cqa-mt-2 cqa-flex cqa-flex-col cqa-gap-2 cqa-px-2.5\">\n  <!-- When there are no items, display ng-content directly -->\n  <ng-container *ngIf=\"!items || items.length === 0\">\n      <ng-content></ng-content>\n  </ng-container>\n\n  <!-- When items exist, display them -->\n  <div *ngFor=\"let item of items\">\n\n    <!-- Item Header -->\n    <div class=\"cqa-bg-white cqa-border cqa-border-solid cqa-border-[#E5E5E5] cqa-rounded-md cqa-overflow-hidden\">\n      <div class=\"cqa-py-2 cqa-px-3 cqa-flex cqa-items-center cqa-justify-between cqa-gap-3\">\n        <!-- Left side: Status and Title -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-flex-1\">\n          <!-- Status Icon (Filled Green Circle with Checkmark) -->\n          <div>\n            <!-- Success -->\n            <svg *ngIf=\"item.status === 'success'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <g clip-path=\"url(#clip0_48_121)\">\n                <path\n                  d=\"M10.0003 18.3337C14.6027 18.3337 18.3337 14.6027 18.3337 10.0003C18.3337 5.39795 14.6027 1.66699 10.0003 1.66699C5.39795 1.66699 1.66699 5.39795 1.66699 10.0003C1.66699 14.6027 5.39795 18.3337 10.0003 18.3337Z\"\n                  stroke=\"#00A63E\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n                <path d=\"M7.5 9.99967L9.16667 11.6663L12.5 8.33301\" stroke=\"#00A63E\" stroke-width=\"1.66667\"\n                  stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_48_121\">\n                  <rect width=\"20\" height=\"20\" fill=\"white\" />\n                </clipPath>\n              </defs>\n            </svg>\n            <!-- Failed -->\n            <svg *ngIf=\"item.status === 'failed'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#EF4444\" />\n              <path d=\"M7 7L13 13M13 7L7 13\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Pending -->\n            <svg *ngIf=\"item.status === 'pending'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#9CA3AF\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <!-- Running -->\n            <svg *ngIf=\"item.status === 'running'\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#3B82F6\" />\n              <path d=\"M10 6V10L13 12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n          </div>\n  \n          <!-- Title -->\n          <span class=\"cqa-text-[14px] cqa-leading-[18px]\">\n            {{ item.title }}\n          </span>\n        </div>\n  \n        <!-- Right side: Duration and View Steps Link -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-3\">\n          <!-- Duration with Clock Icon -->\n          <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n            <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\"\n                stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              <path d=\"M6 3V6L8 7\" stroke=\"#6A7282\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n            <span class=\"cqa-text-[14px] cqa-leading-[20px] cqa-text-[#6A7282]\">\n              {{ formatDuration(item.duration) }}\n            </span>\n          </div>\n  \n          <!-- View Steps Link -->\n          <a href=\"#\" (click)=\"onViewSteps(item, $event)\"\n            class=\"cqa-text-[12px] cqa-leading-[15px] cqa-font-semibold cqa-text-[#3F43EE] cqa-no-underline cqa-flex cqa-items-center cqa-gap-1 hover:cqa-underline\">\n            <span>{{ isItemExpanded(item.id) ? 'Hide steps' : 'View steps' }}</span>\n            <svg [class.cqa-rotate-90]=\"isItemExpanded(item.id)\" class=\"cqa-transition-transform\" width=\"16\" height=\"15\"\n              viewBox=\"0 0 16 15\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                d=\"M8.6552 12.8184L7.55413 11.7668L10.852 8.5864H2.83984V7.05032H10.852L7.55413 3.87506L8.6552 2.81836L13.8398 7.81836L8.6552 12.8184Z\"\n                fill=\"#3F43EE\" />\n            </svg>\n          </a>\n        </div>\n      </div>\n    </div>\n\n    <!-- Steps Content (shown when item is expanded) -->\n    <div *ngIf=\"isItemExpanded(item.id)\">\n      <!-- Custom template via TemplateRef (from @ContentChild or @Input) - passes item as context -->\n      <ng-container *ngIf=\"itemContentTpl || itemContentTemplate\">\n        <div class=\"cqa-p-3\">\n          <ng-container\n            *ngTemplateOutlet=\"(itemContentTpl || itemContentTemplate)!; context: { $implicit: item, item: item }\"></ng-container>\n        </div>\n      </ng-container>\n\n      <!-- Custom content projection via ng-content - displayed for all expanded items -->\n      <ng-content select=\"[itemContent]\"></ng-content>\n    </div>\n  </div>\n</div>\n\n<!-- Custom content projection after all items - for steps loaded after API call -->\n<ng-content select=\"[afterItems]\"></ng-content>", styles: [] }]
         }], propDecorators: { title: [{
                 type: Input
             }], items: [{