Skip to content

Commit 12279ff

Browse files
committed
docs(readme): reformats and removes TOC
1 parent 5d1d5c1 commit 12279ff

File tree

1 file changed

+17
-37
lines changed

1 file changed

+17
-37
lines changed

README.md

Lines changed: 17 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -6,31 +6,11 @@ We're now on version 2.0! A major API overhaul with typescript types.
66

77
Consider trying it out if you had any troubles earlier.
88

9-
## Things still to do.
10-
11-
We've released version 2.0 but there are still some things to do. We needed public feedback and a major release was the easiest way to get it.
12-
13-
- [x] Create examples from [SortableJS Examples](https://sortablejs.github.io/Sortable/)
14-
- [ ] Examples with code underneath.
15-
- [ ] List Props in readme.
16-
- [ ] Allow React to manage class names. Halfway there.
17-
- [x] Write docs for plugins
18-
- [ ] Create all tests for examples (for 'ron). Started
19-
- [ ] Test the following UI component libraries:
20-
- [x] Styled Components
21-
- [ ] AntD
22-
- [ ] MaterialUI
23-
- [ ] React Bootstrap
24-
- [ ] React Grommet
25-
- [ ] React Toolbox
26-
- [ ] Your suggestion? :)
27-
28-
299
## Table of Contents
10+
3011
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
3112
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
3213

33-
3414
- [Features](#features)
3515
- [SortableJS](#sortablejs)
3616
- [Component Specific](#component-specific)
@@ -111,15 +91,15 @@ interface ItemType {
11191
name: string;
11292
}
11393

114-
export const BasicFunction: FC = props => {
94+
export const BasicFunction: FC = (props) => {
11595
const [state, setState] = useState<ItemType[]>([
11696
{ id: 1, name: "shrek" },
117-
{ id: 2, name: "fiona" }
97+
{ id: 2, name: "fiona" },
11898
]);
11999

120100
return (
121101
<ReactSortable list={state} setList={setState}>
122-
{state.map(item => (
102+
{state.map((item) => (
123103
<div key={item.id}>{item.name}</div>
124104
))}
125105
</ReactSortable>
@@ -139,15 +119,15 @@ interface BasicClassState {
139119

140120
export class BasicClass extends Component<{}, BasicClassState> {
141121
state: BasicClassState = {
142-
list: [{ id: "1", name: "shrek" }]
122+
list: [{ id: "1", name: "shrek" }],
143123
};
144124
render() {
145125
return (
146126
<ReactSortable
147127
list={this.state.list}
148-
setList={newState => this.setState({ list: newState })}
128+
setList={(newState) => this.setState({ list: newState })}
149129
>
150-
{this.state.list.map(item => (
130+
{this.state.list.map((item) => (
151131
<div key={item.id}>{item.name}</div>
152132
))}
153133
</ReactSortable>
@@ -178,7 +158,7 @@ Sortable.mount(new MultiDrag(), new Swap());
178158
const App = () => {
179159
const [state, setState] = useState([
180160
{ id: 1, name: "shrek" },
181-
{ id: 2, name: "fiona" }
161+
{ id: 2, name: "fiona" },
182162
]);
183163

184164
return (
@@ -187,7 +167,7 @@ const App = () => {
187167
// OR
188168
swap // enables swap
189169
>
190-
{state.map(item => (
170+
{state.map((item) => (
191171
<div key={item.id}>{item.name}</div>
192172
))}
193173
</ReactSortable>
@@ -206,7 +186,7 @@ Sortable.create(element, {
206186
group: " groupName",
207187
animation: 200,
208188
delayOnTouchStart: true,
209-
delay: 2
189+
delay: 2,
210190
});
211191

212192
// --------------------------
@@ -219,7 +199,7 @@ import { ReactSortable } from "react-sortablejs";
219199
const App = () => {
220200
const [state, setState] = useState([
221201
{ id: 1, name: "shrek" },
222-
{ id: 2, name: "fiona" }
202+
{ id: 2, name: "fiona" },
223203
]);
224204

225205
return (
@@ -230,7 +210,7 @@ const App = () => {
230210
delayOnTouchStart={true}
231211
delay={2}
232212
>
233-
{state.map(item => (
213+
{state.map((item) => (
234214
<div key={item.id}>{item.name}</div>
235215
))}
236216
</ReactSortable>
@@ -290,12 +270,12 @@ Just add the string and ReactSortable will use a `li` instead of a `div`.
290270
import React, { FC, useState } from "react";
291271
import { ReactSortable } from "react-sortablejs";
292272

293-
export const BasicFunction: FC = props => {
273+
export const BasicFunction: FC = (props) => {
294274
const [state, setState] = useState([{ id: "1", name: "shrek" }]);
295275

296276
return (
297277
<ReactSortable tag="ul" list={state} setList={setState}>
298-
{state.map(item => (
278+
{state.map((item) => (
299279
<li key={item.id}>{item.name}</li>
300280
))}
301281
</ReactSortable>
@@ -322,15 +302,15 @@ const CustomComponent = forwardRef<HTMLDivElement, any>((props, ref) => {
322302
return <div ref={ref}>{props.children}</div>;
323303
});
324304

325-
export const BasicFunction: FC = props => {
305+
export const BasicFunction: FC = (props) => {
326306
const [state, setState] = useState([
327307
{ id: 1, name: "shrek" },
328-
{ id: 2, name: "fiona" }
308+
{ id: 2, name: "fiona" },
329309
]);
330310

331311
return (
332312
<ReactSortable tag={CustomComponent} list={state} setList={setState}>
333-
{state.map(item => (
313+
{state.map((item) => (
334314
<div key={item.id}>{item.name}</div>
335315
))}
336316
</ReactSortable>

0 commit comments

Comments
 (0)