Skip to content

Commit b52b5e2

Browse files
author
Marek Sierociński
committed
README.md - Documentation - GridItem
1 parent 4358d8e commit b52b5e2

File tree

1 file changed

+150
-1
lines changed

1 file changed

+150
-1
lines changed

README.md

Lines changed: 150 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -129,7 +129,156 @@ or include the script in your html (download from [releases](https://github.com/
129129
<!-- TODO DOCUMENTAR PROPS DE GridLayout E GridItem -->
130130

131131

132-
### Events
132+
### Documentation
133+
134+
#### Properties
135+
136+
##### GridItem
137+
138+
* **i**
139+
140+
* type: `String`
141+
* required: `true`
142+
143+
This is the unique identifier of the item.
144+
145+
* **x**
146+
147+
* type: `Number`
148+
* required: `true`
149+
150+
Says what is a initial horizontal position of the item (in which column it should be placed).
151+
152+
The value must be a _whole number_.
153+
154+
* **y**
155+
156+
* type: `Number`
157+
* required: `true`
158+
159+
Says what is a initial vertical position of the item (in which row it should be placed).
160+
161+
The value must be a _whole number_.
162+
163+
* **w**
164+
165+
* type: `Number`
166+
* required: `true`
167+
168+
Says what is a initial width of the item.
169+
170+
The value is a number that is multiplied by `colWidth`.
171+
172+
* **h**
173+
174+
* type: `Number`
175+
* required: `true`
176+
177+
Says what is a initial height of the item.
178+
179+
The value is a number that is multiplied by `rowHeight`.
180+
181+
* **minW**
182+
183+
* type: `Number`
184+
* required: `false`
185+
* default: `1`
186+
187+
Says what is a minimal width of the item. If `w` will be smaller then `minW` then `w` will be set to `minW`.
188+
189+
The value is a number that is multiplied by `colWidth`.
190+
191+
* **minH**
192+
193+
* type: `Number`
194+
* required: `false`
195+
* default: `1`
196+
197+
Says what is a minimal hieght of the item. If `h` will be smaller then `minH` then `h` will be set to `minH`.
198+
199+
The value is a number that is multiplied by `rowHeight`.
200+
201+
* **maxW**
202+
203+
* type: `Number`
204+
* required: `false`
205+
* default: `Infinity`
206+
207+
Says what is a maximal width of the item. If `w` will be bigger then `maxW` then `w` will be set to `maxW`.
208+
209+
The value is a number that is multiplied by `colWidth`.
210+
211+
* **maxH**
212+
213+
* type: `Number`
214+
* required: `false`
215+
* default: `Infinity`
216+
217+
Says what is a maximal height of the item. If `h` will be bigger then `maxH` then `h` will be set to `maxH`.
218+
219+
The value is a number that is multiplied by `rowHeight`
220+
221+
* **isDraggable**
222+
223+
* type: `Boolean`
224+
* required: `false`
225+
* default: `null`
226+
227+
Says if item is draggable.
228+
229+
If default value is `null` then it's inherited from parent.
230+
231+
* **isResizable**
232+
233+
* type: `Boolean`
234+
* required: `false`
235+
* default: `null`
236+
237+
Says if item is resizable.
238+
239+
If default value is `null` then it's inherited from parent.
240+
241+
* **dragIgnoreFrom**
242+
243+
* type: `String`
244+
* required: `false`
245+
* default: `'a, button'`
246+
247+
Says which elements of the item shouldn't trigger drag event of the item.
248+
249+
The value is `css-like` selector string.
250+
251+
For more info please refer to `ignoreFrom` in [interact.js docs](http://interactjs.io/docs/#ignorable-selectors).
252+
253+
* **dragAllowFrom**
254+
255+
* type: `String`
256+
* required: `false`
257+
* default: `null`
258+
259+
Says which elements of the item should trigger drag event of the item.
260+
261+
The value is `css-like` selector string.
262+
263+
If `null` then one can drag by any (excluding `dragIgnoreFrom`) element of the item.
264+
265+
For more info please refer to `allowFrom` in [interact.js docs](http://interactjs.io/docs/#ignorable-selectors).
266+
267+
* **resizeIgnoreFrom**
268+
269+
* type: `String`
270+
* required: `false`
271+
* default: `'a, button'`
272+
273+
Says which elements of the item shouldn't trigger resize event of the item.
274+
275+
The value is `css-like` selector string.
276+
277+
For more info please refer to `ignoreFrom` in [interact.js docs](http://interactjs.io/docs/#ignorable-selectors).
278+
279+
280+
281+
#### Events
133282

134283
Move and resize event listeners can be added to each grid-item, so that the parent Vue can be notified when a grid element is being moved or resized.
135284
Moved and resized event listeners can be added, if the only notification needed is when an item is finished moving or resizing.

0 commit comments

Comments
 (0)