jsuites 6.4.2 → 6.4.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -21
- package/README.md +119 -119
- package/dist/jsuites.css +3424 -3424
- package/dist/jsuites.d.ts +10 -10
- package/dist/jsuites.js +22475 -22450
- package/dist/jsuites.webcomponents.js +501 -501
- package/dist/types/animation.d.ts +23 -23
- package/dist/types/calendar.d.ts +87 -87
- package/dist/types/color.d.ts +50 -50
- package/dist/types/contextmenu.d.ts +43 -43
- package/dist/types/dropdown.d.ts +177 -177
- package/dist/types/editor.d.ts +96 -96
- package/dist/types/floating.d.ts +23 -23
- package/dist/types/form.d.ts +57 -57
- package/dist/types/index.d.ts +59 -59
- package/dist/types/mask.d.ts +50 -50
- package/dist/types/modal.d.ts +35 -35
- package/dist/types/notification.d.ts +27 -27
- package/dist/types/picker.d.ts +45 -45
- package/dist/types/rating.d.ts +19 -19
- package/dist/types/search.d.ts +23 -23
- package/dist/types/slider.d.ts +31 -31
- package/dist/types/tabs.d.ts +79 -79
- package/dist/types/tags.d.ts +105 -105
- package/dist/types/toolbar.d.ts +70 -70
- package/dist/types/upload.d.ts +45 -45
- package/dist/types/validations.d.ts +39 -39
- package/package.json +4 -4
- package/react/calendar/index.d.ts +105 -105
- package/react/calendar/index.js +28 -28
- package/react/color/index.d.ts +84 -84
- package/react/color/index.js +28 -28
- package/react/contextmenu/index.d.ts +61 -61
- package/react/contextmenu/index.js +24 -24
- package/react/dropdown/index.d.ts +184 -184
- package/react/dropdown/index.js +25 -25
- package/react/editor/index.d.ts +114 -114
- package/react/editor/index.js +31 -31
- package/react/index.js +26 -26
- package/react/modal/index.d.ts +53 -53
- package/react/modal/index.js +30 -30
- package/react/picker/index.d.ts +64 -64
- package/react/picker/index.js +28 -28
- package/react/rating/index.d.ts +37 -37
- package/react/rating/index.js +28 -28
- package/react/slider/index.d.ts +49 -49
- package/react/slider/index.js +30 -30
- package/react/tabs/index.d.ts +97 -97
- package/react/tabs/index.js +29 -29
- package/react/tags/index.d.ts +121 -121
- package/react/tags/index.js +24 -24
- package/react/toolbar/index.d.ts +88 -88
- package/react/toolbar/index.js +24 -24
- package/vue/calendar/index.d.ts +105 -105
- package/vue/calendar/index.js +36 -36
- package/vue/color/index.d.ts +84 -84
- package/vue/color/index.js +36 -36
- package/vue/contextmenu/index.d.ts +61 -61
- package/vue/contextmenu/index.js +21 -21
- package/vue/dropdown/index.d.ts +184 -184
- package/vue/dropdown/index.js +25 -25
- package/vue/editor/index.d.ts +114 -114
- package/vue/editor/index.js +40 -40
- package/vue/index.js +40 -40
- package/vue/modal/index.d.ts +53 -53
- package/vue/modal/index.js +41 -41
- package/vue/picker/index.d.ts +64 -64
- package/vue/picker/index.js +36 -36
- package/vue/rating/index.d.ts +37 -37
- package/vue/rating/index.js +36 -36
- package/vue/slider/index.d.ts +49 -49
- package/vue/slider/index.js +33 -33
- package/vue/tabs/index.d.ts +97 -97
- package/vue/tabs/index.js +28 -28
- package/vue/tags/index.d.ts +121 -121
- package/vue/tags/index.js +21 -21
- package/vue/toolbar/index.d.ts +88 -88
- package/vue/toolbar/index.js +21 -21
package/vue/tabs/index.d.ts
CHANGED
|
@@ -1,97 +1,97 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Official Type definitions for LemonadeJS plugins
|
|
3
|
-
* https://lemonadejs.net
|
|
4
|
-
* Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
|
-
declare function Component(el: HTMLElement, options?: Component.Options): Component.Instance;
|
|
8
|
-
|
|
9
|
-
interface Item {
|
|
10
|
-
/** DOMElement for the header title */
|
|
11
|
-
titleElement?: HTMLElement;
|
|
12
|
-
/** DOMElement for the header content */
|
|
13
|
-
contentElement?: HTMLElement;
|
|
14
|
-
/** Material icon keyword */
|
|
15
|
-
icon?: string;
|
|
16
|
-
/** Tab header */
|
|
17
|
-
title?: string;
|
|
18
|
-
/** Width */
|
|
19
|
-
width?: number;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
declare namespace Component {
|
|
23
|
-
interface Options {
|
|
24
|
-
/** Tabs definition */
|
|
25
|
-
data: Item[],
|
|
26
|
-
/** Position */
|
|
27
|
-
position: 'top' | 'bottom' | null,
|
|
28
|
-
/** Show the add new tab button. Default: false */
|
|
29
|
-
allowCreate: boolean,
|
|
30
|
-
/** Allow drag and drop to change the tabs position. Default: false */
|
|
31
|
-
allowChangePosition: boolean,
|
|
32
|
-
/** On click event */
|
|
33
|
-
onclick: (el: HTMLElement, instance: Tabs, index: number, header: HTMLElement, content: HTMLElement) => void;
|
|
34
|
-
/** On load event */
|
|
35
|
-
onload: (el: HTMLElement, instance: Tabs) => void,
|
|
36
|
-
/** On change event */
|
|
37
|
-
onchange: (el: HTMLElement, instance: Tabs, index: number, header: HTMLElement, content: HTMLElement) => void;
|
|
38
|
-
/** On create new tab event */
|
|
39
|
-
oncreate: (el: HTMLElement, div: HTMLElement) => void;
|
|
40
|
-
/** On delete tab event */
|
|
41
|
-
ondelete: (el: HTMLElement, index: number) => void;
|
|
42
|
-
/**
|
|
43
|
-
* On before create new tab event
|
|
44
|
-
* @return {string} Header title
|
|
45
|
-
*/
|
|
46
|
-
onbeforecreate: (el: HTMLElement) => string;
|
|
47
|
-
/** On change tab position event */
|
|
48
|
-
onchangeposition: (headers: HTMLElement[], from: number, to: number) => void;
|
|
49
|
-
/** Enable animation. Default: false */
|
|
50
|
-
animation: boolean,
|
|
51
|
-
/** Hide headers. Default: false */
|
|
52
|
-
hideHeaders: boolean,
|
|
53
|
-
/** Content padding */
|
|
54
|
-
padding: number,
|
|
55
|
-
/** Design */
|
|
56
|
-
palette?: 'modern' | null,
|
|
57
|
-
/** Max container width */
|
|
58
|
-
maxWidth: number,
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
interface Instance {
|
|
62
|
-
/** Set the border to a header */
|
|
63
|
-
setBorder: (index: number) => void;
|
|
64
|
-
/** Open a tab by number */
|
|
65
|
-
open: (index: number) => void;
|
|
66
|
-
/** Open a tab by its header DOM element */
|
|
67
|
-
selectIndex: (element: HTMLElement) => void;
|
|
68
|
-
/** Rename a header title */
|
|
69
|
-
rename: (index: number, title: string) => void;
|
|
70
|
-
/** Create a new tab */
|
|
71
|
-
create: (title: string, url: string) => void;
|
|
72
|
-
/** Remove a tab */
|
|
73
|
-
remove: (index: number) => void;
|
|
74
|
-
/** Automatic name the next tab number */
|
|
75
|
-
nextNumber: () => void;
|
|
76
|
-
/** Delete tab element */
|
|
77
|
-
deleteElement: () => void;
|
|
78
|
-
/** Append tab element */
|
|
79
|
-
appendElement: (title?: string, callback?: Function, openTab?: boolean) => void;
|
|
80
|
-
/** Get the active tab index */
|
|
81
|
-
getActive: () => number;
|
|
82
|
-
/** Update the content of a tab */
|
|
83
|
-
updateContent: (index: number, newContent: string) => void;
|
|
84
|
-
/** Update tab position */
|
|
85
|
-
updatePosition: (from: number, to: number, ignoreEvents?: boolean) => void;
|
|
86
|
-
/** Update DOM position */
|
|
87
|
-
move: (from: number, to: number, ignoreEvents?: boolean, openTab?: boolean) => void;
|
|
88
|
-
}
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
interface Tabs {
|
|
92
|
-
(): any
|
|
93
|
-
[key: string]: any
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
declare function Tabs<Tabs>(props: Component.Options): any;
|
|
97
|
-
export default Tabs;
|
|
1
|
+
/**
|
|
2
|
+
* Official Type definitions for LemonadeJS plugins
|
|
3
|
+
* https://lemonadejs.net
|
|
4
|
+
* Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
declare function Component(el: HTMLElement, options?: Component.Options): Component.Instance;
|
|
8
|
+
|
|
9
|
+
interface Item {
|
|
10
|
+
/** DOMElement for the header title */
|
|
11
|
+
titleElement?: HTMLElement;
|
|
12
|
+
/** DOMElement for the header content */
|
|
13
|
+
contentElement?: HTMLElement;
|
|
14
|
+
/** Material icon keyword */
|
|
15
|
+
icon?: string;
|
|
16
|
+
/** Tab header */
|
|
17
|
+
title?: string;
|
|
18
|
+
/** Width */
|
|
19
|
+
width?: number;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
declare namespace Component {
|
|
23
|
+
interface Options {
|
|
24
|
+
/** Tabs definition */
|
|
25
|
+
data: Item[],
|
|
26
|
+
/** Position */
|
|
27
|
+
position: 'top' | 'bottom' | null,
|
|
28
|
+
/** Show the add new tab button. Default: false */
|
|
29
|
+
allowCreate: boolean,
|
|
30
|
+
/** Allow drag and drop to change the tabs position. Default: false */
|
|
31
|
+
allowChangePosition: boolean,
|
|
32
|
+
/** On click event */
|
|
33
|
+
onclick: (el: HTMLElement, instance: Tabs, index: number, header: HTMLElement, content: HTMLElement) => void;
|
|
34
|
+
/** On load event */
|
|
35
|
+
onload: (el: HTMLElement, instance: Tabs) => void,
|
|
36
|
+
/** On change event */
|
|
37
|
+
onchange: (el: HTMLElement, instance: Tabs, index: number, header: HTMLElement, content: HTMLElement) => void;
|
|
38
|
+
/** On create new tab event */
|
|
39
|
+
oncreate: (el: HTMLElement, div: HTMLElement) => void;
|
|
40
|
+
/** On delete tab event */
|
|
41
|
+
ondelete: (el: HTMLElement, index: number) => void;
|
|
42
|
+
/**
|
|
43
|
+
* On before create new tab event
|
|
44
|
+
* @return {string} Header title
|
|
45
|
+
*/
|
|
46
|
+
onbeforecreate: (el: HTMLElement) => string;
|
|
47
|
+
/** On change tab position event */
|
|
48
|
+
onchangeposition: (headers: HTMLElement[], from: number, to: number) => void;
|
|
49
|
+
/** Enable animation. Default: false */
|
|
50
|
+
animation: boolean,
|
|
51
|
+
/** Hide headers. Default: false */
|
|
52
|
+
hideHeaders: boolean,
|
|
53
|
+
/** Content padding */
|
|
54
|
+
padding: number,
|
|
55
|
+
/** Design */
|
|
56
|
+
palette?: 'modern' | null,
|
|
57
|
+
/** Max container width */
|
|
58
|
+
maxWidth: number,
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
interface Instance {
|
|
62
|
+
/** Set the border to a header */
|
|
63
|
+
setBorder: (index: number) => void;
|
|
64
|
+
/** Open a tab by number */
|
|
65
|
+
open: (index: number) => void;
|
|
66
|
+
/** Open a tab by its header DOM element */
|
|
67
|
+
selectIndex: (element: HTMLElement) => void;
|
|
68
|
+
/** Rename a header title */
|
|
69
|
+
rename: (index: number, title: string) => void;
|
|
70
|
+
/** Create a new tab */
|
|
71
|
+
create: (title: string, url: string) => void;
|
|
72
|
+
/** Remove a tab */
|
|
73
|
+
remove: (index: number) => void;
|
|
74
|
+
/** Automatic name the next tab number */
|
|
75
|
+
nextNumber: () => void;
|
|
76
|
+
/** Delete tab element */
|
|
77
|
+
deleteElement: () => void;
|
|
78
|
+
/** Append tab element */
|
|
79
|
+
appendElement: (title?: string, callback?: Function, openTab?: boolean) => void;
|
|
80
|
+
/** Get the active tab index */
|
|
81
|
+
getActive: () => number;
|
|
82
|
+
/** Update the content of a tab */
|
|
83
|
+
updateContent: (index: number, newContent: string) => void;
|
|
84
|
+
/** Update tab position */
|
|
85
|
+
updatePosition: (from: number, to: number, ignoreEvents?: boolean) => void;
|
|
86
|
+
/** Update DOM position */
|
|
87
|
+
move: (from: number, to: number, ignoreEvents?: boolean, openTab?: boolean) => void;
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
interface Tabs {
|
|
92
|
+
(): any
|
|
93
|
+
[key: string]: any
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
declare function Tabs<Tabs>(props: Component.Options): any;
|
|
97
|
+
export default Tabs;
|
package/vue/tabs/index.js
CHANGED
|
@@ -1,29 +1,29 @@
|
|
|
1
|
-
import { h } from 'vue';
|
|
2
|
-
import jSuites from "../../dist/jsuites";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
export default {
|
|
6
|
-
inheritAttrs: false,
|
|
7
|
-
mounted() {
|
|
8
|
-
let options = {
|
|
9
|
-
...this.$attrs
|
|
10
|
-
};
|
|
11
|
-
|
|
12
|
-
this.el = this.$refs.container;
|
|
13
|
-
|
|
14
|
-
this.current = jSuites.tabs(this.$refs.container, options);
|
|
15
|
-
},
|
|
16
|
-
setup(_, context) {
|
|
17
|
-
let containerProps = {
|
|
18
|
-
ref: 'container',
|
|
19
|
-
};
|
|
20
|
-
|
|
21
|
-
let vnode = [];
|
|
22
|
-
|
|
23
|
-
if (context.slots.default && typeof(context.slots.default) === 'function') {
|
|
24
|
-
vnode = context.slots.default()
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
return () => h('div', containerProps, vnode);
|
|
28
|
-
},
|
|
1
|
+
import { h } from 'vue';
|
|
2
|
+
import jSuites from "../../dist/jsuites";
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
export default {
|
|
6
|
+
inheritAttrs: false,
|
|
7
|
+
mounted() {
|
|
8
|
+
let options = {
|
|
9
|
+
...this.$attrs
|
|
10
|
+
};
|
|
11
|
+
|
|
12
|
+
this.el = this.$refs.container;
|
|
13
|
+
|
|
14
|
+
this.current = jSuites.tabs(this.$refs.container, options);
|
|
15
|
+
},
|
|
16
|
+
setup(_, context) {
|
|
17
|
+
let containerProps = {
|
|
18
|
+
ref: 'container',
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
let vnode = [];
|
|
22
|
+
|
|
23
|
+
if (context.slots.default && typeof(context.slots.default) === 'function') {
|
|
24
|
+
vnode = context.slots.default()
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
return () => h('div', containerProps, vnode);
|
|
28
|
+
},
|
|
29
29
|
}
|
package/vue/tags/index.d.ts
CHANGED
|
@@ -1,121 +1,121 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Official Type definitions for LemonadeJS plugins
|
|
3
|
-
* https://lemonadejs.net
|
|
4
|
-
* Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
|
-
declare function Component(el: HTMLElement, options?: Component.Options): Component.Instance;
|
|
8
|
-
|
|
9
|
-
declare namespace Component {
|
|
10
|
-
interface Options {
|
|
11
|
-
/** Initial value of the compontent */
|
|
12
|
-
value?: string;
|
|
13
|
-
/** Max number of tags inside the element */
|
|
14
|
-
limit?: number;
|
|
15
|
-
/** The URL for suggestions */
|
|
16
|
-
search?: string;
|
|
17
|
-
/** The default instruction text on the element */
|
|
18
|
-
placeholder?: string;
|
|
19
|
-
/** Method to validate the tags */
|
|
20
|
-
validation?: (el: HTMLElement, text: string, value: string) => boolean;
|
|
21
|
-
/** Method to be execute before any changes on the element */
|
|
22
|
-
onbeforepaste?: (el: HTMLElement, instance: Tags, data: string[]) => string[];
|
|
23
|
-
/** Method to be execute after any changes on the element */
|
|
24
|
-
onbeforechange?: (el: HTMLElement, instance: Tags, currentValue: string, value: string) => string | string[] | boolean;
|
|
25
|
-
/** Method to be execute when the user reach the limit number entries */
|
|
26
|
-
onlimit?: (instance: Tags, limit: number) => void;
|
|
27
|
-
/** Method to be execute when on changed */
|
|
28
|
-
onchange?: (el: HTMLElement, instance: Tags, value: string) => void;
|
|
29
|
-
/** Method to be execute when on focus */
|
|
30
|
-
onfocus?: (el: HTMLElement, instance: Tags, value: string) => void;
|
|
31
|
-
/** Method to be execute when on blur */
|
|
32
|
-
onblur?: (el: HTMLElement, instance: Tags, value: string) => void;
|
|
33
|
-
/** Method to be execute when the element is loaded */
|
|
34
|
-
onload?: (el: HTMLElement, instance: Tags) => void;
|
|
35
|
-
/** Colors */
|
|
36
|
-
colors?: null;
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
interface Instance {
|
|
40
|
-
/**
|
|
41
|
-
* Change the component settings
|
|
42
|
-
* @param {object} - New options
|
|
43
|
-
* @param {boolean} - Reset to the defaults when option not specified
|
|
44
|
-
*/
|
|
45
|
-
setOptions: (options: Options, reset?: boolean) => void;
|
|
46
|
-
|
|
47
|
-
/**
|
|
48
|
-
* Add a new tag to the element
|
|
49
|
-
* @param {string|string[]} value - The value of the new element
|
|
50
|
-
* @param {boolean} - focus on this new element
|
|
51
|
-
*/
|
|
52
|
-
add: (value?: string | string[], focus?: boolean) => void;
|
|
53
|
-
|
|
54
|
-
/**
|
|
55
|
-
* Set the limit of entries for the component
|
|
56
|
-
* @param {number} - New limit
|
|
57
|
-
*/
|
|
58
|
-
setLimit: (limit) => void;
|
|
59
|
-
|
|
60
|
-
/**
|
|
61
|
-
* Remove a item node
|
|
62
|
-
*/
|
|
63
|
-
remove: (node: HTMLElement) => void;
|
|
64
|
-
|
|
65
|
-
/**
|
|
66
|
-
* Get all tags in the element
|
|
67
|
-
* @return {Array} data - All tags as an array
|
|
68
|
-
*/
|
|
69
|
-
getData: () => string[];
|
|
70
|
-
|
|
71
|
-
/**
|
|
72
|
-
* Get the value of one tag. Null for all tags
|
|
73
|
-
* @param {number} index - Tag index number. Null for all tags.
|
|
74
|
-
* @return {string} value - All tags separated by comma
|
|
75
|
-
*/
|
|
76
|
-
getValue: (index?: number) => string;
|
|
77
|
-
|
|
78
|
-
/**
|
|
79
|
-
* Set the value of the element based on a string separated by (,|;|\r\n) or array
|
|
80
|
-
* @param {string|string[]} value - A string or array object with values
|
|
81
|
-
*/
|
|
82
|
-
setValue: (value: string | string[]) => void;
|
|
83
|
-
|
|
84
|
-
/**
|
|
85
|
-
* Reset the value from the component
|
|
86
|
-
*/
|
|
87
|
-
reset: () => void;
|
|
88
|
-
|
|
89
|
-
/**
|
|
90
|
-
* Verify if all tags in the element are valid
|
|
91
|
-
* @return {boolean}
|
|
92
|
-
*/
|
|
93
|
-
isValid: () => boolean;
|
|
94
|
-
|
|
95
|
-
/**
|
|
96
|
-
* Add one element from the suggestions to the component
|
|
97
|
-
* @param {string} text - Label
|
|
98
|
-
* @param {string} value - Value
|
|
99
|
-
*/
|
|
100
|
-
selectIndex: (text: string, value?: string) => void;
|
|
101
|
-
|
|
102
|
-
/**
|
|
103
|
-
* Search for suggestions
|
|
104
|
-
* @param {object} node - Target node for any suggestions
|
|
105
|
-
*/
|
|
106
|
-
search: (node: HTMLElement) => void;
|
|
107
|
-
|
|
108
|
-
/**
|
|
109
|
-
* Destroy the component
|
|
110
|
-
*/
|
|
111
|
-
destroy: () => void;
|
|
112
|
-
}
|
|
113
|
-
}
|
|
114
|
-
|
|
115
|
-
interface Tags {
|
|
116
|
-
(): any
|
|
117
|
-
[key: string]: any
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
declare function Tags<Tags>(props: Component.Options): any;
|
|
121
|
-
export default Tags;
|
|
1
|
+
/**
|
|
2
|
+
* Official Type definitions for LemonadeJS plugins
|
|
3
|
+
* https://lemonadejs.net
|
|
4
|
+
* Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
declare function Component(el: HTMLElement, options?: Component.Options): Component.Instance;
|
|
8
|
+
|
|
9
|
+
declare namespace Component {
|
|
10
|
+
interface Options {
|
|
11
|
+
/** Initial value of the compontent */
|
|
12
|
+
value?: string;
|
|
13
|
+
/** Max number of tags inside the element */
|
|
14
|
+
limit?: number;
|
|
15
|
+
/** The URL for suggestions */
|
|
16
|
+
search?: string;
|
|
17
|
+
/** The default instruction text on the element */
|
|
18
|
+
placeholder?: string;
|
|
19
|
+
/** Method to validate the tags */
|
|
20
|
+
validation?: (el: HTMLElement, text: string, value: string) => boolean;
|
|
21
|
+
/** Method to be execute before any changes on the element */
|
|
22
|
+
onbeforepaste?: (el: HTMLElement, instance: Tags, data: string[]) => string[];
|
|
23
|
+
/** Method to be execute after any changes on the element */
|
|
24
|
+
onbeforechange?: (el: HTMLElement, instance: Tags, currentValue: string, value: string) => string | string[] | boolean;
|
|
25
|
+
/** Method to be execute when the user reach the limit number entries */
|
|
26
|
+
onlimit?: (instance: Tags, limit: number) => void;
|
|
27
|
+
/** Method to be execute when on changed */
|
|
28
|
+
onchange?: (el: HTMLElement, instance: Tags, value: string) => void;
|
|
29
|
+
/** Method to be execute when on focus */
|
|
30
|
+
onfocus?: (el: HTMLElement, instance: Tags, value: string) => void;
|
|
31
|
+
/** Method to be execute when on blur */
|
|
32
|
+
onblur?: (el: HTMLElement, instance: Tags, value: string) => void;
|
|
33
|
+
/** Method to be execute when the element is loaded */
|
|
34
|
+
onload?: (el: HTMLElement, instance: Tags) => void;
|
|
35
|
+
/** Colors */
|
|
36
|
+
colors?: null;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
interface Instance {
|
|
40
|
+
/**
|
|
41
|
+
* Change the component settings
|
|
42
|
+
* @param {object} - New options
|
|
43
|
+
* @param {boolean} - Reset to the defaults when option not specified
|
|
44
|
+
*/
|
|
45
|
+
setOptions: (options: Options, reset?: boolean) => void;
|
|
46
|
+
|
|
47
|
+
/**
|
|
48
|
+
* Add a new tag to the element
|
|
49
|
+
* @param {string|string[]} value - The value of the new element
|
|
50
|
+
* @param {boolean} - focus on this new element
|
|
51
|
+
*/
|
|
52
|
+
add: (value?: string | string[], focus?: boolean) => void;
|
|
53
|
+
|
|
54
|
+
/**
|
|
55
|
+
* Set the limit of entries for the component
|
|
56
|
+
* @param {number} - New limit
|
|
57
|
+
*/
|
|
58
|
+
setLimit: (limit) => void;
|
|
59
|
+
|
|
60
|
+
/**
|
|
61
|
+
* Remove a item node
|
|
62
|
+
*/
|
|
63
|
+
remove: (node: HTMLElement) => void;
|
|
64
|
+
|
|
65
|
+
/**
|
|
66
|
+
* Get all tags in the element
|
|
67
|
+
* @return {Array} data - All tags as an array
|
|
68
|
+
*/
|
|
69
|
+
getData: () => string[];
|
|
70
|
+
|
|
71
|
+
/**
|
|
72
|
+
* Get the value of one tag. Null for all tags
|
|
73
|
+
* @param {number} index - Tag index number. Null for all tags.
|
|
74
|
+
* @return {string} value - All tags separated by comma
|
|
75
|
+
*/
|
|
76
|
+
getValue: (index?: number) => string;
|
|
77
|
+
|
|
78
|
+
/**
|
|
79
|
+
* Set the value of the element based on a string separated by (,|;|\r\n) or array
|
|
80
|
+
* @param {string|string[]} value - A string or array object with values
|
|
81
|
+
*/
|
|
82
|
+
setValue: (value: string | string[]) => void;
|
|
83
|
+
|
|
84
|
+
/**
|
|
85
|
+
* Reset the value from the component
|
|
86
|
+
*/
|
|
87
|
+
reset: () => void;
|
|
88
|
+
|
|
89
|
+
/**
|
|
90
|
+
* Verify if all tags in the element are valid
|
|
91
|
+
* @return {boolean}
|
|
92
|
+
*/
|
|
93
|
+
isValid: () => boolean;
|
|
94
|
+
|
|
95
|
+
/**
|
|
96
|
+
* Add one element from the suggestions to the component
|
|
97
|
+
* @param {string} text - Label
|
|
98
|
+
* @param {string} value - Value
|
|
99
|
+
*/
|
|
100
|
+
selectIndex: (text: string, value?: string) => void;
|
|
101
|
+
|
|
102
|
+
/**
|
|
103
|
+
* Search for suggestions
|
|
104
|
+
* @param {object} node - Target node for any suggestions
|
|
105
|
+
*/
|
|
106
|
+
search: (node: HTMLElement) => void;
|
|
107
|
+
|
|
108
|
+
/**
|
|
109
|
+
* Destroy the component
|
|
110
|
+
*/
|
|
111
|
+
destroy: () => void;
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
interface Tags {
|
|
116
|
+
(): any
|
|
117
|
+
[key: string]: any
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
declare function Tags<Tags>(props: Component.Options): any;
|
|
121
|
+
export default Tags;
|
package/vue/tags/index.js
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
import { h } from 'vue';
|
|
2
|
-
import jSuites from "../../dist/jsuites";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
export default {
|
|
6
|
-
inheritAttrs: false,
|
|
7
|
-
mounted() {
|
|
8
|
-
let options = {
|
|
9
|
-
...this.$attrs
|
|
10
|
-
};
|
|
11
|
-
|
|
12
|
-
this.el = this.$refs.container;
|
|
13
|
-
|
|
14
|
-
this.current = jSuites.tags(this.$refs.container, options);
|
|
15
|
-
},
|
|
16
|
-
setup() {
|
|
17
|
-
let containerProps = {
|
|
18
|
-
ref: 'container',
|
|
19
|
-
};
|
|
20
|
-
return () => h('div', containerProps);
|
|
21
|
-
},
|
|
1
|
+
import { h } from 'vue';
|
|
2
|
+
import jSuites from "../../dist/jsuites";
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
export default {
|
|
6
|
+
inheritAttrs: false,
|
|
7
|
+
mounted() {
|
|
8
|
+
let options = {
|
|
9
|
+
...this.$attrs
|
|
10
|
+
};
|
|
11
|
+
|
|
12
|
+
this.el = this.$refs.container;
|
|
13
|
+
|
|
14
|
+
this.current = jSuites.tags(this.$refs.container, options);
|
|
15
|
+
},
|
|
16
|
+
setup() {
|
|
17
|
+
let containerProps = {
|
|
18
|
+
ref: 'container',
|
|
19
|
+
};
|
|
20
|
+
return () => h('div', containerProps);
|
|
21
|
+
},
|
|
22
22
|
}
|