Skip to content
This repository was archived by the owner on Jan 1, 2025. It is now read-only.

Commit 2693a27

Browse files
author
Kadir Yazıcı
committed
Customize build and add types
1 parent 022f48b commit 2693a27

File tree

9 files changed

+153
-24
lines changed

9 files changed

+153
-24
lines changed

Diff for: ‎.npmignore

-16
This file was deleted.

Diff for: ‎index.html

-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8" />
5-
<link rel="icon" href="/favicon.ico" />
65
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
76
<title>vue3-tree</title>
87
</head>

Diff for: ‎package.json

+5
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,11 @@
2020
"homepage": "https://github.com/teamseodo/vue3-tree#readme",
2121
"main": "./dist/vue3-tree.umd.js",
2222
"module": "./dist/vue3-tree.es.js",
23+
"types": "./dist/types.d.ts",
24+
"files": [
25+
"/dist",
26+
"README.md"
27+
],
2328
"exports": {
2429
".": {
2530
"import": "./dist/vue3-tree.es.js",

Diff for: ‎plugins/copyTypes.mjs

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import fs from 'fs';
2+
import path from 'path';
3+
4+
const root = process.cwd();
5+
6+
export default () => ({
7+
name: 'vue3-tree:types',
8+
enforce: 'post',
9+
apply: 'build',
10+
closeBundle: () => fs.copyFileSync(
11+
path.join(root, 'src', 'lib', 'index.d.ts'),
12+
path.join(root, 'dist', 'types.d.ts'),
13+
),
14+
});

Diff for: ‎public/favicon.ico

-4.19 KB
Binary file not shown.

Diff for: ‎src/assets/logo.png

-6.69 KB
Binary file not shown.

Diff for: ‎src/lib/index.d.ts

+123
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,123 @@
1+
import { AllowedComponentProps, ComponentCustomProps, VNode, VNodeProps } from "vue";
2+
3+
/**
4+
* Available properties of a node object.
5+
*/
6+
export interface TreeNode {
7+
/**
8+
* Used to identify the node within the tree. Its value must be unique in a nodes array.
9+
*/
10+
id: number | string;
11+
/**
12+
* Used to display the option.
13+
*/
14+
label: string;
15+
/**
16+
* Determines whether the node is selected.
17+
*/
18+
checked?: boolean;
19+
/**
20+
* Determines whether the node is expanded.
21+
*/
22+
expanded?: boolean;
23+
/**
24+
* Array of node objects.
25+
*/
26+
nodes?: TreeNode[];
27+
}
28+
29+
export interface TreeProps {
30+
/**
31+
* An array of nodes to show.
32+
*/
33+
nodes: TreeNode[];
34+
/**
35+
* Indent size in pixels of tree nodes.
36+
* @default 10
37+
*/
38+
indentSize?: number;
39+
/**
40+
* Vertical space between tree nodes.
41+
* @default 10
42+
*/
43+
gap?: number;
44+
/**
45+
* The background style to apply on hover state.
46+
* @default '#e0e0e0'
47+
*/
48+
rowHoverBackground: string;
49+
/**
50+
* Checkbox availability state.
51+
* @default false
52+
*/
53+
useCheckbox?: boolean;
54+
/**
55+
* Icon status used for parent nodes according to their extensibility state.
56+
* @default true
57+
*/
58+
useIcon?: boolean;
59+
/**
60+
* It is used in cases where the ability to delete items in the tree will be added.
61+
* @default false
62+
*/
63+
useRowDelete?: boolean;
64+
/**
65+
* Value used to display the number of child items below the parent item.
66+
* @default false
67+
*/
68+
showChildCount?: boolean;
69+
/**
70+
* Determines the extensibility of the items in the tree.
71+
* @default true
72+
*/
73+
expandable?: boolean;
74+
/**
75+
* Filters tree by a given word.
76+
* @default ''
77+
*/
78+
searchText?: string;
79+
/**
80+
* This emit is triggered when a node is clicked or selected.
81+
*/
82+
onNodeClick(node: TreeNode): void;
83+
/**
84+
* When you click on an item, you can use the emit "nodeExpanded" if you want to see the current values of that item and the data below it. This way you will only be able to access the data for that item.
85+
*/
86+
onNodeExpanded(node: TreeNode, state: boolean): void;
87+
/**
88+
* Returns the current data of the tree when a data is deleted or a checkbox is clicked in the tree. If you are considering to use @update:nodes for only updating data, you can also use v-model:nodes
89+
*/
90+
'onUpdate:nodes'(nodes: TreeNode[]): void;
91+
}
92+
93+
export interface ChildCountSlotScope {
94+
count: number;
95+
checkedCount: number;
96+
childs: TreeNode[];
97+
}
98+
99+
export interface CheckboxSlotScope {
100+
id: TreeNode['id'];
101+
checked: TreeNode['checked'];
102+
node: TreeNode;
103+
indeterminate: boolean;
104+
toggleCheckbox(): void;
105+
}
106+
107+
declare const Tree: new () => {
108+
$props: AllowedComponentProps & ComponentCustomProps & VNodeProps & TreeProps;
109+
$slots: {
110+
default: () => VNode[],
111+
iconActive: () => VNode[],
112+
iconInactive: () => VNode[],
113+
deleteIcon: () => VNode[],
114+
checkbox: (arg: CheckboxSlotScope) => VNode[],
115+
childCount: (arg: ChildCountSlotScope) => VNode[],
116+
}
117+
};
118+
119+
export declare function getNodeById(nodes: TreeNode[], id: TreeNode['id']): void;
120+
export declare function setNodeById( nodes: TreeNode[], id: TreeNode['id'], node: TreeNode): void;
121+
export declare function setNodeById( nodes: TreeNode[], id: TreeNode['id'], node: TreeNode): void;
122+
123+
export default Tree;

Diff for: ‎src/lib/index.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import Tree from "./components/Tree.vue";
2-
import { getNodeById, setNodeById, updateNodeById } from "./utils";
1+
import Tree from './components/Tree.vue';
2+
import { getNodeById, setNodeById, updateNodeById } from './utils';
33

44
export default Tree;
55

Diff for: ‎vite.config.js

+9-5
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
import vue from '@vitejs/plugin-vue'
2-
const path = require('path')
1+
import vue from '@vitejs/plugin-vue';
2+
import copyTypes from './plugins/copyTypes.mjs';
3+
import * as path from 'path';
34

45
const config = {
56
resolve: {
@@ -10,7 +11,10 @@ const config = {
1011
},
1112
],
1213
},
13-
plugins: [vue()],
14+
plugins: [
15+
vue(),
16+
copyTypes(),
17+
],
1418
build: {
1519
lib: {
1620
entry: path.resolve(__dirname, 'src/lib/index.js'),
@@ -29,6 +33,6 @@ const config = {
2933
},
3034
},
3135
},
32-
}
36+
};
3337

34-
export default config
38+
export default config;

0 commit comments

Comments
 (0)