@zohodesk/library-platform 1.1.12 → 1.2.0

package/es/library/behaviours/float-pagination/adapters/controllers/ScrollBottomController.js

@@ -0,0 +1,23 @@
+import AbstractController from "./AbstractController";
+
+class ScrollBottomController extends AbstractController {
+  handle(event) {
+    const {
+      scrollBottomUseCase
+    } = this.service;
+    let {
+      state,
+      updateState,
+      dispatch,
+      host
+    } = event;
+    scrollBottomUseCase.updateDependencies(state, updateState);
+    scrollBottomUseCase.execute({
+      dispatch,
+      host
+    });
+  }
+
+}
+
+export default ScrollBottomController;

package/es/library/behaviours/float-pagination/adapters/controllers/ScrollTopController.js

@@ -0,0 +1,23 @@
+import AbstractController from "./AbstractController";
+
+class ScrollTopController extends AbstractController {
+  handle(event) {
+    const {
+      scrollTopUseCase
+    } = this.service;
+    let {
+      state,
+      updateState,
+      dispatch,
+      host
+    } = event;
+    scrollTopUseCase.updateDependencies(state, updateState);
+    scrollTopUseCase.execute({
+      dispatch,
+      host
+    });
+  }
+
+}
+
+export default ScrollTopController;

package/es/library/behaviours/float-pagination/adapters/controllers/UpdateIndexController.js

@@ -0,0 +1,30 @@
+import AbstractController from "./AbstractController";
+
+class UpdateIndexController extends AbstractController {
+  handle(event) {
+    const {
+      updateIndexUseCase
+    } = this.service;
+    let {
+      state,
+      updateState,
+      action,
+      dispatch,
+      host
+    } = event;
+    const {
+      currentIndex
+    } = action.payload;
+    let selector = 'tr';
+    updateIndexUseCase.updateDependencies(state, updateState);
+    updateIndexUseCase.execute({
+      dispatch,
+      host,
+      selector,
+      currentIndex
+    });
+  }
+
+}
+
+export default UpdateIndexController;

package/es/library/behaviours/float-pagination/adapters/gateway/Repository.js

@@ -0,0 +1,27 @@
+import FloatPagination from "../../domain/entities/FloatPagination";
+export default class Repository {
+  init(state) {
+    this.state = state;
+  }
+
+  getFloatPaginationEntity() {
+    const {
+      behaviours,
+      properties
+    } = this.state;
+    const {
+      floatPaginationConfig
+    } = properties;
+    const isFloatPaginationConfig = floatPaginationConfig?.isEnabled;
+
+    if (!isFloatPaginationConfig) {
+      return null;
+    }
+
+    const {
+      floatPagination
+    } = behaviours;
+    return new FloatPagination(floatPagination.currentRecord, floatPagination.isVisible);
+  }
+
+}

package/es/library/behaviours/float-pagination/adapters/gateway/Service.js

@@ -0,0 +1,20 @@
+import FloatPagination from "../../applications/usecases/FloatPaginationUseCase";
+import InitializeUsecase from "../../applications/usecases/InitializeUsecase";
+import DestructUsecase from "../../applications/usecases/DestructUsecase";
+import ScrollTopUseCase from "../../applications/usecases/ScrollTopUseCase";
+import ScrollBottomUseCase from "../../applications/usecases/ScrollBottomUseCase";
+import UpdateIndexUseCase from "../../applications/usecases/UpdateIndexUseCase";
+
+class Service {
+  constructor(dependencies) {
+    this.InitializeUsecase = new InitializeUsecase(dependencies);
+    this.DestructUsecase = new DestructUsecase(dependencies);
+    this.floatPaginationUseCase = new FloatPagination(dependencies);
+    this.scrollTopUseCase = new ScrollTopUseCase(dependencies);
+    this.scrollBottomUseCase = new ScrollBottomUseCase(dependencies);
+    this.updateIndexUseCase = new UpdateIndexUseCase(dependencies);
+  }
+
+}
+
+export default Service;

package/es/library/behaviours/float-pagination/adapters/presenter/Presenter.js

@@ -0,0 +1,16 @@
+export default class Presenter {
+  updateDependencies(state, updateState) {
+    this.state = state;
+    this.updateState = updateState;
+  }
+
+  updateFloatPagination(floatPagination) {
+    this.state = { ...this.state,
+      behaviours: { ...this.state.behaviours,
+        floatPagination: floatPagination
+      }
+    };
+    this.updateState(this.state);
+  }
+
+}

package/es/library/behaviours/float-pagination/applications/interfaces/UseCaseDependencies.js

@@ -0,0 +1 @@
+export {};

package/es/library/behaviours/float-pagination/applications/interfaces/gateways/IRepository.js

@@ -0,0 +1 @@
+export {};

package/es/library/behaviours/float-pagination/applications/interfaces/gateways/IService.js

@@ -0,0 +1 @@
+export {};

package/es/library/behaviours/float-pagination/applications/interfaces/input/DestructInputModel.js

@@ -0,0 +1 @@
+export {};

package/es/library/behaviours/float-pagination/applications/interfaces/input/FloatPaginationInputModel.js

@@ -0,0 +1 @@
+export {};

package/es/library/behaviours/float-pagination/applications/interfaces/input/InitializeInputModel.js

@@ -0,0 +1 @@
+export {};

package/es/library/behaviours/float-pagination/applications/interfaces/input/ScrollTopInputModel.js

@@ -0,0 +1 @@
+export {};

package/es/library/behaviours/float-pagination/applications/interfaces/input/ScrollbottomInputModel.js

@@ -0,0 +1 @@
+export {};

package/es/library/behaviours/float-pagination/applications/interfaces/input/UpdateIndexInputModel.js

@@ -0,0 +1 @@
+export {};

package/es/library/behaviours/float-pagination/applications/interfaces/output/FloatPaginationOutputModel.js

@@ -0,0 +1 @@
+export {};

package/es/library/behaviours/float-pagination/applications/interfaces/output/IPresenter.js

@@ -0,0 +1 @@
+export {};

package/es/library/behaviours/float-pagination/applications/usecases/AbstractUseCase.js

@@ -0,0 +1,17 @@
+class AbstractUseCase {
+  constructor(dependencies) {
+    this.dependencies = dependencies;
+  }
+
+  updateDependencies(state, updateState) {
+    const {
+      repository,
+      presenter
+    } = this.dependencies;
+    repository.init(state);
+    presenter.updateDependencies(state, updateState);
+  }
+
+}
+
+export default AbstractUseCase;

package/es/library/behaviours/float-pagination/applications/usecases/DestructUsecase.js

@@ -0,0 +1,15 @@
+import AbstractUseCase from "./AbstractUseCase";
+
+class DestructUsecase extends AbstractUseCase {
+  execute() {
+    const {
+      repository,
+      presenter
+    } = this.dependencies;
+    const floatPagination = repository.getFloatPaginationEntity();
+    floatPagination && presenter.updateFloatPagination(floatPagination.toObject());
+  }
+
+}
+
+export default DestructUsecase;

package/es/library/behaviours/float-pagination/applications/usecases/FloatPaginationUseCase.js

@@ -0,0 +1,31 @@
+import AbstractUseCase from "./AbstractUseCase";
+import { FLOAT_PAGINATION_BEHAVIOUR_INDEX_UPDATED } from "../../../../../bc/float-pagination/Constants";
+
+class FloatPaginationUseCase extends AbstractUseCase {
+  execute(input) {
+    const {
+      visiblityCheck,
+      repository
+    } = this.dependencies;
+    const {
+      host,
+      selector,
+      dispatch
+    } = input;
+    const floatPagination = repository.getFloatPaginationEntity();
+
+    if (floatPagination) {
+      visiblityCheck.init(host, selector, currentIndex => {
+        dispatch({
+          type: FLOAT_PAGINATION_BEHAVIOUR_INDEX_UPDATED,
+          payload: {
+            currentIndex
+          }
+        });
+      });
+    }
+  }
+
+}
+
+export default FloatPaginationUseCase;

package/es/library/behaviours/float-pagination/applications/usecases/InitializeUsecase.js

@@ -0,0 +1,16 @@
+import AbstractUseCase from "./AbstractUseCase";
+
+class InitializeUsecase extends AbstractUseCase {
+  execute() {
+    const {
+      repository,
+      presenter,
+      visiblityCheck
+    } = this.dependencies;
+    const floatPagination = repository.getFloatPaginationEntity();
+    presenter.updateFloatPagination(floatPagination.toObject());
+  }
+
+}
+
+export default InitializeUsecase;

package/es/library/behaviours/float-pagination/applications/usecases/ScrollBottomUseCase.js

@@ -0,0 +1,23 @@
+import AbstractUseCase from "./AbstractUseCase";
+
+class ScrollBottomUseCase extends AbstractUseCase {
+  execute(input) {
+    const {
+      host
+    } = input;
+
+    if (host) {
+      const el = host.children[1];
+
+      if (typeof el.scrollTo === "function") {
+        el.scrollTo({
+          top: el.scrollHeight,
+          behavior: "smooth"
+        });
+      }
+    }
+  }
+
+}
+
+export default ScrollBottomUseCase;

package/es/library/behaviours/float-pagination/applications/usecases/ScrollTopUseCase.js

@@ -0,0 +1,23 @@
+import AbstractUseCase from "./AbstractUseCase";
+
+class ScrollTopUseCase extends AbstractUseCase {
+  execute(input) {
+    const {
+      host
+    } = input;
+
+    if (host) {
+      const el = host.children[1];
+
+      if (typeof el.scrollTo === "function") {
+        el.scrollTo({
+          top: 0,
+          behavior: "smooth"
+        });
+      }
+    }
+  }
+
+}
+
+export default ScrollTopUseCase;

package/es/library/behaviours/float-pagination/applications/usecases/UpdateIndexUseCase.js

@@ -0,0 +1,28 @@
+import AbstractUseCase from "./AbstractUseCase";
+
+class UpdateIndexUseCase extends AbstractUseCase {
+  execute(input) {
+    const {
+      repository,
+      presenter,
+      visiblityCheck
+    } = this.dependencies;
+    const {
+      host,
+      currentIndex
+    } = input; // Update the entity with the current record
+
+    const floatPagination = repository.getFloatPaginationEntity();
+
+    if (floatPagination && currentIndex !== floatPagination.getCurrentRecordIndex()) {
+      const recordIndex = visiblityCheck.getRowStartingIndex(host);
+      const isVisible = recordIndex > 0 ? true : false;
+      floatPagination.setCurrentRecordIndex(currentIndex);
+      floatPagination.setIsVisible(isVisible);
+      presenter.updateFloatPagination(floatPagination.toObject());
+    }
+  }
+
+}
+
+export default UpdateIndexUseCase;

package/es/library/behaviours/float-pagination/domain/entities/FloatPagination.js

@@ -0,0 +1,28 @@
+class FloatPagination {
+  constructor(currentRecordIndex, isVisible) {
+    this.currentRecordIndex = currentRecordIndex;
+    this.isVisible = isVisible;
+  }
+
+  getCurrentRecordIndex() {
+    return this.currentRecordIndex;
+  }
+
+  setCurrentRecordIndex(currentRecordIndex) {
+    this.currentRecordIndex = currentRecordIndex;
+  }
+
+  setIsVisible(isVisible) {
+    this.isVisible = isVisible;
+  }
+
+  toObject() {
+    return {
+      currentRecord: this.currentRecordIndex,
+      isVisible: this.isVisible
+    };
+  }
+
+}
+
+export default FloatPagination;

package/es/library/behaviours/float-pagination/domain/entities/interfaces/IFloatPagination.js

@@ -0,0 +1 @@
+export {};

package/es/library/behaviours/float-pagination/frameworks/ui/ActionsHandlerFactory.js

@@ -0,0 +1,37 @@
+import FloatPaginationController from "../../adapters/controllers/FloatPaginationController";
+import Repository from "../../adapters/gateway/Repository";
+import Service from "../../adapters/gateway/Service";
+import Presenter from "../../adapters/presenter/Presenter";
+import LifeCycleAction from "../../../../../cc/architecture/LifeCycleActionEnum";
+import InitializeController from "../../adapters/controllers/InitializeController";
+import DestructController from "../../adapters/controllers/DestructController";
+import { FLOAT_PAGINATION_BEHAVIOUR_BOTTOM_UPDATED, FLOAT_PAGINATION_BEHAVIOUR_INDEX_UPDATED, FLOAT_PAGINATION_BEHAVIOUR_TOP_UPDATED, FLOAT_PAGINATION_BEHAVIOUR_UPDATE_REQUESTED } from "../../../../../bc/float-pagination/Constants";
+import ElementVisibilityChecker from "../utils";
+import ScrollTopController from "../../adapters/controllers/ScrollTopController";
+import ScrollBottomController from "../../adapters/controllers/ScrollBottomController";
+import UpdateIndexController from "../../adapters/controllers/UpdateIndexController"; // TODO: Rename as EventHandlersFactory
+
+class ActionsHandlersFactory {
+  static create() {
+    const presenter = new Presenter();
+    const repository = new Repository();
+    const visiblityCheck = new ElementVisibilityChecker();
+    const service = new Service({
+      presenter,
+      repository,
+      visiblityCheck
+    });
+    const controller = new FloatPaginationController(service);
+    return {
+      [LifeCycleAction.MOUNT]: new InitializeController(service).handle,
+      [LifeCycleAction.UN_MOUNT]: new DestructController(service).handle,
+      [FLOAT_PAGINATION_BEHAVIOUR_UPDATE_REQUESTED]: controller.handle,
+      [FLOAT_PAGINATION_BEHAVIOUR_TOP_UPDATED]: new ScrollTopController(service).handle,
+      [FLOAT_PAGINATION_BEHAVIOUR_BOTTOM_UPDATED]: new ScrollBottomController(service).handle,
+      [FLOAT_PAGINATION_BEHAVIOUR_INDEX_UPDATED]: new UpdateIndexController(service).handle
+    };
+  }
+
+}
+
+export default ActionsHandlersFactory;

package/es/library/behaviours/float-pagination/frameworks/ui/FloatPaginationBehaviourFactory.js

@@ -0,0 +1,21 @@
+import properties from "../../../../../bc/float-pagination/Properties";
+import ActionsHandlerFactory from "./ActionsHandlerFactory";
+
+class FloatPaginationBehaviourFactory {
+  static create() {
+    return {
+      name: 'floatPagination',
+      setInitialState: () => {
+        return {
+          currentRecord: 0,
+          isVisible: false
+        };
+      },
+      properties,
+      eventHandlers: ActionsHandlerFactory.create()
+    };
+  }
+
+}
+
+export default FloatPaginationBehaviourFactory;

package/es/library/behaviours/float-pagination/frameworks/utils.js

@@ -0,0 +1,70 @@
+export default class ElementVisibilityChecker {
+  elements = [];
+  observer = null;
+
+  constructor() {}
+
+  init(containerEle, selector, callback) {
+    this.container = containerEle;
+    this.elements = Array.from(containerEle.querySelectorAll(selector));
+    this.onVisibleChange = callback;
+    this.initObserver();
+  }
+
+  getRowStartingIndex(host) {
+    const tbody = host.querySelector('table tbody');
+    const firstRow = tbody?.querySelector('tr:first-child');
+
+    if (firstRow) {
+      const rowHeight = firstRow.getBoundingClientRect().height;
+      const scrollTop = tbody.parentElement.scrollTop;
+      const startIndex = Math.floor(scrollTop / rowHeight);
+      return startIndex;
+    }
+
+    return 0;
+  }
+  /** Simple geometry-based visibility check */
+
+
+  isVisible(element, container) {
+    const rect = element.getBoundingClientRect();
+    const containerRect = container.getBoundingClientRect();
+    return rect.bottom < containerRect.bottom;
+  }
+  /** Start observing visibility */
+
+
+  initObserver() {
+    if (!this.elements.length) return;
+    this.observer = new IntersectionObserver(() => {
+      const newIndex = this.getCurrentVisibleIndex(); // Fire callback whenever visibility changes
+
+      if (this.onVisibleChange) {
+        this.onVisibleChange(newIndex);
+      }
+    }, {
+      threshold: [0.5]
+    });
+    this.elements.forEach(el => this.observer.observe(el));
+  }
+  /** Get the last visible element index */
+
+
+  getCurrentVisibleIndex() {
+    let lastVisibleIndex = -1;
+
+    for (let i = this.elements.length - 1; i >= 0; i--) {
+      if (this.isVisible(this.elements[i], this.container)) {
+        return i;
+      }
+    }
+
+    return lastVisibleIndex;
+  }
+
+  disconnect() {
+    this.observer?.disconnect();
+  }
+
+}

package/es/library/behaviours/keyboard-controls/adapters/gateways/Repository.js

@@ -13,6 +13,7 @@ class Repository {
     const {
       keyboardControlsConfig
     } = properties;
+    const selectionConfig = properties.selectionConfig;
     let isKeyboardControlEnabled = keyboardControlsConfig?.isEnabled;
 
     if (!isKeyboardControlEnabled) {
@@ -31,7 +32,7 @@ class Repository {
     /* eslint-disable-next-line @zohodesk/architecturerules/no-defaultProps-rule */
 
     const totalRows = zrecord?.records?.length || 0;
-    return new KeyboardControls(focussedIndex, totalRows);
+    return new KeyboardControls(focussedIndex, totalRows, selectionConfig.isEnabled);
   }
 
 }

package/es/library/behaviours/keyboard-controls/applications/usecases/SpacePress.js

@@ -11,7 +11,7 @@ class SpacePress extends AbstractUseCase {
       event
     } = inputModel;
     const data = keyboardControls.getSelectionEvent(event);
-    dispatch(data);
+    data && dispatch(data);
   }
 
 }

package/es/library/behaviours/keyboard-controls/domain/entities/KeyboardControls.js

@@ -1,9 +1,10 @@
 import { SMART_TABLE_ACTION_TRIGGERED, SMART_TABLE_SELECTION_TOGGLED } from "../../../../../cc/table-connected/constants/Events";
 
 class KeyboardControls {
-  constructor(focussedIndex, totalLists) {
+  constructor(focussedIndex, totalLists, isSelectionEnabled) {
     this.focussedIndex = focussedIndex;
     this.totalLists = totalLists;
+    this.isSelectionEnabled = isSelectionEnabled;
   }
 
   setFocussedIndex(index) {
@@ -59,6 +60,10 @@ class KeyboardControls {
 
 
   getSelectionEvent(event) {
+    if (!this.isSelectionEnabled) {
+      return null;
+    }
+
     return {
       type: SMART_TABLE_SELECTION_TOGGLED,
       payload: {

package/es/library/behaviours/list-selection/domain/entities/ListItemSelection.js

@@ -2,6 +2,8 @@ import Event from "../../../../custom-component/domain/entities/Event";
 import { LIST_SELECTION_RECORDS_DESELECTED, LIST_SELECTION_RECORDS_SELECTED, LIST_SELECTION_SELECTION_LIMIT_EXCEEDED } from "../../../../../bc/list-selection/Constants";
 
 class ListItemSelection {
+  previousSelected = [];
+
   constructor(selected, itemIds, maxSelectionCount) {
     let selectionStatus = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'na';
     this.selected = selected;
@@ -30,12 +32,19 @@ class ListItemSelection {
   }
 
   selectAllItems() {
-    this.itemIds.forEach(id => !this.hasAllSelected() && this.selectItem(id));
+    for (const id of this.itemIds) {
+      if (this.hasAllSelected()) {
+        break;
+      }
+
+      this.selectItem(id);
+    }
   }
 
   deselectAllItems() {
+    this.previousSelected = [...this.selected];
     this.selected = [];
-    this.selectionStatus = 'na';
+    this.selectionStatus = 'deselected';
   }
 
   toggleItems(ids) {
@@ -56,15 +65,7 @@ class ListItemSelection {
 
   toggleAll() {
     if (!this.hasAllSelected()) {
-      for (let id of this.itemIds) {
-        if (this.hasAllSelected()) {
-          break;
-        }
-
-        if (!this.isSelected(id)) {
-          this.selectItem(id);
-        }
-      }
+      this.selectAllItems();
     } else {
       this.deselectAllItems();
     }
@@ -95,23 +96,29 @@ class ListItemSelection {
 
     if (this.selectionStatus === 'deselected') {
       events.push(new Event(LIST_SELECTION_RECORDS_DESELECTED, {
-        recordIds: ids
+        recordIds: ids ? ids : this.previousSelected
       }));
     }
 
     if (this.selectionStatus === 'na' && this.hasAllSelected()) {
-      events.push(new Event(LIST_SELECTION_SELECTION_LIMIT_EXCEEDED));
+      events.push(new Event(LIST_SELECTION_SELECTION_LIMIT_EXCEEDED, {
+        maxSelectionAllowed: this.maxSelectionCount
+      }));
     }
 
     return events.map(event => event.toObject());
   }
 
   selectItem(id) {
-    this.selected.push(id);
+    if (!this.isSelected(id)) {
+      this.selected.push(id);
+    }
+
     this.selectionStatus = 'selected';
   }
 
   deselectItem(id) {
+    this.previousSelected.push(id);
     this.selected = this.selected.filter(selectedId => selectedId !== id);
     this.selectionStatus = 'deselected';
   }
@@ -126,10 +133,6 @@ class ListItemSelection {
     return hasMaxSelected || allItemsSelected;
   }
 
-  getStrategy(id) {
-    return (this.isSelected(id) ? this.deselectItem : this.selectItem).bind(this);
-  }
-
   toggleRange(startIndex, endIndex) {
     const isForward = startIndex < endIndex;
     const [start, end] = isForward ? [startIndex, endIndex] : [endIndex, startIndex];

package/es/library/behaviours/search/adapters/controllers/AbstractController.js

@@ -0,0 +1,9 @@
+class AbstractController {
+  constructor(service) {
+    this.service = service;
+    this.handle = this.handle.bind(this);
+  }
+
+}
+
+export default AbstractController;