@energycap/components 0.39.25-ECAP-26374-menu-item-html-captions.20240923-1505 → 0.39.25-ECAP-26539-Item-Picker-Select-All.20240923-1519

package/lib/controls/item-picker/item-picker.component.d.ts

@@ -6,6 +6,7 @@ import { PagingInfo } from '../../display/table/table-pagination.component';
 import { TableSelectableRowContext } from '../../display/table/table-selectable-row.component';
 import { Overlay } from '../../display/view-overlay/view-overlay.component';
 import { MenuItem } from '../menu/menu.component';
+import { TranslateService } from '@ngx-translate/core';
 import * as i0 from "@angular/core";
 export interface PickerItem<TValue = any, SItems = any> extends MenuItem {
     id: string;
@@ -28,12 +29,20 @@ export declare class ItemPickerSelectableContext<T> extends TableSelectableRowCo
      * AdvancedRowClickBehavior is disabled for ItemPicker.
      */
     readonly disableAdvancedRowClickBehavior: boolean;
+    /** When true the user has opted to select all items across all pages. Due to api pagination
+     *  we don't have all of the items locally, so the host will need to tell the API to operate on all
+     *  via api filters or other means.
+     */
+    isSelectingAllItems: boolean;
 }
 export declare class ItemPickerComponent<T> implements OnInit, OnChanges, OnDestroy {
+    private translateService;
     /** Identifier for the component. This will be added to the beginning of all internal action elements */
     id?: string;
     /** Title displayed above the available items table */
     availableTitle: string;
+    /** Help popover next to the available title. If supplied will show, otherwise is hidden */
+    availableTitleHelpPopover: string;
     /** Title displayed above the selected items list */
     selectedTitle: string;
     /** The type of item being selected. Ex. Meters, Addresses */
@@ -61,6 +70,12 @@ export declare class ItemPickerComponent<T> implements OnInit, OnChanges, OnDest
      * interpolation will be used.
      */
     noSelectedItemsMessage?: string;
+    /** Used to enable select all items across pages. When true the button to select all items will be visible in the available items header when
+     *  the header checkbox is checked and there are multiple pages of results
+     */
+    enableSelectAllItems: boolean;
+    /** Used to display a message in the selected items table when the select all items button is clicked */
+    selectAllItemsMessage: string;
     /** List of available items to pick from */
     availableItems: PickerItem[];
     /**
@@ -74,6 +89,17 @@ export declare class ItemPickerComponent<T> implements OnInit, OnChanges, OnDest
     /** Track by used for the searchable table rows */
     trackByIndex: (index: number) => number;
     tableStatus: Overlay;
+    /** Text to display next to the checkbox in the available items header. Used to dislay how many items are
+     *  selected when select all items is enabled
+     */
+    availableCheckboxText: string;
+    /** When set to true the select all items button will show in the available items header. This is
+     *  shown when the user has enabled select all for the item picker and the user selects the header checkbox
+     *  with more than one page of results.
+     */
+    showSelectAllItemsButton: boolean;
+    /** The total number of items returned from the api across all pages */
+    totalItemsBeforePaging?: number;
     /**
      * Template used to display the available and selected items as well as the available item header.
      * This will be set to the default template if a custom is not provided
@@ -87,7 +113,7 @@ export declare class ItemPickerComponent<T> implements OnInit, OnChanges, OnDest
     private defaultSelectedItemTemplate;
     /** Used to shut down our subscriptions when the component is destroyed */
     private destroyed;
-    constructor();
+    constructor(translateService: TranslateService);
     ngOnInit(): void;
     /**
      * Watch for changes and react if the custom item template value changes
@@ -108,11 +134,23 @@ export declare class ItemPickerComponent<T> implements OnInit, OnChanges, OnDest
      * @param removeItem
      */
     removeSelectedItem(removeItem: PickerItem): void;
+    /**
+     * Click handler for the select all items button
+     */
+    selectAllItems(): void;
+    /**
+     * Removes all items from the selected items map. This was split from the onClearSelectionClick function to allow
+     * selectAllItems to call this function but keep the row checkbox values in place. This was needed because when you are
+     * selecting all items across all pages we want the current page of items to remain checked.
+     *
+     */
+    private clearSelectedItemsMap;
     /**
      * Watch for changes to the row checkboxes form array and update the selected items
      * list
      */
     private setupRowCheckboxesWatcher;
+    private updateAvailableCheckboxText;
     /**
      * Watch to be told if changes to the map were made outside of the component and if so update
      * the array displayed in the selected list and select checkboxes for visible available items
@@ -120,5 +158,5 @@ export declare class ItemPickerComponent<T> implements OnInit, OnChanges, OnDest
     private setupSelectedItemsChangedWatcher;
     private setInternalizedTemplates;
     static ɵfac: i0.ɵɵFactoryDeclaration<ItemPickerComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ItemPickerComponent<any>, "ec-item-picker", never, { "id": "id"; "availableTitle": "availableTitle"; "selectedTitle": "selectedTitle"; "itemName": "itemName"; "formModel": "formModel"; "customAvailableHeaderTemplate": "customAvailableHeaderTemplate"; "customAvailableItemTemplate": "customAvailableItemTemplate"; "customSelectedItemTemplate": "customSelectedItemTemplate"; "ready": "ready"; "getItems": "getItems"; "selectionContext": "selectionContext"; "noDataMessage": "noDataMessage"; "noSelectedItemsMessage": "noSelectedItemsMessage"; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ItemPickerComponent<any>, "ec-item-picker", never, { "id": "id"; "availableTitle": "availableTitle"; "availableTitleHelpPopover": "availableTitleHelpPopover"; "selectedTitle": "selectedTitle"; "itemName": "itemName"; "formModel": "formModel"; "customAvailableHeaderTemplate": "customAvailableHeaderTemplate"; "customAvailableItemTemplate": "customAvailableItemTemplate"; "customSelectedItemTemplate": "customSelectedItemTemplate"; "ready": "ready"; "getItems": "getItems"; "selectionContext": "selectionContext"; "noDataMessage": "noDataMessage"; "noSelectedItemsMessage": "noSelectedItemsMessage"; "enableSelectAllItems": "enableSelectAllItems"; "selectAllItemsMessage": "selectAllItemsMessage"; }, {}, never, never, false, never>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@energycap/components",
-  "version": "0.39.25-ECAP-26374-menu-item-html-captions.20240923-1505",
+  "version": "0.39.25-ECAP-26539-Item-Picker-Select-All.20240923-1519",
   "dependencies": {
     "tslib": "^2.0.0"
   },

package/src/assets/locales/en_US.json

@@ -44,5 +44,8 @@
   "LearnMore_SC": "Learn more",
   "SelectZipFiles_ELS": "Select ZIP files...",
   "Browse_TC": "Browse",
-  "is invalid": "is invalid"
+  "is invalid": "is invalid",
+  "AllItemPickerItemsSelected_SC": "All {{count}} {{itemName}} selected",
+  "SelectAllItemPickerItems_TC": "Select all {{count}} {{itemName}}",
+  "CountSelected_TC": "{{count}} selected"
 }