treeselectjs 0.14.0 → 0.14.2-beta.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/LICENSE +1 -1
- package/README.md +44 -45
- package/dist/treeselectjs.css +1 -1
- package/package.json +82 -80
package/LICENSE
CHANGED
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
# Treeselect JS component
|
|
1
|
+
# Treeselect JS component
|
|
2
2
|
|
|
3
|
-
A multi-select
|
|
3
|
+
A multi-select JS component with nested options.
|
|
4
4
|
|
|
5
5
|
- React wrapper - https://www.npmjs.com/package/react-treeselectjs
|
|
6
6
|
- Vue wrapper - https://www.npmjs.com/package/vue-treeselectjs
|
|
@@ -11,11 +11,11 @@ A multi-select js component with nested options.
|
|
|
11
11
|
Build data:
|
|
12
12
|
- treeselectjs.mjs 46.21 kB │ gzip: 10.82 kB
|
|
13
13
|
- treeselectjs.umd.js 36.09 kB │ gzip: 9.38 kB
|
|
14
|
-
- treeselectjs.css 8.
|
|
14
|
+
- treeselectjs.css 8.48 kB │ gzip: 1.58 kB
|
|
15
15
|
|
|
16
16
|
**Live Demo:** https://dipson88.github.io/treeselectjs/
|
|
17
17
|
|
|
18
|
-
|
|
18
|
+
|
|
19
19
|
|
|
20
20
|
### Support
|
|
21
21
|
You can buy me a coffee if you want to support my work. Thank you!
|
|
@@ -27,16 +27,16 @@ You can buy me a coffee if you want to support my work. Thank you!
|
|
|
27
27
|
npm install --save treeselectjs
|
|
28
28
|
```
|
|
29
29
|
Import treeselectjs (ES)
|
|
30
|
-
```
|
|
30
|
+
```js
|
|
31
31
|
import Treeselect from 'treeselectjs'
|
|
32
32
|
|
|
33
33
|
@import 'treeselectjs/dist/treeselectjs.css' // Styles
|
|
34
34
|
```
|
|
35
35
|
|
|
36
36
|
Import treeselectjs (UMD)
|
|
37
|
-
```
|
|
38
|
-
<script src="https://cdn.jsdelivr.net/npm/treeselectjs
|
|
39
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/treeselectjs
|
|
37
|
+
```html
|
|
38
|
+
<script src="https://cdn.jsdelivr.net/npm/treeselectjs/dist/treeselectjs.umd.js"></script>
|
|
39
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/treeselectjs/dist/treeselectjs.css" />
|
|
40
40
|
...
|
|
41
41
|
<script>
|
|
42
42
|
...
|
|
@@ -46,7 +46,7 @@ Import treeselectjs (UMD)
|
|
|
46
46
|
```
|
|
47
47
|
|
|
48
48
|
Example
|
|
49
|
-
```
|
|
49
|
+
```js
|
|
50
50
|
import Treeselect from 'treeselectjs'
|
|
51
51
|
|
|
52
52
|
const options = [
|
|
@@ -122,7 +122,7 @@ slot.addEventListener('click', (e) => {
|
|
|
122
122
|
#### Core props
|
|
123
123
|
Name | Type (default) | Description
|
|
124
124
|
------------- | ------------- | -------------
|
|
125
|
-
**parentHtmlContainer** | HTMLElement (required!) | It should be
|
|
125
|
+
**parentHtmlContainer** | HTMLElement (required!) | It should be an HTML element (e.g. a div); it will be used as the list container.
|
|
126
126
|
**value** | Array[String \| Number] ([]) | An array of `value` from `options` prop. This value will be selected on load of the treeselect. You can call `updateValue` to update prop or set value `treeselect.value` and call `mount`. The `value` changes if you check/uncheck checkboxes or remove tags from the input.
|
|
127
127
|
**options** | Array[Object] ([]) | It is an array of objects ```{name: String, value: String \| Number, disabled?: Boolean, htmlAttr?: object, isGroupSelectable?: boolean, children: [] }```, where children are the same array of objects. Do not use duplicated `value` field. But you can use duplicated names. [Read more](#option-description).
|
|
128
128
|
**disabled** | Boolean (false) | List will be disabled.
|
|
@@ -143,8 +143,8 @@ Name | Type (default) | Description
|
|
|
143
143
|
**alwaysOpen** | Boolean (false) | List will be always opened. You can use it for comfortable style changing. If you want to use it as an opened list, turn `staticList` to `true`.
|
|
144
144
|
**showCount** | Boolean (false) | Shows count of children near the group's name.
|
|
145
145
|
**staticList** | Boolean (false) | Add the list as a static DOM element. List doesn't overlap content. This prop will be ignored if you use `appendToBody`.
|
|
146
|
-
**emptyText** | String ('No results found...') |
|
|
147
|
-
**listSlotHtmlComponent** | HTMLElement (null) | It should be
|
|
146
|
+
**emptyText** | String ('No results found...') | An empty list text.
|
|
147
|
+
**listSlotHtmlComponent** | HTMLElement (null) | It should be an HTML element; it will be appended to the end of the list.
|
|
148
148
|
**direction** | String (auto) | A force direction for the list. Supported values: `auto`, `top`, `bottom`.
|
|
149
149
|
**expandSelected** | Boolean (false) | All groups which have checked values will be expanded on the init.
|
|
150
150
|
**saveScrollPosition** | Boolean (true) | The list saves the last scroll position before close. If you open the list your scroll will be on the previous position. If you set the value to `false` - the scroll will have position 0 and the first item will be focused every time.
|
|
@@ -154,7 +154,7 @@ Name | Type (default) | Description
|
|
|
154
154
|
Name | Type (default) | Description
|
|
155
155
|
------------- | ------------- | -------------
|
|
156
156
|
**showTags** | Boolean (true) | Selected values look like tags. The false value shows results as '{count} elements selected'. You can change text if you use `tagsCountText` prop. For one selected element, you will see a name of this element.
|
|
157
|
-
**tagsCountText** | String ('elements selected') |
|
|
157
|
+
**tagsCountText** | String ('elements selected') | Shown when `showTags` is false; inserted after the count: `'{count} {tagsCountText}'`.
|
|
158
158
|
**tagsSortFn** | `(a: TagsSortItem, b: TagsSortItem) => number` \| `null` (null) | Defines the sorting order for tags in the input field.<br>`TagsSortItem` - `{ value: ValueOptionType, name: string }`.
|
|
159
159
|
**clearable** | Boolean (true) | Clear icon is available.
|
|
160
160
|
**searchable** | Boolean (true) | Search is available.
|
|
@@ -181,7 +181,7 @@ Name | Type (default) | Description
|
|
|
181
181
|
---
|
|
182
182
|
|
|
183
183
|
### Option description
|
|
184
|
-
|
|
184
|
+
This is the description of one option in the [`options`](#core-props) prop:
|
|
185
185
|
Name | Type | Description
|
|
186
186
|
------------- | ------------- | -------------
|
|
187
187
|
**value** | String \| Number (required!) | It is a value of the node. **It should be unique!**
|
|
@@ -214,46 +214,42 @@ Name | Params | Description
|
|
|
214
214
|
**focus** | None | Focuses treeselect input without open/close state changes.
|
|
215
215
|
**toggleOpenClose** | None | Open or close treeselect list and focus treeselect input.
|
|
216
216
|
|
|
217
|
-
---
|
|
218
|
-
|
|
219
217
|
### Customizing colors
|
|
220
218
|
|
|
221
|
-
The component uses CSS custom properties (variables) for colors. Override them on
|
|
219
|
+
The component uses CSS custom properties (variables) for colors. Variables are defined on `:root`. **Override them on `:root`** (or `body`) so they apply to both the input and the dropdown list—especially when using **appendToBody**, since the list is then rendered outside the `.treeselect` container.
|
|
222
220
|
|
|
223
221
|
| Variable | Default | Description |
|
|
224
222
|
|----------|---------|-------------|
|
|
225
|
-
| `--
|
|
226
|
-
| `--
|
|
227
|
-
| `--
|
|
228
|
-
| `--
|
|
229
|
-
| `--
|
|
230
|
-
| `--
|
|
231
|
-
| `--
|
|
232
|
-
| `--
|
|
233
|
-
| `--
|
|
234
|
-
| `--
|
|
235
|
-
| `--
|
|
236
|
-
| `--
|
|
237
|
-
| `--
|
|
238
|
-
| `--
|
|
239
|
-
| `--
|
|
240
|
-
| `--
|
|
223
|
+
| `--treeselectjs-border-color` | `#d7dde4` | Border color of input and list |
|
|
224
|
+
| `--treeselectjs-bg` | `#ffffff` | Background of the input |
|
|
225
|
+
| `--treeselectjs-border-focus` | `#101010` | Border color when focused |
|
|
226
|
+
| `--treeselectjs-tag-bg` | `#d7dde4` | Background of selected tags |
|
|
227
|
+
| `--treeselectjs-tag-bg-hover` | `#c5c7cb` | Tag background on hover |
|
|
228
|
+
| `--treeselectjs-tag-remove-hover` | `#eb4c42` | Remove (×) icon color on hover |
|
|
229
|
+
| `--treeselectjs-icon` | `#c5c7cb` | Arrow and clear icons |
|
|
230
|
+
| `--treeselectjs-icon-hover` | `#838790` | Icons on hover |
|
|
231
|
+
| `--treeselectjs-item-counter` | `#838790` | Group item count text |
|
|
232
|
+
| `--treeselectjs-item-focus-bg` | `#f0ffff` | List item background when focused |
|
|
233
|
+
| `--treeselectjs-item-selected-bg` | `#e9f1f1` | List item background when selected |
|
|
234
|
+
| `--treeselectjs-item-disabled-text` | `#c5cbca` | Disabled item text color |
|
|
235
|
+
| `--treeselectjs-checkbox-bg` | `#ffffff` | Checkbox background |
|
|
236
|
+
| `--treeselectjs-checkbox-border-color` | `#d7dde4` | Checkbox border color |
|
|
237
|
+
| `--treeselectjs-checkbox-checked-bg` | `#52c67e` | Checkbox fill when checked |
|
|
238
|
+
| `--treeselectjs-checkbox-checked-icon` | `#ffffff` | Checkmark color |
|
|
241
239
|
|
|
242
240
|
Example:
|
|
243
241
|
|
|
244
242
|
```css
|
|
245
243
|
body {
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
/* override other variables as needed */
|
|
256
|
-
}
|
|
244
|
+
--treeselectjs-border-color: #444;
|
|
245
|
+
--treeselectjs-bg: #1e1e1e;
|
|
246
|
+
--treeselectjs-border-focus: #6cb6ff;
|
|
247
|
+
--treeselectjs-tag-bg: #333;
|
|
248
|
+
--treeselectjs-tag-bg-hover: #444;
|
|
249
|
+
--treeselectjs-item-focus-bg: #2a2a2a;
|
|
250
|
+
--treeselectjs-item-selected-bg: #2d3a3a;
|
|
251
|
+
--treeselectjs-checkbox-checked-bg: #52c67e;
|
|
252
|
+
/* override other variables as needed */
|
|
257
253
|
}
|
|
258
254
|
```
|
|
259
255
|
|
|
@@ -264,8 +260,11 @@ body {
|
|
|
264
260
|
2) If you want to update props, set props to the entity of the class and then call **mount()** method.
|
|
265
261
|
3) Use **updateValue()** method to update only the value.
|
|
266
262
|
4) If you need to delete List from the DOM when you don't need treeselect anymore - call **destroy()**.
|
|
267
|
-
5) Do not use **duplicated** values for the options. You will see
|
|
263
|
+
5) Do not use **duplicated** values for the options. You will see an error with duplicated values. But you can use duplicated names.
|
|
268
264
|
6) **Value** prop inside the **options** prop should be a **String** or **Number**.
|
|
269
265
|
7) If you use **isSingleSelect** prop, you should pass only a single **value** without an array.
|
|
270
266
|
8) If you use **isSingleSelect** prop, you can set **showTags** to false. It helps to show treeselect as a dropdown. Also you can disable selecting of group's nodes with help of **disabledBranchNode**.
|
|
271
267
|
9) If you use a large list of options and see a problem with performance, try to use **isBoostedRendering** prop.
|
|
268
|
+
|
|
269
|
+
### License
|
|
270
|
+
MIT
|
package/dist/treeselectjs.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.treeselect-input{width:100%;box-sizing:border-box;border:1px solid var(--
|
|
1
|
+
.treeselect-input{width:100%;box-sizing:border-box;border:1px solid var(--treeselectjs-border-color);border-radius:4px;display:flex;align-items:center;flex-wrap:wrap;padding:2px 40px 2px 4px;position:relative;min-height:37px;background-color:var(--treeselectjs-bg);cursor:text}.treeselect-input--unsearchable{cursor:default}.treeselect-input--unsearchable .treeselect-input__edit{caret-color:transparent;cursor:default}.treeselect-input--unsearchable .treeselect-input__edit:focus{position:absolute;z-index:-1;left:0;min-width:0;width:0}.treeselect-input--value-not-selected .treeselect-input__edit,.treeselect-input--value-not-selected.treeselect-input--unsearchable .treeselect-input__edit:focus{z-index:auto;position:static;width:100%;max-width:100%}.treeselect-input--value-not-selected .treeselect-input__tags{gap:0}[dir=rtl] .treeselect-input{padding-right:4px;padding-left:40px}[dir=rtl] .treeselect-input__operators{right:unset;left:2px}.treeselect-input__tags{display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px;max-width:100%;width:100%;box-sizing:border-box}.treeselect-input__tags-element{display:inline-flex;align-items:center;background-color:var(--treeselectjs-tag-bg);cursor:pointer;padding:2px 5px;border-radius:2px;font-size:14px;max-width:100%;box-sizing:border-box}.treeselect-input__tags-element:hover{background-color:var(--treeselectjs-tag-bg-hover)}.treeselect-input__tags-element:hover .treeselect-input__tags-cross svg{stroke:var(--treeselectjs-tag-remove-hover)}.treeselect-input__tags-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.treeselect-input__tags-cross{display:flex;margin-left:2px}.treeselect-input__tags-cross svg{width:12px;height:12px}.treeselect-input__tags-count{font-size:14px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.treeselect-input__edit{background-color:var(--treeselectjs-bg);flex:1;border:none;font-size:14px;text-overflow:ellipsis;width:100%;max-width:calc(100% - 45px);padding:0;position:absolute;z-index:-1;min-width:0}.treeselect-input__edit:focus{outline:none;min-width:30px;max-width:100%;z-index:auto;position:static}.treeselect-input__operators{display:flex;max-width:40px;position:absolute;right:2px}.treeselect-input__clear{display:flex;cursor:pointer}.treeselect-input__clear svg{stroke:var(--treeselectjs-icon);width:17px;min-width:17px;height:20px}.treeselect-input__clear:hover svg{stroke:var(--treeselectjs-icon-hover)}.treeselect-input__arrow{display:flex;cursor:pointer}.treeselect-input__arrow svg{stroke:var(--treeselectjs-icon);width:20px;min-width:20px;height:20px}.treeselect-input__arrow:hover svg{stroke:var(--treeselectjs-icon-hover)}.treeselect-list{width:100%;box-sizing:border-box;border:1px solid var(--treeselectjs-border-color);overflow-y:auto;background-color:var(--treeselectjs-bg);max-height:300px}.treeselect-list__group-container{box-sizing:border-box}.treeselect-list__item{display:flex;align-items:center;box-sizing:border-box;cursor:pointer;height:30px}.treeselect-list__item:focus{outline:none}.treeselect-list__item--focused,.treeselect-list__item--focused.treeselect-list__item--checked{background-color:var(--treeselectjs-item-focus-bg)}.treeselect-list__item--hidden{display:none}.treeselect-list__item--scroll-not-visible{visibility:hidden}.treeselect-list__item-icon{display:flex;align-items:center;cursor:pointer;height:20px;width:20px;min-width:20px}.treeselect-list__item-icon svg{pointer-events:none;width:100%;height:100%;stroke:var(--treeselectjs-icon)}.treeselect-list__item-icon *{pointer-events:none}.treeselect-list__item-icon:hover svg{stroke:var(--treeselectjs-icon-hover)}.treeselect-list__item-checkbox-container{width:20px;height:20px;min-width:20px;border:1px solid var(--treeselectjs-checkbox-border-color);border-radius:3px;position:relative;background-color:var(--treeselectjs-checkbox-bg);pointer-events:none;box-sizing:border-box}.treeselect-list__item-checkbox-container svg{position:absolute;height:100%;width:100%}.treeselect-list__item-checkbox{margin:0;width:0;height:0;pointer-events:none;position:absolute;z-index:-1}.treeselect-list__item-checkbox-icon{position:absolute;height:100%;width:100%;left:0;top:0;text-align:left}.treeselect-list__item-label{width:100%;overflow:hidden;text-overflow:ellipsis;word-break:keep-all;white-space:nowrap;font-size:14px;padding-left:5px;pointer-events:none;text-align:left}.treeselect-list__item-label-counter{margin-left:3px;color:var(--treeselectjs-item-counter);font-size:13px}.treeselect-list__empty{display:flex;align-items:center;height:30px;padding-left:4px}.treeselect-list__empty--hidden{display:none}.treeselect-list__empty-icon{display:flex;align-items:center}.treeselect-list__empty-text{font-size:14px;padding-left:5px;overflow:hidden;text-overflow:ellipsis;word-break:keep-all;white-space:nowrap}.treeselect-list__slot{position:sticky;box-sizing:border-box;width:100%;max-width:100%;bottom:0;background-color:var(--treeselectjs-bg)}.treeselect-list.treeselect-list--single-select .treeselect-list__item-checkbox-container,.treeselect-list.treeselect-list--disabled-branch-node .treeselect-list__item--group .treeselect-list__item-checkbox-container,.treeselect-list__item--non-selectable-group .treeselect-list__item-checkbox-container{display:none}.treeselect-list__item--checked{background-color:var(--treeselectjs-item-selected-bg)}.treeselect-list.treeselect-list--single-select .treeselect-list__item--checked{background-color:transparent}.treeselect-list.treeselect-list--single-select .treeselect-list__item--single-selected{background-color:var(--treeselectjs-item-selected-bg)}.treeselect-list__item .treeselect-list__item-checkbox-container svg{stroke:transparent}.treeselect-list__item--checked .treeselect-list__item-checkbox-container svg,.treeselect-list__item--partial-checked .treeselect-list__item-checkbox-container svg{stroke:var(--treeselectjs-checkbox-checked-icon)}.treeselect-list__item--checked .treeselect-list__item-checkbox-container,.treeselect-list__item--partial-checked .treeselect-list__item-checkbox-container{background-color:var(--treeselectjs-checkbox-checked-bg)}.treeselect-list__item--disabled .treeselect-list__item-checkbox-container{background-color:var(--treeselectjs-item-selected-bg)}.treeselect-list__item--disabled .treeselect-list__item-label{color:var(--treeselectjs-item-disabled-text)}[dir=rtl] .treeselect-list__item-checkbox-icon{text-align:right}[dir=rtl] .treeselect-list__item-label{text-align:right;padding-right:5px;padding-left:unset}[dir=rtl] .treeselect-list__item--closed .treeselect-list__item-icon{transform:rotate(180deg)}[dir=rtl] .treeselect-list__empty{padding-right:4px;padding-left:unset}[dir=rtl] .treeselect-list__empty-text{padding-right:5px;padding-left:unset}:root{--treeselectjs-border-color: #d7dde4;--treeselectjs-bg: #ffffff;--treeselectjs-border-focus: #101010;--treeselectjs-tag-bg: #d7dde4;--treeselectjs-tag-bg-hover: #c5c7cb;--treeselectjs-tag-remove-hover: #eb4c42;--treeselectjs-icon: #c5c7cb;--treeselectjs-icon-hover: #838790;--treeselectjs-item-counter: #838790;--treeselectjs-item-focus-bg: #f0ffff;--treeselectjs-item-selected-bg: #e9f1f1;--treeselectjs-item-disabled-text: #c5cbca;--treeselectjs-checkbox-bg: #ffffff;--treeselectjs-checkbox-border-color: #d7dde4;--treeselectjs-checkbox-checked-bg: #52c67e;--treeselectjs-checkbox-checked-icon: #ffffff}.treeselect{width:100%;position:relative;box-sizing:border-box}.treeselect--disabled{pointer-events:none}.treeselect-list{position:absolute;left:0;border-radius:4px;box-sizing:border-box;z-index:1000}.treeselect .treeselect-list{position:absolute}.treeselect .treeselect-list--static{position:static}.treeselect-input--focused{border-color:var(--treeselectjs-border-focus)}.treeselect-input--opened.treeselect-input--top{border-top-color:transparent;border-top-left-radius:0;border-top-right-radius:0}.treeselect-input--opened.treeselect-input--bottom{border-bottom-color:transparent;border-bottom-left-radius:0;border-bottom-right-radius:0}.treeselect-list--focused{border-color:var(--treeselectjs-border-focus)}.treeselect-list--top,.treeselect-list--top-to-body{border-bottom-color:var(--treeselectjs-border-color);border-bottom-left-radius:0;border-bottom-right-radius:0}.treeselect-list--bottom,.treeselect-list--bottom-to-body{border-top-color:var(--treeselectjs-border-color);border-top-left-radius:0;border-top-right-radius:0}.treeselect-list--top{left:0;bottom:100%}.treeselect-list--bottom{left:0;top:100%}
|
package/package.json
CHANGED
|
@@ -1,80 +1,82 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "treeselectjs",
|
|
3
|
-
"version": "0.14.0",
|
|
4
|
-
"description": "Treeselect JS",
|
|
5
|
-
"main": "./dist/treeselectjs.umd.js",
|
|
6
|
-
"module": "./dist/treeselectjs.mjs",
|
|
7
|
-
"types": "./dist/treeselectjs.d.ts",
|
|
8
|
-
"exports": {
|
|
9
|
-
".": {
|
|
10
|
-
"import": {
|
|
11
|
-
"types": "./dist/treeselectjs.d.ts",
|
|
12
|
-
"default": "./dist/treeselectjs.mjs"
|
|
13
|
-
},
|
|
14
|
-
"require": {
|
|
15
|
-
"types": "./dist/treeselectjs.d.ts",
|
|
16
|
-
"default": "./dist/treeselectjs.umd.js"
|
|
17
|
-
}
|
|
18
|
-
},
|
|
19
|
-
"./dist/treeselectjs.css": {
|
|
20
|
-
"import": "./dist/treeselectjs.css",
|
|
21
|
-
"require": "./dist/treeselectjs.css"
|
|
22
|
-
}
|
|
23
|
-
},
|
|
24
|
-
"
|
|
25
|
-
"
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
"
|
|
31
|
-
"
|
|
32
|
-
"
|
|
33
|
-
"
|
|
34
|
-
"
|
|
35
|
-
"
|
|
36
|
-
"
|
|
37
|
-
|
|
38
|
-
"
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
"
|
|
46
|
-
"
|
|
47
|
-
"
|
|
48
|
-
"
|
|
49
|
-
"
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
"
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
"
|
|
59
|
-
"
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
"
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
"
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
"
|
|
69
|
-
"
|
|
70
|
-
"
|
|
71
|
-
"
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
"
|
|
75
|
-
"
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
"
|
|
79
|
-
|
|
80
|
-
|
|
1
|
+
{
|
|
2
|
+
"name": "treeselectjs",
|
|
3
|
+
"version": "0.14.2-beta.0",
|
|
4
|
+
"description": "Treeselect JS",
|
|
5
|
+
"main": "./dist/treeselectjs.umd.js",
|
|
6
|
+
"module": "./dist/treeselectjs.mjs",
|
|
7
|
+
"types": "./dist/treeselectjs.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"import": {
|
|
11
|
+
"types": "./dist/treeselectjs.d.ts",
|
|
12
|
+
"default": "./dist/treeselectjs.mjs"
|
|
13
|
+
},
|
|
14
|
+
"require": {
|
|
15
|
+
"types": "./dist/treeselectjs.d.ts",
|
|
16
|
+
"default": "./dist/treeselectjs.umd.js"
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
"./dist/treeselectjs.css": {
|
|
20
|
+
"import": "./dist/treeselectjs.css",
|
|
21
|
+
"require": "./dist/treeselectjs.css"
|
|
22
|
+
}
|
|
23
|
+
},
|
|
24
|
+
"repository": {
|
|
25
|
+
"type": "git",
|
|
26
|
+
"url": "git+https://github.com/dipson88/treeselectjs.git",
|
|
27
|
+
"directory": "packages/treeselectjs"
|
|
28
|
+
},
|
|
29
|
+
"keywords": [
|
|
30
|
+
"treeselect",
|
|
31
|
+
"select",
|
|
32
|
+
"groupselect",
|
|
33
|
+
"js",
|
|
34
|
+
"ts",
|
|
35
|
+
"typescript",
|
|
36
|
+
"vanilla"
|
|
37
|
+
],
|
|
38
|
+
"author": "Dzmitry Zhuraukou",
|
|
39
|
+
"license": "MIT",
|
|
40
|
+
"bugs": {
|
|
41
|
+
"url": "https://github.com/dipson88/treeselectjs/issues"
|
|
42
|
+
},
|
|
43
|
+
"homepage": "https://github.com/dipson88/treeselectjs/tree/main/packages/treeselectjs#readme",
|
|
44
|
+
"devDependencies": {
|
|
45
|
+
"@biomejs/biome": "^2.4.4",
|
|
46
|
+
"@testing-library/dom": "^10.4.0",
|
|
47
|
+
"@testing-library/jest-dom": "^6.6.3",
|
|
48
|
+
"@types/jest": "^29.5.14",
|
|
49
|
+
"@types/node": "^22.10.0",
|
|
50
|
+
"cypress": "^13.17.0",
|
|
51
|
+
"identity-obj-proxy": "^3.0.0",
|
|
52
|
+
"jest": "^29.7.0",
|
|
53
|
+
"jest-environment-jsdom": "^29.7.0",
|
|
54
|
+
"resize-observer-polyfill": "^1.5.1",
|
|
55
|
+
"ts-jest": "^29.4.6",
|
|
56
|
+
"ts-node": "^10.9.2",
|
|
57
|
+
"typescript": "^5.8.2",
|
|
58
|
+
"vite": "^7.3.1",
|
|
59
|
+
"vite-plugin-dts": "^4.5.4"
|
|
60
|
+
},
|
|
61
|
+
"overrides": {
|
|
62
|
+
"minimatch": ">=10.2.4"
|
|
63
|
+
},
|
|
64
|
+
"files": [
|
|
65
|
+
"dist"
|
|
66
|
+
],
|
|
67
|
+
"scripts": {
|
|
68
|
+
"dev": "vite --port 5173",
|
|
69
|
+
"dev:ci": "vite --port 5173 --host 127.0.0.1",
|
|
70
|
+
"build": "tsc && vite build",
|
|
71
|
+
"typecheck": "tsc --project tsconfig.app.json --noEmit && tsc --project tsconfig.jest.json --noEmit && tsc --project tsconfig.cypress.json --noEmit",
|
|
72
|
+
"format": "biome format --write",
|
|
73
|
+
"lint": "biome lint",
|
|
74
|
+
"lint:fix": "biome lint --write",
|
|
75
|
+
"check": "biome check --write",
|
|
76
|
+
"jest:watch": "jest --watch",
|
|
77
|
+
"jest:run": "jest",
|
|
78
|
+
"cypress:open": "cypress open",
|
|
79
|
+
"cypress:run": "cypress run",
|
|
80
|
+
"test": "npm run typecheck && npm run jest:run && npm run cypress:run"
|
|
81
|
+
}
|
|
82
|
+
}
|