@zohodesk/library-platform 1.0.1 → 1.0.2-exp.1.1

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

@@ -0,0 +1,171 @@
+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 {
+  constructor(selected, itemIds, maxSelectionCount) {
+    let selectionStatus = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'na';
+    this.selected = selected;
+    this.itemIds = itemIds;
+    this.maxSelectionCount = maxSelectionCount;
+    this.selectionStatus = selectionStatus;
+    this.selected = this.selected.filter(selectedId => this.itemIds.includes(selectedId)); // NOTE: Remove items that does not exist
+  }
+
+  selectItems(ids) {
+    if (!ids) {
+      this.selectAllItems();
+      return;
+    }
+
+    ids.forEach(id => !this.hasAllSelected() && this.selectItem(id));
+  }
+
+  deselectItems(ids) {
+    if (!ids) {
+      this.deselectAllItems();
+      return;
+    }
+
+    ids.forEach(id => this.deselectItem(id));
+  }
+
+  selectAllItems() {
+    this.itemIds.forEach(id => !this.hasAllSelected() && this.selectItem(id));
+  }
+
+  deselectAllItems() {
+    this.selected = [];
+    this.selectionStatus = 'na';
+  }
+
+  toggleItems(ids) {
+    // let selectingItems = ids.filter(id => !this.isSelected(id));
+    // this.selectItems(selectingItems);
+    for (let id of ids) {
+      if (this.isSelected(id)) {
+        this.deselectItem(id);
+      } else {
+        if (this.hasAllSelected()) {
+          break;
+        }
+
+        this.selectItem(id);
+      }
+    }
+  }
+
+  toggleAll() {
+    if (!this.hasAllSelected()) {
+      for (let id of this.itemIds) {
+        if (this.hasAllSelected()) {
+          break;
+        }
+
+        if (!this.isSelected(id)) {
+          this.selectItem(id);
+        }
+      }
+    } else {
+      this.deselectAllItems();
+    }
+  }
+
+  toggleUpto(id) {
+    let lastItem = this.selected.at(-1) || id;
+    let startIndex = this.itemIds.indexOf(lastItem);
+    let endIndex = this.itemIds.indexOf(id);
+    this.toggleRange(startIndex, endIndex);
+  }
+
+  toObject() {
+    return {
+      selected: this.selected,
+      hasAllSelected: this.hasAllSelected()
+    };
+  }
+
+  createDispatchProps(ids) {
+    const events = [];
+
+    if (this.selectionStatus === 'selected') {
+      events.push(new Event(LIST_SELECTION_RECORDS_SELECTED, {
+        recordIds: this.selected
+      }));
+    }
+
+    if (this.selectionStatus === 'deselected') {
+      events.push(new Event(LIST_SELECTION_RECORDS_DESELECTED, {
+        recordIds: ids
+      }));
+    }
+
+    if (this.selectionStatus === 'na' && this.hasAllSelected()) {
+      events.push(new Event(LIST_SELECTION_SELECTION_LIMIT_EXCEEDED));
+    }
+
+    return events.map(event => event.toObject());
+  }
+
+  selectItem(id) {
+    this.selected.push(id);
+    this.selectionStatus = 'selected';
+  }
+
+  deselectItem(id) {
+    this.selected = this.selected.filter(selectedId => selectedId !== id);
+    this.selectionStatus = 'deselected';
+  }
+
+  isSelected(id) {
+    return this.selected.includes(id);
+  }
+
+  hasAllSelected() {
+    const hasMaxSelected = this.selected.length >= this.maxSelectionCount;
+    const allItemsSelected = this.selected.length === this.itemIds.length && this.selected.length > 0;
+    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];
+    const itemsForSelection = this.itemIds.slice(start, end + 1);
+    const allSelected = itemsForSelection.every(id => this.isSelected(id));
+    const yetToSelectCount = this.maxSelectionCount - this.selected.length;
+    const itemsToSelect = itemsForSelection.filter(id => !this.isSelected(id));
+    this.rangeSelection(isForward, itemsForSelection, allSelected, yetToSelectCount, itemsToSelect);
+  }
+
+  rangeSelection(isForward, itemsForSelection, allSelected, yetToSelectCount, itemsToSelect) {
+    if (allSelected) {
+      if (isForward) {
+        itemsForSelection.forEach(id => this.deselectItem(id));
+      } else {
+        itemsForSelection.reverse().forEach(id => this.deselectItem(id));
+      }
+    } else {
+      if (itemsToSelect.length > yetToSelectCount) {
+        if (isForward) {
+          itemsToSelect.splice(yetToSelectCount);
+        } else {
+          itemsToSelect.reverse();
+          itemsToSelect.splice(yetToSelectCount);
+          itemsToSelect.reverse();
+        }
+      }
+
+      if (isForward) {
+        itemsToSelect.forEach(id => this.selectItem(id));
+      } else {
+        itemsToSelect.reverse().forEach(id => this.selectItem(id));
+      }
+    }
+  }
+
+}
+
+export default ListItemSelection;

package/es/library/behaviours/list-selection/frameworks/ActionHandlerFactory.js

@@ -1,4 +1,4 @@
-import { LIST_SELECTION_TOGGLE_ALL, LIST_SELECTION_TOGGLE_ITEMS, LIST_SELECTION_TOGGLE_ITEMS_IN_RANGE } from "../../../../bc/list-selection/Constants";
+import { LIST_SELECTION_DESELECT_ITEM, LIST_SELECTION_SELECT_ITEM, LIST_SELECTION_TOGGLE_ALL, LIST_SELECTION_TOGGLE_ITEMS, LIST_SELECTION_TOGGLE_ITEMS_IN_RANGE } from "../../../../bc/list-selection/Constants";
 import InitializeController from "../adapters/controllers/InitializeController";
 import Repository from "../adapters/gateways/Repository";
 import Presenter from "../adapters/presenters/Presenter";
@@ -8,6 +8,8 @@ import AllSelectionController from "../adapters/controllers/AllSelectionControll
 import RangeSelectionController from "../adapters/controllers/RangeSelectionController";
 import UpdateController from "../adapters/controllers/UpdateController";
 import DestructController from "../adapters/controllers/DestructController";
+import SelectController from "../adapters/controllers/SelectController";
+import DeselectController from "../adapters/controllers/DeselectController";
 
 class ActionHandlerFactory {
   static create() {
@@ -29,6 +31,8 @@ class ActionHandlerFactory {
       ['MOUNT']: new InitializeController(service).handle,
       ['UPDATE_PROPERTIES']: new UpdateController(service).handle,
       ['UNMOUNT']: new DestructController(service).handle,
+      [LIST_SELECTION_SELECT_ITEM]: new SelectController(service).handle,
+      [LIST_SELECTION_DESELECT_ITEM]: new DeselectController(service).handle,
       [LIST_SELECTION_TOGGLE_ITEMS]: new SelectionController(service).handle,
       [LIST_SELECTION_TOGGLE_ALL]: new AllSelectionController(service).handle,
       [LIST_SELECTION_TOGGLE_ITEMS_IN_RANGE]: new RangeSelectionController(service).handle

package/es/library/behaviours/local-storage/adapters/controllers/AbstractController.js

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

package/es/library/behaviours/local-storage/adapters/controllers/SetDataController.js

@@ -0,0 +1,22 @@
+import AbstractController from "./AbstractController";
+export class SetDataController extends AbstractController {
+  handle(event) {
+    const {
+      storeKey,
+      data
+    } = event.action.payload;
+    const {
+      state,
+      updateState
+    } = event;
+    const {
+      setDataUseCase
+    } = this.service;
+    setDataUseCase.updateDependency(state, updateState);
+    setDataUseCase.execute({
+      id: storeKey,
+      data
+    });
+  }
+
+}

package/es/library/behaviours/local-storage/adapters/gateways/LocalStorageRepository.js

@@ -0,0 +1,26 @@
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import Storage from "../../domain/entities/Storage";
+import { STORE_KEY } from "../../../../../bc/local-storage/Constants";
+export class LocalStorageRepository {
+  constructor() {
+    _defineProperty(this, "state", void 0);
+  }
+
+  init(state) {
+    this.state = state;
+  }
+
+  getStorage() {
+    const dataString = window.localStorage.getItem(STORE_KEY);
+    const data = typeof dataString === 'string' ? JSON.parse(dataString) : {};
+    const storage = new Storage(data);
+    return storage;
+  }
+
+  setStorage(storage) {
+    const data = storage.toObject();
+    window.localStorage.setItem(STORE_KEY, JSON.stringify(data));
+  }
+
+}

package/es/library/behaviours/local-storage/adapters/gateways/Service.js

@@ -0,0 +1,14 @@
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import SetDataUseCase from "../../applications/usecases/SetDataUseCase";
+
+class Service {
+  constructor(dependencies) {
+    _defineProperty(this, "setDataUseCase", void 0);
+
+    this.setDataUseCase = new SetDataUseCase(dependencies);
+  }
+
+}
+
+export default Service;

package/es/library/behaviours/local-storage/adapters/presenters/Presenter.js

@@ -0,0 +1,38 @@
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+export default class Presenter {
+  constructor() {
+    _defineProperty(this, "updateState", void 0);
+
+    _defineProperty(this, "state", void 0);
+  }
+
+  updateDependencies(state, updateState) {
+    this.state = state;
+    this.updateState = updateState; // this.updateState =
+    //   typeof updateState === 'function' ? updateState : () => {};
+  } // getViewModel(): BehaviourState | null {
+  //   return this.state.behaviours.localStorage;
+  // }
+
+
+  setBehaviourState(newState) {
+    const {
+      state
+    } = this;
+    this.state = { ...state,
+      behaviours: { ...state.behaviours,
+        localStorage: newState
+      }
+    };
+    this.updateState(this.state);
+  } // clearBehaviourState() {
+  //   this.setBehaviourState(null);
+  // }
+
+
+  updateBehaviourState(newState) {
+    this.setBehaviourState(newState);
+  }
+
+}

package/es/library/behaviours/local-storage/applications/usecases/SetDataUseCase.js

@@ -0,0 +1,17 @@
+import AbstractUseCase from "./AbstractUseCase";
+
+class SetDataUseCase extends AbstractUseCase {
+  execute(input) {
+    const {
+      repository,
+      presenter
+    } = this.dependencies;
+    const storage = repository.getStorage();
+    storage.setData(input.id, input.data);
+    repository.setStorage(storage);
+    presenter.updateBehaviourState(storage.toObject());
+  }
+
+}
+
+export default SetDataUseCase;

package/es/library/behaviours/local-storage/domain/entities/Storage.js

@@ -0,0 +1,28 @@
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+class Storage {
+  constructor(data) {
+    _defineProperty(this, "data", void 0);
+
+    this.data = data;
+  }
+
+  setData(id, data) {
+    this.data[id] = data;
+  }
+
+  getData(id) {
+    return this.data[id];
+  }
+
+  deleteData(id) {
+    delete this.data[id];
+  }
+
+  toObject() {
+    return this.data;
+  }
+
+}
+
+export default Storage;

package/es/library/behaviours/local-storage/frameworks/LocalStorageBehaviourFactory.js

@@ -0,0 +1,28 @@
+import { STORE_KEY, STORE_REQUESTED } from "../../../../bc/local-storage/Constants";
+import Properties from "../../../../bc/local-storage/Properties";
+import { SetDataController } from "../adapters/controllers/SetDataController";
+import { LocalStorageRepository } from "../adapters/gateways/LocalStorageRepository";
+import Service from "../adapters/gateways/Service";
+import Presenter from "../adapters/presenters/Presenter";
+export default class LocalStorageBehaviourFactory {
+  static create() {
+    const presenter = new Presenter();
+    const repository = new LocalStorageRepository();
+    const service = new Service({
+      repository,
+      presenter
+    });
+    return {
+      name: 'localStorage',
+      setInitialState: () => {
+        const data = localStorage.getItem(STORE_KEY);
+        return typeof data === 'string' ? JSON.parse(data) : {};
+      },
+      properties: Properties,
+      eventHandlers: {
+        [STORE_REQUESTED]: new SetDataController(service).handle
+      }
+    };
+  }
+
+}

package/es/library/behaviours/sort-by/adapters/gateway/Repository.js

@@ -1,6 +1,6 @@
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-import SortBy from "../../entities/SortBy";
+import SortBy from "../../domain/entities/SortBy";
 export default class Repository {
   constructor() {
     _defineProperty(this, "state", void 0);

package/es/library/behaviours/sort-by/adapters/gateway/Service.js

@@ -1,6 +1,6 @@
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-import SortBy from "../../usecases/interactors/SortBy";
+import SortBy from "../../applications/usecases/SortBy";
 
 class Service {
   constructor(dependencies) {

package/es/library/behaviours/sort-by/domain/entities/SortBy.js

@@ -0,0 +1,42 @@
+import SortOrderEnum from "../../../../../bc/sort-by/SortOrderEnum";
+
+class SortBy {
+  constructor(id, name, order) {
+    this.id = id;
+    this.name = name;
+    this.order = order;
+  }
+
+  toggleSort() {
+    if (this.order === SortOrderEnum.ASC) {
+      this.order = SortOrderEnum.DES;
+    } else {
+      this.order = SortOrderEnum.ASC;
+    }
+  }
+
+  resetSortBy(id, name) {
+    this.id = id;
+    this.name = name;
+    this.order = SortOrderEnum.ASC;
+  }
+
+  toObject() {
+    return {
+      id: this.id,
+      name: this.name,
+      order: this.order
+    };
+  }
+
+  doSorting(id, name) {
+    if (this.id === id) {
+      this.toggleSort();
+    } else {
+      this.resetSortBy(id, name);
+    }
+  }
+
+}
+
+export default SortBy;

package/es/library/behaviours/sort-by/frameworks/ui/SortByBehaviourFactory.js

@@ -10,9 +10,9 @@ class SortByBehaviourFactory {
           properties
         } = _ref;
         const {
-          filter
+          sortBy
         } = properties;
-        return (filter === null || filter === void 0 ? void 0 : filter.sortBy) || {};
+        return sortBy || {};
       },
       properties: Properties,
       eventHandlers: ActionsHandlerFactory.create()

package/es/library/behaviours/table-column-resizer/Readme.md

@@ -0,0 +1,141 @@
+# Table Column Resizer Behavior
+
+This document outlines the properties, action handlers, and dispatching actions related to the Table Column Resizer Behavior. This behavior is designed to handle the resizing of table columns in a user interface.
+
+## Properties
+
+### `resizeConfig`
+
+The `resizeConfig` object contains configuration settings for the column resizer.
+
+```typescript
+type ResizeConfig = {
+  enabled: boolean;
+  isRTL: boolean;
+  maxWidth: number;
+  minWidth: number;
+};
+```
+
+#### Note: State and Properties
+
+The properties used by the behavior are derived from the state. The following state structure is expected:
+
+```typescript
+export type State = {
+  properties: {
+    resizeConfig: ResizeConfig;
+  };
+};
+```
+
+## Listening Action Handlers
+
+Action handlers respond to various actions related to column resizing. Each action handler receives a `dispatch`, `updateState`, and `state` parameter, so we only describe the payload here.
+
+### `MOUNT`
+
+This action is triggered when the column resizer is mounted.
+
+```typescript
+export type InitActionHandlerPayload = {
+  tableElement: HTMLElement;
+  columnName: string;
+  columnWidth: number;
+  initialPosition: number;
+};
+```
+
+### `COLUMN_RESIZER#RESIZE_STARTED`
+
+This action is triggered when a column resize operation starts.
+
+> Payload: `ResizeStartPayload`
+
+```typescript
+export type ResizeStartPayload = {
+  columnName: string;
+  initialPosition: number;
+  tableElement: HTMLElement;
+  columnWidth: number;
+  mouseEvent: MouseEvent;
+};
+```
+
+### `COLUMN_RESIZER#RESIZE_SCROLL`
+
+This action is triggered when the column is resized via a scroll event.
+
+> Payload: `ResizeByMouseActionPayload`
+
+```typescript
+export type ResizeByMouseActionPayload = {
+  mouseEvent: MouseEvent;
+};
+```
+
+### `COLUMN_RESIZER#RESIZE_MOUSE`
+
+This action is triggered when the column is resized via a mouse event.
+
+> Payload: `ResizeByScrollActionPayload`
+
+```typescript
+export type ResizeByScrollActionPayload = {}; // No payload needed
+```
+
+### `COLUMN_RESIZER#RESIZE_ENDED`
+
+This action is triggered when the column resize operation ends.
+
+> Payload: `ResizeEndActionPayload`
+
+```typescript
+export type ResizeEndActionPayload = {}; // No payload needed
+```
+
+#### Note: BaseActionParams
+
+Action handlers within the behavior expect payloads to be structured as shown below. This ensures consistency when handling actions.
+
+```typescript
+type BaseActionParams<Payload> = {
+  action: { payload: Payload };
+  dispatch: Dispatch;
+  updateState: UpdateState;
+  state: State;
+};
+```
+
+## Dispatching Actions from Behavior
+
+The behavior dispatches actions to update the state in response to user interactions.
+
+### `COLUMN_RESIZER#RESIZE_FINISHED`
+
+This action is dispatched when a column resize operation is completed.
+
+```typescript
+type ResizeFinishedAction = {
+  type: 'COLUMN_RESIZER#RESIZE_FINISHED';
+  payload: {
+    columnName: string;
+    oldWidth: number;
+    newWidth: number;
+  };
+};
+```
+
+#### Example Usage
+
+When using this behavior, to listen for the `ResizeFinishedAction`, you need to set up an action handler with the name `'COLUMN_RESIZER#RESIZE_FINISHED'`. This handler will receive the action's payload.
+
+```typescript
+{
+  actionHandlers: {
+    'COLUMN_RESIZER#RESIZE_FINISHED': (resizeFinishedAction: ResizeFinishedAction): void => {
+      // Handle the resize finished action
+    }
+  }
+}
+```