@dflex/store

DOM store allows you to traverse through the DOM tree with element-id

Usage no npm install needed!

<script type="module">
  import dflexStore from 'https://cdn.skypack.dev/@dflex/store';
</script>

README

Dflex logo

DOM store allows you to traverse through the DOM tree with element-id

Dflex build status number of opened pull requests number of opened issues Dflex welcomes pull request

@dflex/store

DFlex store works on connecting all registered elements and organizes the relations between them using the DOM relations generator algorithm. Allowing each element to be reached recursively using its id.

DFlex Features ✅

  • Dynamic architecture.
  • Traverse DOM without calling browser API.
  • Transform elements instead of reordering the DOM tree.
  • Animated movement from point-x to point-y.
  • Prevent drag and drop layout shift.
  • Isolated from data flow.
  • Headless as it is just functions that do manipulation.
  • Event driven API.
  • Targeting each DOM node individually.
  • Extensible using JSON tree instead of flat recursion.

Installation 📦

npm install @dflex/store

Documentation 📖

Visit DFlex site for docs https://www.dflex.dev/ and live demo.

Related Content 🏋️‍

Drag & Drop

A Drag-and-Drop package for all JavaScript frameworks implementing an enhanced transformation mechanism to manipulate DOM elements. You can achieve a drag and drop with three steps only with mouse/touch event.

Draggable

DFlex Draggable is the simplest solution to create JavaScript draggable only elements.

Utils/DOM Generator

DOM relations generator algorithm. Generate relations between DOM elements based on element depth without a browser.