ca-components 2.0.30 → 2.0.31

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.
@@ -33143,7 +33143,7 @@ class DescriptionItemsTextCountDirective {
33143
33143
  const isStringArray = value?.every((item) => typeof item === 'string');
33144
33144
  if (!isStringArray && Array.isArray(value)) {
33145
33145
  const objectArray = value;
33146
- this._items = objectArray.map((item) => item.description || item.nickname || '');
33146
+ this._items = objectArray.map((item) => item.code || item.description || item.nickname || '');
33147
33147
  }
33148
33148
  }
33149
33149
  updateItems() {
@@ -33253,7 +33253,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
33253
33253
  type: Pipe,
33254
33254
  args: [{
33255
33255
  name: 'pmItem',
33256
- standalone: true,
33257
33256
  }]
33258
33257
  }] });
33259
33258
 
@@ -33276,7 +33275,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
33276
33275
 
33277
33276
  class ItemsDropdownHelper {
33278
33277
  static getDropdownValues(itemsDropdownList, gridResponsePropertiesToDisplay) {
33279
- return itemsDropdownList.map((item) => gridResponsePropertiesToDisplay.map((key) => item[key]));
33278
+ return itemsDropdownList?.map((item) => gridResponsePropertiesToDisplay?.map((key) => item[key]));
33280
33279
  }
33281
33280
  }
33282
33281
 
@@ -33285,6 +33284,7 @@ class CaItemsDropdownComponent {
33285
33284
  this.itemsDropdownList = [];
33286
33285
  this.itemsSpecialStylesIndexArray = [];
33287
33286
  this.columnWidth = 0;
33287
+ this.tooltipText = eStringPlaceholder.EMPTY;
33288
33288
  this.itemsDropdownAction = new EventEmitter();
33289
33289
  this._itemsDropdownConfig = null;
33290
33290
  this.dropdownItemsToDisplay = [];
@@ -33292,13 +33292,15 @@ class CaItemsDropdownComponent {
33292
33292
  this.ePosition = ePosition;
33293
33293
  this.eColor = eColor;
33294
33294
  this.eStringPlaceholder = eStringPlaceholder;
33295
+ this.eUnit = eUnit;
33295
33296
  }
33296
33297
  set itemsDropdownConfig(value) {
33297
33298
  this._itemsDropdownConfig = value;
33298
33299
  this.updateDropdownItemsToDisplay();
33299
33300
  }
33300
33301
  updateDropdownItemsToDisplay() {
33301
- if (this._itemsDropdownConfig) {
33302
+ if (this._itemsDropdownConfig &&
33303
+ !this.minimisedVariationDropdownTemplate) {
33302
33304
  this.dropdownItemsToDisplay = ItemsDropdownHelper.getDropdownValues(this.itemsDropdownList, this._itemsDropdownConfig
33303
33305
  .gridResponsePropertiesToDisplay);
33304
33306
  }
@@ -33308,9 +33310,9 @@ class CaItemsDropdownComponent {
33308
33310
  this.itemsDropdownAction.emit();
33309
33311
  }
33310
33312
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CaItemsDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
33311
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: CaItemsDropdownComponent, isStandalone: true, selector: "ca-items-dropdown", inputs: { itemsDropdownConfig: "itemsDropdownConfig", itemsDropdownList: "itemsDropdownList", itemsSpecialStylesIndexArray: "itemsSpecialStylesIndexArray", columnWidth: "columnWidth" }, outputs: { itemsDropdownAction: "itemsDropdownAction" }, ngImport: i0, template: "<div\n class=\"h-100 items-dropdown-container\"\n #dropdownPopover=\"ngbPopover\"\n triggers=\"'manual'\"\n [ngbPopover]=\"dropdownOptions\"\n [autoClose]=\"'outside'\"\n [placement]=\"['bottom-left', 'top-left']\"\n [popoverClass]=\"'items-dropdown-popover'\"\n [container]=\"'body'\"\n>\n @let isDropdownOpen = dropdownPopover.isOpen();\n\n @let gridBackgroundClass =\n isDropdownOpen ? 'background-black-2' : 'background-hover-dark-2';\n\n @let gridColumns =\n {\n 'grid-template-columns': _itemsDropdownConfig?.gridValues?.join(\n eStringPlaceholder.WHITESPACE\n ),\n };\n\n <div\n class=\"d-flex align-items-center h-100 padding-x-4 br-2 c-pointer\"\n [ngClass]=\"gridBackgroundClass\"\n (click)=\"handleDropdownOpenCloseClick(dropdownPopover)\"\n >\n @if (isDropdownOpen) {\n <div\n class=\"d-grid grid-gap-8 w-100 padding-r-4\"\n [ngStyle]=\"gridColumns\"\n >\n @for (\n gridItem of _itemsDropdownConfig?.gridItems;\n track gridItem;\n let gridItemIndex = $index;\n let gridItemFirst = $first;\n let gridItemLast = $last\n ) {\n <div\n class=\"d-flex align-items-center\"\n [ngClass]=\"{\n 'justify-content-center': gridItemFirst,\n 'justify-content-end': gridItemIndex > 1,\n }\"\n >\n <p\n class=\"text-uppercase\"\n [ngClass]=\"\n _itemsDropdownConfig?.hasTotal && gridItemLast\n ? 'text-size-14 text-color-white ca-font-semi-bold'\n : 'text-size-11 text-color-light-grey-6 ca-font-bold'\n \"\n >\n {{ gridItem }}\n </p>\n </div>\n }\n </div>\n } @else {\n <div\n ngbTooltip\n [mainCaTooltip]=\"'Show Items'\"\n [tooltipBackground]=\"eColor.BLACK\"\n [position]=\"ePosition.BOTTOM\"\n [tooltipMarginTop]=\"'-6px'\"\n [appDescriptionItemsTextCount]=\"itemsDropdownList\"\n [itemsSpecialStylesIndexArray]=\"itemsSpecialStylesIndexArray\"\n [containerWidth]=\"columnWidth\"\n ></div>\n }\n </div>\n\n <!-- Dropdown -->\n\n <ng-template #dropdownOptions>\n <div\n class=\"d-flex flex-column br-3 padding-4 background-black-2 margin-t--4\"\n [ngStyle]=\"columnWidth | dropdownWidth\"\n >\n @for (\n dropdownItem of dropdownItemsToDisplay;\n track dropdownItemIndex;\n let dropdownItemIndex = $index;\n let dropdownItemLast = $last\n ) {\n @let isPmItem =\n itemsSpecialStylesIndexArray?.includes(dropdownItemIndex);\n\n @let pmItemIcon =\n isPmItem && (itemsDropdownList[dropdownItemIndex] | pmItem);\n\n <div\n class=\"d-grid grid-gap-8 padding-r-4 padding-y-2 background-hover-black\"\n [ngClass]=\"{ 'margin-b-2': !dropdownItemLast }\"\n [ngStyle]=\"gridColumns\"\n >\n <div\n class=\"d-flex align-items-center justify-content-center\"\n >\n <p class=\"text-color-grey text-size-14\">\n {{ dropdownItemIndex + 1 }}\n </p>\n </div>\n\n @for (\n dropdownItemText of dropdownItem;\n track dropdownItemTextIndex;\n let dropdownItemTextIndex = $index;\n let dropdownItemTextFirst = $first\n ) {\n @let isCurrencyText =\n _itemsDropdownConfig?.hasTotal &&\n dropdownItemTextIndex >= dropdownItem.length - 2;\n\n @let text =\n isCurrencyText\n ? (dropdownItemText | currency)\n : dropdownItemText;\n\n @let dropdownItemTextClass =\n {\n 'justify-content-end': !dropdownItemTextFirst,\n 'text-color-blue-19': isPmItem,\n 'text-color-white ': !isPmItem,\n };\n\n <div\n class=\"d-flex align-items-center\"\n [ngClass]=\"dropdownItemTextClass\"\n >\n <p class=\"text-size-14 ca-font-medium\">\n {{ text }}\n </p>\n\n @if (isPmItem && dropdownItemTextIndex === 0) {\n <svg-icon\n class=\"svg-fill-blue-8 svg-size-14 margin-l-4\"\n [src]=\"\n pmItemIcon || eStringPlaceholder.EMPTY\n \"\n ></svg-icon>\n }\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type:
33313
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: CaItemsDropdownComponent, isStandalone: true, selector: "ca-items-dropdown", inputs: { itemsDropdownConfig: "itemsDropdownConfig", itemsDropdownList: "itemsDropdownList", itemsSpecialStylesIndexArray: "itemsSpecialStylesIndexArray", minimisedVariationDropdownTemplate: "minimisedVariationDropdownTemplate", columnWidth: "columnWidth", tooltipText: "tooltipText" }, outputs: { itemsDropdownAction: "itemsDropdownAction" }, ngImport: i0, template: "<div\n class=\"h-100 items-dropdown-container\"\n #dropdownPopover=\"ngbPopover\"\n triggers=\"'manual'\"\n [ngbPopover]=\"dropdownOptions\"\n [autoClose]=\"'outside'\"\n [placement]=\"['bottom-left', 'top-left']\"\n [popoverClass]=\"'items-dropdown-popover'\"\n [container]=\"'body'\"\n>\n @let isDropdownOpen = dropdownPopover.isOpen();\n\n @let gridBackgroundClass =\n isDropdownOpen ? 'background-black-2' : 'background-hover-dark-2';\n\n @let gridColumns =\n {\n 'grid-template-columns': _itemsDropdownConfig?.gridValues,\n };\n\n @let hasItems = itemsDropdownList && itemsDropdownList.length;\n\n @if (hasItems) {\n @let tooltip = isDropdownOpen ? eStringPlaceholder.EMPTY : tooltipText;\n\n <div\n class=\"d-flex align-items-center h-100 padding-x-4 br-2 c-pointer\"\n [ngClass]=\"gridBackgroundClass\"\n ngbTooltip\n [mainCaTooltip]=\"tooltip\"\n [tooltipBackground]=\"eColor.DARK_GREY\"\n [position]=\"ePosition.BOTTOM\"\n [tooltipMarginTop]=\"'-6px'\"\n (click)=\"handleDropdownOpenCloseClick(dropdownPopover)\"\n >\n @if (isDropdownOpen) {\n <div\n class=\"d-grid grid-gap-8 w-100 padding-r-4\"\n [ngStyle]=\"gridColumns\"\n >\n @for (\n gridItem of _itemsDropdownConfig?.gridItems;\n track gridItem;\n let gridItemIndex = $index;\n let gridItemFirst = $first;\n let gridItemLast = $last\n ) {\n <div\n class=\"d-flex align-items-center\"\n [ngClass]=\"{\n 'justify-content-center': gridItemFirst,\n 'justify-content-end': gridItemIndex > 1,\n }\"\n >\n <p\n class=\"text-uppercase\"\n [ngClass]=\"\n _itemsDropdownConfig?.hasTotal &&\n gridItemLast\n ? 'text-size-14 text-color-white ca-font-semi-bold'\n : 'text-size-11 text-color-light-grey-6 ca-font-bold'\n \"\n >\n {{ gridItem }}\n </p>\n </div>\n }\n </div>\n } @else {\n <div\n [appDescriptionItemsTextCount]=\"itemsDropdownList\"\n [itemsSpecialStylesIndexArray]=\"\n itemsSpecialStylesIndexArray\n \"\n [containerWidth]=\"columnWidth\"\n ></div>\n }\n </div>\n }\n\n <!-- Dropdown -->\n\n <ng-template #dropdownOptions>\n @if (minimisedVariationDropdownTemplate) {\n <ng-container\n *ngTemplateOutlet=\"minimisedVariationTemplate\"\n ></ng-container>\n } @else {\n <ng-container\n *ngTemplateOutlet=\"regularVariationTemplate\"\n ></ng-container>\n }\n </ng-template>\n\n <!-- Templates -->\n\n <!-- Regular Variation Template -->\n\n <ng-template #regularVariationTemplate>\n <div\n class=\"d-flex flex-column br-3 padding-4 background-black-2 margin-t--4\"\n [ngStyle]=\"columnWidth | dropdownWidth\"\n >\n @for (\n dropdownItem of dropdownItemsToDisplay;\n track dropdownItemIndex;\n let dropdownItemIndex = $index;\n let dropdownItemLast = $last\n ) {\n @let isPmItem =\n itemsSpecialStylesIndexArray?.includes(dropdownItemIndex);\n\n @let pmItemIcon =\n isPmItem && (itemsDropdownList[dropdownItemIndex] | pmItem);\n\n <div\n class=\"d-grid grid-gap-8 br-3 padding-r-4 padding-y-2 background-hover-black\"\n [ngClass]=\"{ 'margin-b-2': !dropdownItemLast }\"\n [ngStyle]=\"gridColumns\"\n >\n <div\n class=\"d-flex align-items-center justify-content-center\"\n >\n <p class=\"text-color-grey text-size-14\">\n {{ dropdownItemIndex + 1 }}\n </p>\n </div>\n\n @for (\n dropdownItemText of dropdownItem;\n track dropdownItemTextIndex;\n let dropdownItemTextIndex = $index;\n let dropdownItemTextFirst = $first\n ) {\n @let isCurrencyText =\n _itemsDropdownConfig?.hasTotal &&\n dropdownItemTextIndex >= dropdownItem.length - 2;\n\n @let text =\n isCurrencyText\n ? (dropdownItemText | currency)\n : dropdownItemText;\n\n @let dropdownItemTextClass =\n {\n 'justify-content-end': !dropdownItemTextFirst,\n 'text-color-blue-19': isPmItem,\n 'text-color-white ': !isPmItem,\n };\n\n <div\n class=\"d-flex align-items-center\"\n [ngClass]=\"dropdownItemTextClass\"\n >\n <p class=\"text-size-14 ca-font-medium\">\n {{ text }}\n </p>\n\n @if (isPmItem && dropdownItemTextIndex === 0) {\n <svg-icon\n class=\"svg-fill-blue-8 svg-size-14 margin-l-4\"\n [src]=\"\n pmItemIcon || eStringPlaceholder.EMPTY\n \"\n ></svg-icon>\n }\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n\n <!-- Minimised Variation Template -->\n\n <ng-template #minimisedVariationTemplate>\n <div\n class=\"d-flex flex-column br-3 padding-4 background-black-2 margin-t--4\"\n [ngStyle]=\"{ width: columnWidth + eUnit.PX }\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n minimisedVariationDropdownTemplate;\n context: {\n data: itemsDropdownList,\n }\n \"\n ></ng-container>\n </div>\n </ng-template>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type:
33312
33314
  // modules
33313
- CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1.CurrencyPipe, name: "currency" }, { kind: "ngmodule", type: NgbModule }, { kind: "directive", type: i3.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "ngbPopover", "popoverTitle", "placement", "popperOptions", "triggers", "positionTarget", "container", "disablePopover", "popoverClass", "popoverContext", "openDelay", "closeDelay"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }, { kind: "directive", type: i3.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type:
33315
+ CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1.CurrencyPipe, name: "currency" }, { kind: "ngmodule", type: NgbModule }, { kind: "directive", type: i3.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "ngbPopover", "popoverTitle", "placement", "popperOptions", "triggers", "positionTarget", "container", "disablePopover", "popoverClass", "popoverContext", "openDelay", "closeDelay"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }, { kind: "directive", type: i3.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type:
33314
33316
  // components
33315
33317
  CaAppTooltipV2Component, selector: "mainCaTooltip, [mainCaTooltip]", inputs: ["mainCaTooltip", "position", "openTooltipDelay", "tooltipBackground", "tooltipColor", "tooltipTextAlign", "tooltipMarginTop", "disableTooltip"] }, { kind: "component", type: SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "applyCss", "svgClass", "class", "viewBox", "svgAriaLabel", "svgStyle"] }, { kind: "directive", type:
33316
33318
  // directives
@@ -33332,15 +33334,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
33332
33334
  // pipes
33333
33335
  PmItemPipe,
33334
33336
  DropdownWidthPipe,
33335
- ], template: "<div\n class=\"h-100 items-dropdown-container\"\n #dropdownPopover=\"ngbPopover\"\n triggers=\"'manual'\"\n [ngbPopover]=\"dropdownOptions\"\n [autoClose]=\"'outside'\"\n [placement]=\"['bottom-left', 'top-left']\"\n [popoverClass]=\"'items-dropdown-popover'\"\n [container]=\"'body'\"\n>\n @let isDropdownOpen = dropdownPopover.isOpen();\n\n @let gridBackgroundClass =\n isDropdownOpen ? 'background-black-2' : 'background-hover-dark-2';\n\n @let gridColumns =\n {\n 'grid-template-columns': _itemsDropdownConfig?.gridValues?.join(\n eStringPlaceholder.WHITESPACE\n ),\n };\n\n <div\n class=\"d-flex align-items-center h-100 padding-x-4 br-2 c-pointer\"\n [ngClass]=\"gridBackgroundClass\"\n (click)=\"handleDropdownOpenCloseClick(dropdownPopover)\"\n >\n @if (isDropdownOpen) {\n <div\n class=\"d-grid grid-gap-8 w-100 padding-r-4\"\n [ngStyle]=\"gridColumns\"\n >\n @for (\n gridItem of _itemsDropdownConfig?.gridItems;\n track gridItem;\n let gridItemIndex = $index;\n let gridItemFirst = $first;\n let gridItemLast = $last\n ) {\n <div\n class=\"d-flex align-items-center\"\n [ngClass]=\"{\n 'justify-content-center': gridItemFirst,\n 'justify-content-end': gridItemIndex > 1,\n }\"\n >\n <p\n class=\"text-uppercase\"\n [ngClass]=\"\n _itemsDropdownConfig?.hasTotal && gridItemLast\n ? 'text-size-14 text-color-white ca-font-semi-bold'\n : 'text-size-11 text-color-light-grey-6 ca-font-bold'\n \"\n >\n {{ gridItem }}\n </p>\n </div>\n }\n </div>\n } @else {\n <div\n ngbTooltip\n [mainCaTooltip]=\"'Show Items'\"\n [tooltipBackground]=\"eColor.BLACK\"\n [position]=\"ePosition.BOTTOM\"\n [tooltipMarginTop]=\"'-6px'\"\n [appDescriptionItemsTextCount]=\"itemsDropdownList\"\n [itemsSpecialStylesIndexArray]=\"itemsSpecialStylesIndexArray\"\n [containerWidth]=\"columnWidth\"\n ></div>\n }\n </div>\n\n <!-- Dropdown -->\n\n <ng-template #dropdownOptions>\n <div\n class=\"d-flex flex-column br-3 padding-4 background-black-2 margin-t--4\"\n [ngStyle]=\"columnWidth | dropdownWidth\"\n >\n @for (\n dropdownItem of dropdownItemsToDisplay;\n track dropdownItemIndex;\n let dropdownItemIndex = $index;\n let dropdownItemLast = $last\n ) {\n @let isPmItem =\n itemsSpecialStylesIndexArray?.includes(dropdownItemIndex);\n\n @let pmItemIcon =\n isPmItem && (itemsDropdownList[dropdownItemIndex] | pmItem);\n\n <div\n class=\"d-grid grid-gap-8 padding-r-4 padding-y-2 background-hover-black\"\n [ngClass]=\"{ 'margin-b-2': !dropdownItemLast }\"\n [ngStyle]=\"gridColumns\"\n >\n <div\n class=\"d-flex align-items-center justify-content-center\"\n >\n <p class=\"text-color-grey text-size-14\">\n {{ dropdownItemIndex + 1 }}\n </p>\n </div>\n\n @for (\n dropdownItemText of dropdownItem;\n track dropdownItemTextIndex;\n let dropdownItemTextIndex = $index;\n let dropdownItemTextFirst = $first\n ) {\n @let isCurrencyText =\n _itemsDropdownConfig?.hasTotal &&\n dropdownItemTextIndex >= dropdownItem.length - 2;\n\n @let text =\n isCurrencyText\n ? (dropdownItemText | currency)\n : dropdownItemText;\n\n @let dropdownItemTextClass =\n {\n 'justify-content-end': !dropdownItemTextFirst,\n 'text-color-blue-19': isPmItem,\n 'text-color-white ': !isPmItem,\n };\n\n <div\n class=\"d-flex align-items-center\"\n [ngClass]=\"dropdownItemTextClass\"\n >\n <p class=\"text-size-14 ca-font-medium\">\n {{ text }}\n </p>\n\n @if (isPmItem && dropdownItemTextIndex === 0) {\n <svg-icon\n class=\"svg-fill-blue-8 svg-size-14 margin-l-4\"\n [src]=\"\n pmItemIcon || eStringPlaceholder.EMPTY\n \"\n ></svg-icon>\n }\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n</div>\n" }]
33337
+ ], template: "<div\n class=\"h-100 items-dropdown-container\"\n #dropdownPopover=\"ngbPopover\"\n triggers=\"'manual'\"\n [ngbPopover]=\"dropdownOptions\"\n [autoClose]=\"'outside'\"\n [placement]=\"['bottom-left', 'top-left']\"\n [popoverClass]=\"'items-dropdown-popover'\"\n [container]=\"'body'\"\n>\n @let isDropdownOpen = dropdownPopover.isOpen();\n\n @let gridBackgroundClass =\n isDropdownOpen ? 'background-black-2' : 'background-hover-dark-2';\n\n @let gridColumns =\n {\n 'grid-template-columns': _itemsDropdownConfig?.gridValues,\n };\n\n @let hasItems = itemsDropdownList && itemsDropdownList.length;\n\n @if (hasItems) {\n @let tooltip = isDropdownOpen ? eStringPlaceholder.EMPTY : tooltipText;\n\n <div\n class=\"d-flex align-items-center h-100 padding-x-4 br-2 c-pointer\"\n [ngClass]=\"gridBackgroundClass\"\n ngbTooltip\n [mainCaTooltip]=\"tooltip\"\n [tooltipBackground]=\"eColor.DARK_GREY\"\n [position]=\"ePosition.BOTTOM\"\n [tooltipMarginTop]=\"'-6px'\"\n (click)=\"handleDropdownOpenCloseClick(dropdownPopover)\"\n >\n @if (isDropdownOpen) {\n <div\n class=\"d-grid grid-gap-8 w-100 padding-r-4\"\n [ngStyle]=\"gridColumns\"\n >\n @for (\n gridItem of _itemsDropdownConfig?.gridItems;\n track gridItem;\n let gridItemIndex = $index;\n let gridItemFirst = $first;\n let gridItemLast = $last\n ) {\n <div\n class=\"d-flex align-items-center\"\n [ngClass]=\"{\n 'justify-content-center': gridItemFirst,\n 'justify-content-end': gridItemIndex > 1,\n }\"\n >\n <p\n class=\"text-uppercase\"\n [ngClass]=\"\n _itemsDropdownConfig?.hasTotal &&\n gridItemLast\n ? 'text-size-14 text-color-white ca-font-semi-bold'\n : 'text-size-11 text-color-light-grey-6 ca-font-bold'\n \"\n >\n {{ gridItem }}\n </p>\n </div>\n }\n </div>\n } @else {\n <div\n [appDescriptionItemsTextCount]=\"itemsDropdownList\"\n [itemsSpecialStylesIndexArray]=\"\n itemsSpecialStylesIndexArray\n \"\n [containerWidth]=\"columnWidth\"\n ></div>\n }\n </div>\n }\n\n <!-- Dropdown -->\n\n <ng-template #dropdownOptions>\n @if (minimisedVariationDropdownTemplate) {\n <ng-container\n *ngTemplateOutlet=\"minimisedVariationTemplate\"\n ></ng-container>\n } @else {\n <ng-container\n *ngTemplateOutlet=\"regularVariationTemplate\"\n ></ng-container>\n }\n </ng-template>\n\n <!-- Templates -->\n\n <!-- Regular Variation Template -->\n\n <ng-template #regularVariationTemplate>\n <div\n class=\"d-flex flex-column br-3 padding-4 background-black-2 margin-t--4\"\n [ngStyle]=\"columnWidth | dropdownWidth\"\n >\n @for (\n dropdownItem of dropdownItemsToDisplay;\n track dropdownItemIndex;\n let dropdownItemIndex = $index;\n let dropdownItemLast = $last\n ) {\n @let isPmItem =\n itemsSpecialStylesIndexArray?.includes(dropdownItemIndex);\n\n @let pmItemIcon =\n isPmItem && (itemsDropdownList[dropdownItemIndex] | pmItem);\n\n <div\n class=\"d-grid grid-gap-8 br-3 padding-r-4 padding-y-2 background-hover-black\"\n [ngClass]=\"{ 'margin-b-2': !dropdownItemLast }\"\n [ngStyle]=\"gridColumns\"\n >\n <div\n class=\"d-flex align-items-center justify-content-center\"\n >\n <p class=\"text-color-grey text-size-14\">\n {{ dropdownItemIndex + 1 }}\n </p>\n </div>\n\n @for (\n dropdownItemText of dropdownItem;\n track dropdownItemTextIndex;\n let dropdownItemTextIndex = $index;\n let dropdownItemTextFirst = $first\n ) {\n @let isCurrencyText =\n _itemsDropdownConfig?.hasTotal &&\n dropdownItemTextIndex >= dropdownItem.length - 2;\n\n @let text =\n isCurrencyText\n ? (dropdownItemText | currency)\n : dropdownItemText;\n\n @let dropdownItemTextClass =\n {\n 'justify-content-end': !dropdownItemTextFirst,\n 'text-color-blue-19': isPmItem,\n 'text-color-white ': !isPmItem,\n };\n\n <div\n class=\"d-flex align-items-center\"\n [ngClass]=\"dropdownItemTextClass\"\n >\n <p class=\"text-size-14 ca-font-medium\">\n {{ text }}\n </p>\n\n @if (isPmItem && dropdownItemTextIndex === 0) {\n <svg-icon\n class=\"svg-fill-blue-8 svg-size-14 margin-l-4\"\n [src]=\"\n pmItemIcon || eStringPlaceholder.EMPTY\n \"\n ></svg-icon>\n }\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n\n <!-- Minimised Variation Template -->\n\n <ng-template #minimisedVariationTemplate>\n <div\n class=\"d-flex flex-column br-3 padding-4 background-black-2 margin-t--4\"\n [ngStyle]=\"{ width: columnWidth + eUnit.PX }\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n minimisedVariationDropdownTemplate;\n context: {\n data: itemsDropdownList,\n }\n \"\n ></ng-container>\n </div>\n </ng-template>\n</div>\n" }]
33336
33338
  }], propDecorators: { itemsDropdownConfig: [{
33337
33339
  type: Input
33338
33340
  }], itemsDropdownList: [{
33339
33341
  type: Input
33340
33342
  }], itemsSpecialStylesIndexArray: [{
33341
33343
  type: Input
33344
+ }], minimisedVariationDropdownTemplate: [{
33345
+ type: Input
33342
33346
  }], columnWidth: [{
33343
33347
  type: Input
33348
+ }], tooltipText: [{
33349
+ type: Input
33344
33350
  }], itemsDropdownAction: [{
33345
33351
  type: Output
33346
33352
  }] } });
@@ -37343,5 +37349,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
37343
37349
  * Generated bundle index. Do not edit.
37344
37350
  */
37345
37351
 
37346
- export { CaActivateModalComponent, CaActivityLogListComponent, CaAppTooltipV2Component, CaChartComponent, CaChartManagerComponent, CaCheckboxComponent, CaCheckboxSelectedCountComponent, CaCommentsComponent, CaComponentsLibModule, CaContactsCardComponent, CaCustomCardComponent, CaCustomScrollbarComponent, CaDeactivateModalComponent, CaDeleteModalComponent, CaDetailsDropdownComponent, CaDetailsTitleCardComponent, CaDropdownMenuComponent, CaFactoringDropdownComponent, CaFilesCountComponent, CaFilterComponent, CaFilterDropdownComponent, CaFilterListDropdownComponent, CaFilterStateDropdownComponent, CaFilterTimeDropdownComponent, CaFleetFilterComponent, CaIconDropdownComponent, CaInputAddressDropdownComponent, CaInputComponent, CaInputDatetimePickerComponent, CaInputDropdownComponent, CaInputDropdownTestComponent, CaInputNoteComponent, CaInputRadiobuttonsComponent, CaItemsDropdownComponent, CaLastFuelPriceProgressComponent, CaLoadPickupDeliveryComponent, CaLoadStatusComponent, CaLoadStatusLogComponent, CaMainTableComponent, CaMapComponent, CaMapDropdownComponent, CaMapListCardComponent, CaMapListComponent, CaModalButtonComponent, CaModalComponent, CaModalItemsComponent, CaModalSpinnerComponent, CaNoteComponent, CaNoteContainerComponent, CaPayrollListSummaryOverviewComponent, CaPayrollListSummaryOverviewTableComponent, CaPeriodContentComponent, CaProfileImageComponent, CaProgressBarV2Component, CaProgressExpirationComponent, CaProgressRangeComponent, CaRatingReviewComponent, CaResetTableModalComponent, CaRightSidePanelCompanyComponent, CaRightSidePanelComponent, CaRightSidePanelMenuComponent, CaRightSidePanelTopBarComponent, CaSearchMultipleStates2Component, CaSearchMultipleStatesComponent, CaSearchMultipleStatesService, CaShowMoreComponent, CaSortDropdownComponent, CaSortingCardDropdownComponent, CaSpinnerComponent, CaStatusChangeDropdownComponent, CaSvgPipe, CaTabSwitchComponent, CaTableCardViewComponent, CaToastMessagesComponent, CaTodoComponent, CaToolbarDropdownComponent, CaTooltipListComponent, CaTruckTrailerProgresBarComponent, CaUploadFilesComponent, CaVehicleListComponent, ChartEventTypesStringEnum, ChartFontPropertiesStringEnum, ChartPluginIdsStringEnum, CubicInterpolationStringEnum, DateFormatPipe, DateFromStringPipe, DateTimeHelper, DateWaitTimePipe, DispatchStatusColorPipe, DropdownLoadStatusColorPipe, DropdownMenuContentConditionalItemsHelper, DropdownMenuContentConstants, DropdownMenuContentHelper, EChartAnnotation, EChartAnnotationType, EChartEventProperties, FilterBySearchTermPipe, FormatCityStatePipe, FormatCurrencyPipe, FormatDurationPipe, GpsLocationConstants, GpsLocationHelper, HighlightSearchPipe, InputTestComponent, LastFuelPriceProgressHelper, LoadStatusBackgroundColorPipe, LoadStatusColorPipe, LoadStatusColorsPipe, MapConstants, MapDropdownSvgRoutes, MapHelper, MapInfoWindowOptionsConstants, MapMarkerIconHelper, MapMarkerIconService, MapMarkerIconsConstants, MapOptionsConstants, MethodsCalculationsHelper, NFormatterPipe, NameInitialsPipe, PayrollTypeEnum, PickupDeliveryBlockComponent, ProgressBarComponent, ProgressBarLinePipe, SafeHtmlPipe, SelectedItemPipe, SortDropdownEnum, ThousandFormatterPipe, ThousandSeparatorPipe, ThousandToShortFormatPipe, TimeFilterHelper, ToLowerCasePipe, TruckTrailerColorFinderPipe, TruncatePipe, UnitPositionPipe, UserHelper, UserNameInitialsPipe, eAnimationState, eColor, eCommonElement, eDateTimeFormats, eDropZoneFileType, eDropdownMenu$1 as eDropdownMenu, eFileAction, eFileDropZoneAction, eFileSize, eFileType, eFileUploadPage, eFilterColor, eFilterDropdownEnum, eFilterSortingKey, eFilterTime, eGeneralActions, eGpsHeadingDirection, eGpsMotionStatus, eLoadFilter, eLoadStatus, eModalButtonClassType, eModalButtonSize, eModalItems, ePeriodTitleType, ePlacement, ePosition, eProgressRangePrice, eProgressRangeTooltipPosition, eProgressRangeUnit, eReviewState, eSharedString, eStringPlaceholder, eStyleProperty, eStyling, eTemplateType, eThousandSeparatorFormat, eToastType, eTrailerName, eTruckNameString, eUnit, eVehicleList, emptyValueValidator, userInfoEnum, uuidv4 };
37352
+ export { CaActivateModalComponent, CaActivityLogListComponent, CaAppTooltipV2Component, CaChartComponent, CaChartManagerComponent, CaCheckboxComponent, CaCheckboxSelectedCountComponent, CaCommentsComponent, CaComponentsLibModule, CaContactsCardComponent, CaCustomCardComponent, CaCustomScrollbarComponent, CaDeactivateModalComponent, CaDeleteModalComponent, CaDetailsDropdownComponent, CaDetailsTitleCardComponent, CaDropdownMenuComponent, CaFactoringDropdownComponent, CaFilesCountComponent, CaFilterComponent, CaFilterDropdownComponent, CaFilterListDropdownComponent, CaFilterStateDropdownComponent, CaFilterTimeDropdownComponent, CaFleetFilterComponent, CaIconDropdownComponent, CaInputAddressDropdownComponent, CaInputComponent, CaInputDatetimePickerComponent, CaInputDropdownComponent, CaInputDropdownTestComponent, CaInputNoteComponent, CaInputRadiobuttonsComponent, CaItemsDropdownComponent, CaLastFuelPriceProgressComponent, CaLoadPickupDeliveryComponent, CaLoadStatusComponent, CaLoadStatusLogComponent, CaMainTableComponent, CaMapComponent, CaMapDropdownComponent, CaMapListCardComponent, CaMapListComponent, CaModalButtonComponent, CaModalComponent, CaModalItemsComponent, CaModalSpinnerComponent, CaNoteComponent, CaNoteContainerComponent, CaPayrollListSummaryOverviewComponent, CaPayrollListSummaryOverviewTableComponent, CaPeriodContentComponent, CaProfileImageComponent, CaProgressBarV2Component, CaProgressExpirationComponent, CaProgressRangeComponent, CaRatingReviewComponent, CaResetTableModalComponent, CaRightSidePanelCompanyComponent, CaRightSidePanelComponent, CaRightSidePanelMenuComponent, CaRightSidePanelTopBarComponent, CaSearchMultipleStates2Component, CaSearchMultipleStatesComponent, CaSearchMultipleStatesService, CaShowMoreComponent, CaSortDropdownComponent, CaSortingCardDropdownComponent, CaSpinnerComponent, CaStatusChangeDropdownComponent, CaSvgPipe, CaTabSwitchComponent, CaTableCardViewComponent, CaToastMessagesComponent, CaTodoComponent, CaToolbarDropdownComponent, CaTooltipListComponent, CaTruckTrailerProgresBarComponent, CaUploadFilesComponent, CaVehicleListComponent, ChartEventTypesStringEnum, ChartFontPropertiesStringEnum, ChartPluginIdsStringEnum, CubicInterpolationStringEnum, DateFormatPipe, DateFromStringPipe, DateTimeHelper, DateWaitTimePipe, DispatchStatusColorPipe, DropdownLoadStatusColorPipe, DropdownMenuContentConditionalItemsHelper, DropdownMenuContentConstants, DropdownMenuContentHelper, DropdownWidthPipe, EChartAnnotation, EChartAnnotationType, EChartEventProperties, FilterBySearchTermPipe, FormatCityStatePipe, FormatCurrencyPipe, FormatDurationPipe, GpsLocationConstants, GpsLocationHelper, HighlightSearchPipe, InputTestComponent, LastFuelPriceProgressHelper, LoadStatusBackgroundColorPipe, LoadStatusColorPipe, LoadStatusColorsPipe, MapConstants, MapDropdownSvgRoutes, MapHelper, MapInfoWindowOptionsConstants, MapMarkerIconHelper, MapMarkerIconService, MapMarkerIconsConstants, MapOptionsConstants, MethodsCalculationsHelper, NFormatterPipe, NameInitialsPipe, PayrollTypeEnum, PickupDeliveryBlockComponent, PmItemPipe, ProgressBarComponent, ProgressBarLinePipe, SafeHtmlPipe, SelectedItemPipe, SortDropdownEnum, ThousandFormatterPipe, ThousandSeparatorPipe, ThousandToShortFormatPipe, TimeFilterHelper, ToLowerCasePipe, TruckTrailerColorFinderPipe, TruncatePipe, UnitPositionPipe, UserHelper, UserNameInitialsPipe, eAnimationState, eColor, eCommonElement, eDateTimeFormats, eDropZoneFileType, eDropdownMenu$1 as eDropdownMenu, eFileAction, eFileDropZoneAction, eFileSize, eFileType, eFileUploadPage, eFilterColor, eFilterDropdownEnum, eFilterSortingKey, eFilterTime, eGeneralActions, eGpsHeadingDirection, eGpsMotionStatus, eLoadFilter, eLoadStatus, eModalButtonClassType, eModalButtonSize, eModalItems, ePeriodTitleType, ePlacement, ePosition, eProgressRangePrice, eProgressRangeTooltipPosition, eProgressRangeUnit, eReviewState, eSharedString, eStringPlaceholder, eStyleProperty, eStyling, eTemplateType, eThousandSeparatorFormat, eToastType, eTrailerName, eTruckNameString, eUnit, eVehicleList, emptyValueValidator, userInfoEnum, uuidv4 };
37347
37353
  //# sourceMappingURL=ca-components.mjs.map