Sha256: a527bff0beec1e2d75e9ec113e4eff52b838dea6cea8baaabc811744c3d07d5e

Contents?: true

Size: 918 Bytes

Versions: 62

Compression:

Stored size: 918 Bytes

Contents

import React, { useState } from "react";
import { DraggableProvider, List, ListItem } from "../../";

// Initial items to be dragged
const data = [
  {
    id: "31",
    text: "Philadelphia",
  },
  {
    id: "32",
    text: "New Jersey",
  },
  {
    id: "33",
    text: "Maryland",
  },
  {
    id: "34",
    text: "Connecticut",
  },
];

const DraggableWithList = (props) => {
  const [initialState, setInitialState] = useState(data);


  return (
    <>
    <DraggableProvider initialItems={data}
        onReorder={(items) => setInitialState(items)}
    >
        <List enableDrag
            {...props}
        >
            {initialState.map(({ id, text }) => (
                <ListItem dragId={id}
                    key={id}
                >
                    {text}
                </ListItem>
            ))}
        </List>
    </DraggableProvider>
    </>

  );
};

export default DraggableWithList;

Version data entries

62 entries across 62 versions & 2 rubygems

Version Path
playbook_ui_docs-13.34.1.pre.alpha.play1407statvaluekitinconsistencies3388 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui-13.34.1.pre.alpha.play1407statvaluekitinconsistencies3388 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui_docs-13.34.1.pre.alpha.PLAY14703378 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui-13.34.1.pre.alpha.PLAY14703378 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui_docs-13.34.1 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui-13.34.1 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui_docs-13.34.0.pre.alpha.PBNTR358responsiveadvancedtablereact3370 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui-13.34.0.pre.alpha.PBNTR358responsiveadvancedtablereact3370 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui_docs-13.34.0.pre.alpha.PBNTR358responsiveadvancedtablereact3369 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui-13.34.0.pre.alpha.PBNTR358responsiveadvancedtablereact3369 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui-13.34.0.pre.alpha.PBNTR358responsiveadvancedtablereact3368 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui_docs-13.34.0.pre.alpha.PBNTR358responsiveadvancedtablereact3366 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui-13.34.0.pre.alpha.PBNTR358responsiveadvancedtablereact3366 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui-13.34.0 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui_docs-13.33.1.pre.alpha.play1407statvaluekitinconsistencies3352 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui-13.33.1.pre.alpha.play1407statvaluekitinconsistencies3352 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui_docs-13.33.1.pre.alpha.PLAY14063320 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui-13.33.1.pre.alpha.PLAY14063320 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui-13.33.1 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
playbook_ui_docs-13.33.0.pre.alpha.PBNTR405dropdownformfixesrails3311 app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx