Dflex Versions Save

Fix dragged siblings boundaries calculations (#421)

• Fix dragged siblings' boundaries when it calculates width and height.
• Fix isLeavingFromHead and strict index to zero.
• Remove unnecessary conditions in isOutThreshold.
• Change threshold to include bottom/right or four directions moving away from two points approach.

Add grid position to each cell and use private hashes for util classes (#425)

• Fix coordinates interface in the core.
• Add a grid for each cell and one for each sibling.
• Enhance Core interface documentation.
• Use private hashes for util classes.

Remove isDraggedOutPosition and isDraggedOutContainer (#419)

Use SWC for Jest and remove Babel (#424)

Enhance Threshold for dragged and containers (#408)

• Add Interface to Axes Coordinate.
• Keep draggedOutPosition to dragged inside the parent container. Removing unnecessary flags.
• Enhance threshold to have main object contains the main element threshold instead of the previous approach which included unclear properties. The new threshold has max and min for each defined point defined as follows:

interface ThresholdPointInterface {
  max: number;
  min: number;
}

• Add utility class ThresholdPoint for each point.

Use strict read-only flags for Draggable (#409)

• More unified approach, refactoring siblingsBoundaries to type Rect
• Enhance Draggable interface and strict flags to read-only
• Enhance Axes class and extend it to a new type for boolean.

Add a new dragging implementation for Interactive/Axes (#410)

• A more unified approach, refactoring siblingsBoundaries to type Rect
• Enhance Draggable interface and strict flags to read-only
• Enhance Axes class and extend it to a new type for boolean.

Add Threshold to Utils and group AxesCoordinates classes (#414)

Remove mouse pointers from all position detectors (#416)

Add threshold indicators to each active layout (#418)

• Add a new class AxesFourCoordinatesBool for dealing with layout position in four directions.
• Add the new direction instance to the threshold. Include all the position indicators in the threshold that has a store for threshold(thresholds)/indicators(isOut).
• Enable position flags for dragged and the parent layout instead of depending on one set of flags for position detection.

Use axes point to deal with current offset (top/left) (#403)

Add both axes to transformers in the Core (#404)

• Update seTranslate, setPosition and rollBack in the Core and all related classe to include both axes.
• Add more types to the utils. As part of shared types/functions to include Axes and EffectedElemDirection.
• Remove legacy current position updaters and use setAxes instead.
• Replace TempOffset with AxesCoordinates

Add attributes to dragged for out container and position (#405)

• Add new attributes to dragged to include "dragged" | "out-position" | "out-container"
• Add setAttribute, removeAttribute, and clearAttributes to abstract core.
• Use the centralized transform method in the abstract core.
• Refactor mouse direction flags to include both axes.

Refactor Dragged instance and migrate playground to TS (#406)

• Refactor dragged to use AxesCoordinates
• Migrate dragged playground to TS

Refactor attributes and dataset in the Core (#407)

Use TS with Cypress (#384)

Extract event emitters as functions outside the main class (#390)

Throttle dragged insertion when outside the parent container (#391)

• Enhance CI jobs: Canclining running CI when updating the PR and adding types and path-ignore.
• Use extract element visibility to a new function updateElementVisibility.
• Add a draft new function detectNearestContainer that triggered when dragged is out of the parent container and check for possible new parents.
• Expose siblingsContainer and setOfTransformedIdsin Draggable.
• Extract isIDEligible and isIDEligible2Move as utils function outside the class.
• Fix naming in cleanupDisconnectedElements and isAttachListener
• Add animatedDraggedInsertionFrame to throttle dragged insertion into the parent container and refactor the tests adding more delay to cover the new throttle.

Refactor comparison to the core instance and extend the mechanism to include both axes (#395)

• Add a new playground for dealing with horizontal lists.
• Refactor position comparison to core-instance for more usability. Add a new method isPositionedLeft to check horizontal position.
• Add new utils to store getBranchHeadAndTail and avoid bugs caused by not checking the availability if there's only one element in the branch.
• Extract distance calculations methods to a new class. So that calculating x and y can be done separately from the main droppable class.

Refactor measuring distance between elements to include both axes (#396)

Create a new package for shared utilities (#397)

• Use generic type for axes points to extend the class usages to hold points history and any associated variables.
• Create new shared utils for shared classes and functions across the project.
• Refactor branch name to main

Redesign the Store to be fully compatible with core-instance (#398)

Fix Abstract Core interface (#402)

Starting from v3.0.0 DFlex is MIT License.

Add 5 different states for the layout: "pending" | "ready" | "dragging" | "dragEnd" | "dragCancel"

• pending: when DnD is initiated but not activated yet.
• ready: When clicking over the registered element. The element is ready but not being dragged.
• dragging and dragEnd as expected.
• dragCancel When releasing the drag without settling in the new position.

Add 4 categories of events:

• Drag events Events related to the dragged element. This event is fired with onDragOutContainer and onDragOutThreshold event listeners.
• Interactivity events Events related to elements that interacted with the dragged. This event is fired with onDragOver and onDragLeave event listeners.
• Sibling events Events related to the active list/branch: siblings. This event is fired with onLiftUpSiblings and onMoveDownSiblings event listeners.
• LayoutStateEvent Events related to the layout state. It's fired with onStateChange

Some internal patches:

• Remove unnecessary instances from the Scroll.
• Refactor auto-scroll to a manager method.
• Refactor method naming and fix typo in register input

PRs: (#343) and (#344). Docs

Handle invalid elements in the registry & elements accumulation to the same branch (#338)

• Validate elements before creating draggable.
• Throw an error when elements found in the branch are not connected when not in production.
• Add cleanupUnconnectedElements for production usage.
• Isolate indicators from adding a new element process. Open the room for more flexible add/remove when it comes to modifying existing branches. Done by adding accumulateIndicators.
• Refactor native store to pass depth to the Core. (need depth when modifying branches).
• Add new property parentID: string to match elements from the same branch for input in the registry.

Fix creating parent node when reordering branches internally (#339)

Add scroll dataset to the scroll container setting dynamic visibility as its value (#340)

• Refactor initialize to attach (no need for separate method).
• Add another reason for throwing an error when there's no parent-id.
• Add scroll dataset when the scroll is the document. Previously, when not the document. Currently, add the dataset to the first div inside the body document. When to add the dataset? Only if the algorithm detects an overflow. (It's also so much easier for the test and debugging),

Enhance cleaning up branches when elements are not connected (#341)

• Detach elements ref when cleaning the branch.
• Clear old reference when calling attach. There's a possibility of throwing an error while validating the new one without clearing the old one. Avoid any potential memory leaks.
• Add a warning if not being able to add scroll dataset.
• Refactor cleanupUnconnectedElements so we can dynamically clean connected/unconnected dom elements.

Add lists unregistered and unsorted for further test cases (#342)

Add clear methods to DOM-Gen (#330)

• Clear Scroll instance from Store with clearBranchesScroll to prevent a memory leak.
• Upgrade to Typescript 4.4.
• Remove unnecessary isElmSingleton from DOM Gen.
• Add clear methods: removeElementIDFromBranch, destroyBranch, clearBranchesAndIndicator to DOM Gen.
• Remove setElmBranch as it has not a clear role otherwise a direct assignment.
• Remove element from the branch when unregister it from the store. This fixes a bug that causes branches to preserve elements even f they are deleted from the registry.
• Add strict type to scrollEventCallback.
• Add Unit Test to the new methods.

Fix a bug of keeping scroll instance after clearing the entire elements branch (#331)

• Define new errors when id is not registered or can't find siblings key (SK).
• Add scroll and visibility initializing inside the Store instead of Draggable.
• Reset the branch instances inside the Store when the branch is empty.

Avoid a bug where there's an overflow in CSS but the container doesn't actually have a scroll (#332)

Fix draggable store validation and types (#307)

Minimize E2E test time & remove all async undo (#313)

• Fix an error message that appears when insert dragged inside the list.
• Expand the test to include index and attribute.
• Minimize test time.
• Remove async undo.

Add animated transformation to core (#314)

Fix a bug causes wrong calculation for different heights (#316)

Add three levels of restrictions (#318)

Define three levels of restrictions. Each level is relevant to a different position. Add more flexibility, so each element can define its restricted area separately from another sibling.

Available restrictions:

1. Restricted area related to the parent container.
2. Restricted area related to the viewport.
3. Restricted area related to the position itself.

Changes made to the playground:

1. Redefine the old restricted to all - as all elements inside the list have the same restrictions rules.
2. Add a new routing that reflects the new changes including more showcase.
3. Add a new demo that shows how flexible each element can be for the same restrictions rule: parent.
4. Add tests that cover all new cases related to the parent restrictions.
5. Refactor the old test related to all elements restricted to the parent.

Changes related to the API: Define new restrictions with types:

interface Restrictions {
  self: {
    allowLeavingFromTop: boolean;
    allowLeavingFromBottom: boolean;
    allowLeavingFromLeft: boolean;
    allowLeavingFromRight: boolean;
  };
  container: {
    allowLeavingFromTop: boolean;
    allowLeavingFromBottom: boolean;
    allowLeavingFromLeft: boolean;
    allowLeavingFromRight: boolean;
  };
}

And the default values are:

const restrictions= {
    self: {
      allowLeavingFromTop: true,
      allowLeavingFromBottom: true,
      allowLeavingFromLeft: true,
      allowLeavingFromRight: true,
    },
    container: {
      allowLeavingFromTop: true,
      allowLeavingFromBottom: true,
      allowLeavingFromLeft: true,
      allowLeavingFromRight: true,
    },
  },

Of course, that's done with testing the new options and refactor Jest cases.

Following that, the old API is changed to simplify the axes filter with just axesYFilter and axesXFilter.

Fix a bug that causes wrong calculation for different heights (#316)

Fix a bug in options and self-restriction area (#319)

• Fix a bug in extraction options and update the test.
• Fix a bug containing elements inside the self-restriction area.
• Add horizontal/vertical test to the self-restriction area.

Add test to the viewport restriction (#320)

Fix a bug in pausing invisible elements (#321)

Refactor scrollElement (#323)

• Add isViewportRestricted flag to the filters
• Add initialSpeed to the options instead of speed.
• Use incremental speed for scrolling.
• Add local instance to calculate scroll distance
• Add scrollHeight to the store.
• Refactor store method name (init makes more sense)

Add Threshold class to use shared functionalities between Scroll/Draggable (#324)

• Add Threshold class to use shared functionalities between Scroll/Draggable.
• Merge Base class with Draggable class.
• Move Tracker to the utils.
• Refactor type names use more universal naming.
• Refactor names of generated keys in DOM-Gen which created so much confusion in the past. Now, it's all capitalized.
• Refactor tests & snaps.

Refactor helper classes (#325)

• Add helper classes to the Plugin folder instead of utils which now includes only functions.
• Refactor Scroll to a separate class (separation of concerns).

Add scroll instance to each sibling list (#326)

• Refactor register to soft register. Remove the old burden, reduce the initial scripting time. All elements now are paused by default and can be not initialized if there's no ref passed. The earlier version threw an error then it was optional.
• Change Scroll workflow. Every group of siblings has its own scroll instance. Allowing to change lists with scroll container.

Enhance overflow indicators (#327)

• Remove siblingsOverflow uses local instance from a Scroll instead.
• Add threshold to active visibility controller. For small lists, activate all siblings if don't meet the threshold (isAllVisible: true).
• Don't add a scroll listener if there's no overflow but keep the resize listener.
• Refactor restriction to use scroll container instead of viewport.
• Add changeToFixedStyleProps to Draggable with a method in the abstract that accepts a new style as an array to change the dragged style.

Fix self-contained restrictions bug caused by calculating the wrong boundaries (#328)

• Refactor loading and initiating siblings branch fixing a minor bug prevented initializing a solo element with no siblings.
• Fix isElementVisibleViewportY/X depending on the Scroll container adding new methods to know the container boundaries.
• Fix minor bug in calling back function triggered by the scroll event.
• Fix minor bug in override options.

Docs

Add essential Test for Firefox (#304)

Add new core API with isInitialized, isPaused and isVisible (#303)

• Add isPaused and isInitialized to the Core. This is going to add more flexibility to the API. When to resume and when to initialize. The current situation is core has multi-levels isInitialized, isPaused and isVisible.
• Validate element reference from inside the Core. This step enables a more flexible attach/detach and it's more reliable to pass id without HTML reference. It's also consistent with the three new levels.
• Element Reference is nullish when not passed to not hurt the runtime. Adding a reference is unavoidable.
• Checking visibility depending on so-called parent flags.
• To make it more reliable and less buggy, there's a resume function that checks if the instance is initialized or not.
• Changing visibility is done inside the Core. Make it easier to debug any issue in the future.
• Add strong types to Core input. Refactor old names to more clear names.
• Check listeners' values and then update. Avoid unnecessary function trigger.
• Fix a bug when updating visibility in the store.
• Remove incoming reference validation from the store implementation in the DnD. (Legacy code).
• Suspend id duplication validation for now. Need to be investigated more in the future.

Remove siblings list reference from DnD and Draggable (#301)

Connect the store immediately to the draggable instance in DnD (#302)

Remove dragged style reference & add style props as static (#300)

• Remove draggedStyleRef & Add draggedStyleProps as static.
• Refactor Jest for draggable test.

Add extended list test (#299)

• Check visible elements transformation.
• Check dataset order for all elements.
• Check changing visibility, positions, and continuity.

Reduce memory footprint (#297)

• Accept element reference, id, or both when registration adding more flexibility to the Store registry.
• Add an optional initializing flag to the abstract core. In this case, not all elements will be calculated even with draggable only.
• Add the ability to pause element registration for DnD. Along with visibility. This way increases the isolation for long lists. Not just on visibility level but also in the core when it comes to dealing with the class instances.
• Check for initializing before calculations. In this way dealing with 1k of rows is similar to 10 rows only.
• Refactor the related mechanisms in Draggable and Droppable.
• Remove unnecessary methods like deleteElm and getElmById. Reduce the maintainability burden as API grows.
• Update unit test to suit the new cases.

Add unregister and destroy to Store (#296)

• Add a dragged attribute to draggable.
• Add index dataset to dragged while dragging.
• Add unregister method to the store to remove one element.
• Add destroy method to clear the registry.

Fix continuity & id validation bug (#295)