Beautiful, accessible drag and drop for lists with React.js
https://github.com/atlassian/react-beautiful-dndTags | react drag-and-drop drag dnd react.js natural beautiful |
Implementation | Javascript |
License | Apache Apache-2.0 |
Platform | OS-Independent |
A fast and lightweight drag&drop, sortable library for React with many configuration options covering many d&d scenarios. It uses css transitions for animations so it's hardware accelerated whenever possible. This library consists wrapper React components over smooth-dnd library.
react drag-and-drop draggable dragndrop sortable reactjs drag drop drag-drop drag&drop dndDrag and Drop for React. Big thanks to BrowserStack for letting the maintainers use their service to debug browser issues.
react drag-and-drop reactjs file drag drop html5 draggable droppable dnd react-component hocSince native Drag-n-Drop is not currently supported in touch devices. A custom DragPreview is required. Check out the example for a sample implementation.We might try to build it directly in the Backend itself in the future to compensate for this limitation.
react drag drop touch react-dndVue components for modifying lists with the HTML5 drag & drop API. Touch devices are not supported, because they do not implement the HTML5 drag & drop standard. However, you can use a shim to make it work on touch devices as well.
vue-dnd dnd drag-and-drop vue vue-componentsIn case you didn't know, the HTML5 drag and drop API is a total disaster! This is an attempt to make the API usable by mere mortals.This module works in the browser with browserify.
html5 drag-drop drag-and-drop browserify browser drag drop dnd drag-&-drop frontendMakes your elements draggable in Vue. group is unique key of dragable list.
vue vue-dragging vue-drag vue-dnd draggable drag drop html5 droppable drag-and-drop dndVue directives that allow you to build sortable lists with the native HTML5 drag & drop API. Supports nested lists for building trees and other fancy structures. In general, in 2.0 directives have a greatly reduced scope of responsibility: they are now only used for applying low-level direct DOM manipulations. In most cases, you should prefer using Components as the main code-reuse abstraction.
vue html5-drag drag-and-drop-list dndAngular 2 Drag-and-Drop without dependencies. Follow me to be notified about new releases.
angular angular2 angular4 drag-and-drop drag drop dropzone angular-2Drag drop capable wrapper of ListView for React Native. Allows for dragging and dropping of rows with automatic scrolling while dragging. See example.
react-component ios android react-native drag drop touch listview list sortreact-planner is a React component which can be used to draw model buildings. Drag & drop from a catalog of customizable and ready-to-use objects, you can start from 2D wireframes and land on 3D models. As a developer you can provide your users with new objects by adding them to the catalog.
component interface react react-component reactjs ui webgl threejs svg floorplans draw floorplanner plan 3d home-design interior-design react.jsschema-plugin-flow, abbreviated as Sifo ([sɪfɔ]),is a highly extensible JavaScript library. This library allows developers to extend business logic and page layout without touching source code, when the source code is written in Sifo.
react plugin schema vue drag-and-drop form extensible ant-design js-framework low-code vue-drag-and-drop react-drag-and-drop ant-design-vue sifo schema-render extend-plugins schema-plugin-flowSortable is a minimalist JavaScript library for reorderable drag-and-drop lists. You can use any element for the list and its elements, not just ul/li. Here is an example with divs.
drag sortable reordering sort drag-and-drop drag-drop ui draggable droppable reorder meteor angular ng-sortable react mixinHigher-order component for creating sortable lists with minimalistic implementation and without polyfills. Using just React.js and HTML5 DragEvent interface. Mainly tested in latest stable Webkit, Firefox and IE.
react sortable sorting drag drop dragndrop draganddropDrag and drop module for Angular JS with support for touch devices. demo. ng-drag-start and ng-drag-move is also available. Add to the ng-drop element. ng-drag-stop can be used when you want to react to the user dragging an item and it wasn't dropped into the target container.
An absolute layout grid with animations, filtering, zooming, and drag and drop support. Use your own component as the grid item. See the Demo. The idea behind AbsoluteGrid is high performance. This is achieved by using Translate3d to position each item in the layout. Items are never removed from the DOM, instead they are hidden. For best performance you should avoid re-arranging or removing items which you pass into AbsoluteGrid, instead you can use the filtered and sort properties to hide or sort an item. Those properties are customizable using the keyProp and filterProp properties. In addition, all data passed must be immutable so that we don't waste any renders.
react reactjs reactjs-components react-component react-componentsReact-Grid-Layout is a grid layout system much like Packery or Gridster, for React. Unlike those systems, it is responsive and supports breakpoints. Breakpoint layouts can be provided by the user or autogenerated.
react grid drag-and-drop resize es2015 drag draggable resizable fluid responsiveFullCalendar is a full-sized drag & drop event calendar. It generates real React virtual DOM nodes so you can leverage Fiber, React's highly optimized rendering engine. It has support for React, Vue, Angular and Javascript.
calendar event full-sized jquery-plugin javascript-library google-calendar ui-library ui-components reactlightGallery is a customizable, modular, responsive, lightbox gallery plugin. No dependencies. Available for React.js, Angular, Vue.js, and typescript.
react youtube vimeo angular video vue thumbnails image-gallery css-animations lightbox html5-video lightbox-gallery-plugin video-gallery react-gallery angular-gallery lit-element vue-galleryReact-tags is a simple tagging component ready to drop in your React projects. The component is inspired by GMail's To field in the compose window. Because I was looking for an excuse to build a standalone component and publish it in the wild? To be honest, I needed a tagging component that provided the above features for my React-Surveyman project. Since I was unable to find one which met my requirements (and the fact that I generally enjoy re-inventing the wheel) this is what I came up with.
react react-tags autocomplete dragdrop drag-drop tags tag-input react-component autosuggestMantine is a fully featured React components library includes more than 120 customizable components and 40+ hooks to manage state and UI management. Mantine core library includes all essential components: inputs, buttons, modals, popovers, typography elements, layout management, etc.
react-components react-library react hooks typescript accessibility uikit a11y design-system
We have large collection of open source products. Follow the tags from
Tag Cloud >>
Open source products are scattered around the web. Please provide information
about the open source projects you own / you use.
Add Projects.