treeselectjs 0.8.6 → 0.9.0

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/README.md CHANGED
@@ -9,8 +9,8 @@ A multi-select js component with nested options.
9
9
  - Typescript support
10
10
 
11
11
  Build data:
12
- - treeselectjs.mjs 48.92 kB │ gzip: 11.07 kB
13
- - treeselectjs.umd.js 39.79 kB │ gzip: 10.17 kB
12
+ - treeselectjs.mjs 49.80 kB │ gzip: 11.27 kB
13
+ - treeselectjs.umd.js 40.41 kB │ gzip: 10.29 kB
14
14
  - treeselectjs.css 6.41 kB │ gzip: 1.27 kB
15
15
 
16
16
  **Live Demo:** https://dipson88.github.io/treeselectjs/
@@ -30,8 +30,8 @@ import Treeselect from 'treeselectjs'
30
30
 
31
31
  Import treeselectjs (UMD)
32
32
  ```
33
- <script src="https://cdn.jsdelivr.net/npm/treeselectjs@0.8.6/dist/treeselectjs.umd.js"></script>
34
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/treeselectjs@0.8.6/dist/treeselectjs.css" />
33
+ <script src="https://cdn.jsdelivr.net/npm/treeselectjs@0.9.0/dist/treeselectjs.umd.js"></script>
34
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/treeselectjs@0.9.0/dist/treeselectjs.css" />
35
35
  ...
36
36
  <script>
37
37
  ...
@@ -125,6 +125,7 @@ Name | Type (default) | Description
125
125
  **id** | String ('') | id attribute for the accessibility.
126
126
  **isSingleSelect** | Boolean (false) | Converts multi-select to the single value select. Checkboxes will be removed. You should pass only one id instead of array of values. Also you can set **showTags** to false. It helps to show treeselect as a dropdown.
127
127
  **isGroupedValue** | Boolean (false) | Return groups if they selected instead of separate ids. Treeselect returns only leaves ids by default.
128
+ **isIndependentNodes** | Boolean (false) | All nodes in treeselect work as an independent entity. Check/uncheck action ignore children/parent updates workflow. Disabled nodes ignore children/parent workflow as well.
128
129
 
129
130
  #### List settings props
130
131
  Name | Type (default) | Description
@@ -158,6 +159,7 @@ Name | Type (default) | Description
158
159
  **openCallback** | (value) => void (undefined) | Callback method for `open` if you don't want to use eventListener.
159
160
  **closeCallback** | (value) => void (undefined) | Callback method for `close` if you don't want to use eventListener.
160
161
  **nameChangeCallback** | (name) => void (undefined) | Callback method for `name-change` if you don't want to use eventListener.
162
+ **searchCallback** | (value) => void (undefined) | Callback method for `search` if you don't want to use eventListener.
161
163
 
162
164
  #### Additional props
163
165
  Name | Type (default) | Description
@@ -185,6 +187,7 @@ Name | Return Type | Description
185
187
  **open** | Array[String \| Number] | Returns selected values, action is triggered on opening the list. Add `eventListener` or use `openCallback` prop to get value.
186
188
  **close** | Array[String \| Number] | Returns selected values, action is triggered on closing the list. Add `eventListener` or use `closeCallback` prop to get value.
187
189
  **name-change** | String | Returns selected name inside the input, action is triggered on on change the list. Add `eventListener` or use `nameChangeCallback` prop to get name.
190
+ **search** | String | Returns entered search value, action is triggered on change search value during the typing. Add `eventListener` or use `searchCallback` prop to get value. You can try create something like autocomplete with help of this event.
188
191
 
189
192
  ---
190
193
 
@@ -36,6 +36,7 @@ declare interface ITreeselect {
36
36
  direction: DirectionType;
37
37
  expandSelected: boolean;
38
38
  saveScrollPosition: boolean;
39
+ isIndependentNodes: boolean;
39
40
  iconElements: IconsType;
40
41
  ungroupedValue: ValueOptionType[];
41
42
  groupedValue: ValueOptionType[];
@@ -46,6 +47,7 @@ declare interface ITreeselect {
46
47
  openCallback: ((value: ValueType) => void) | undefined;
47
48
  closeCallback: ((value: ValueType) => void) | undefined;
48
49
  nameChangeCallback: ((name: string) => void) | undefined;
50
+ searchCallback: ((value: string) => void) | undefined;
49
51
  mount: () => void;
50
52
  updateValue: (newValue: ValueInputType) => void;
51
53
  destroy: () => void;
@@ -78,11 +80,13 @@ export declare interface ITreeselectParams {
78
80
  direction?: DirectionType;
79
81
  expandSelected?: boolean;
80
82
  saveScrollPosition?: boolean;
83
+ isIndependentNodes?: boolean;
81
84
  iconElements?: Partial<IconsType>;
82
85
  inputCallback?: (value: ValueType) => void;
83
86
  openCallback?: (value: ValueType) => void;
84
87
  closeCallback?: (value: ValueType) => void;
85
88
  nameChangeCallback?: (name: string) => void;
89
+ searchCallback?: (value: string) => void;
86
90
  }
87
91
 
88
92
  export declare type OptionType = {
@@ -119,17 +123,20 @@ declare class Treeselect implements ITreeselect {
119
123
  direction: DirectionType;
120
124
  expandSelected: boolean;
121
125
  saveScrollPosition: boolean;
126
+ isIndependentNodes: boolean;
122
127
  iconElements: IconsType;
123
128
  inputCallback: ((value: ValueType) => void) | undefined;
124
129
  openCallback: ((value: ValueType) => void) | undefined;
125
130
  closeCallback: ((value: ValueType) => void) | undefined;
126
131
  nameChangeCallback: ((name: string) => void) | undefined;
132
+ searchCallback: ((value: string) => void) | undefined;
127
133
  ungroupedValue: ValueOptionType[];
128
134
  groupedValue: ValueOptionType[];
135
+ allValue: ValueOptionType[];
129
136
  isListOpened: boolean;
130
137
  selectedName: string;
131
138
  srcElement: HTMLElement | null;
132
- constructor({ parentHtmlContainer, value, options, openLevel, appendToBody, alwaysOpen, showTags, tagsCountText, clearable, searchable, placeholder, grouped, isGroupedValue, listSlotHtmlComponent, disabled, emptyText, staticList, id, isSingleSelect, showCount, disabledBranchNode, direction, expandSelected, saveScrollPosition, iconElements, inputCallback, openCallback, closeCallback, nameChangeCallback }: ITreeselectParams);
139
+ constructor({ parentHtmlContainer, value, options, openLevel, appendToBody, alwaysOpen, showTags, tagsCountText, clearable, searchable, placeholder, grouped, isGroupedValue, listSlotHtmlComponent, disabled, emptyText, staticList, id, isSingleSelect, showCount, disabledBranchNode, direction, expandSelected, saveScrollPosition, isIndependentNodes, iconElements, inputCallback, openCallback, closeCallback, nameChangeCallback, searchCallback }: ITreeselectParams);
133
140
  mount(): void;
134
141
  updateValue(newValue: ValueInputType): void;
135
142
  destroy(): void;