Skip to content

Commit 4626f0e

Browse files
committed
Add QWEN.md with project documentation and architecture overview
1 parent c9d6eb5 commit 4626f0e

File tree

1 file changed

+78
-0
lines changed

1 file changed

+78
-0
lines changed

QWEN.md

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
# flat-json-tree Project Context
2+
3+
## Project Overview
4+
5+
`flat-json-tree` is a TypeScript library that provides a simple way to manipulate JSON tree objects. The core idea is to transform a JSON tree object into a flat array, allowing standard array operations like `find`, `findIndex`, `filter`, `map`, and others. It's built as a Vue 3 composable function.
6+
7+
The library is published as `@vuebro/flat-json-tree` with the current version being 2.1.12. It's designed to work with tree structures where each element has a unique identifier field.
8+
9+
The project follows the AGPL-3.0 license and is maintained by Jerry Bruwes.
10+
11+
## Architecture and Implementation
12+
13+
The library transforms a JSON tree into a flat array while preserving the tree structure through computed properties added to each child object:
14+
- `branch`: Array of objects representing the path from root to current node
15+
- `index`: Index of the object in the sibling array
16+
- `next`: Next object in the sibling array
17+
- `parent`: Parent object
18+
- `prev`: Previous object in the sibling array
19+
- `siblings`: Array of sibling objects
20+
21+
The main implementation is in `src/index.ts` as a default export function that takes a tree and optional configuration object, returning a composable with reactive properties and manipulation functions.
22+
23+
## Building and Running
24+
25+
### Prerequisites
26+
- Node.js and npm
27+
28+
### Build Process
29+
To build the project:
30+
```bash
31+
npm run build
32+
```
33+
This command uses TypeScript compiler (tsc) to compile the source code.
34+
35+
### Linting
36+
To lint the code:
37+
```bash
38+
npm run lint
39+
```
40+
41+
### Development Setup
42+
1. Clone the repository
43+
2. Run `npm install` to install dependencies
44+
3. Run `npm run build` to build the project
45+
46+
## Key Features and API
47+
48+
### Main Function
49+
`useFlatJsonTree(tree, options?)` - The main composable function with the following return value:
50+
- `nodes`: ComputedRef with the flat array of objects
51+
- `nodesMap`: ComputedRef with an object mapping unique IDs to objects
52+
- Manipulation functions: `add`, `addChild`, `remove`, `down`, `left`, `right`, `up`
53+
54+
### Manipulation Functions
55+
- `add`: Add an empty object to the siblings
56+
- `addChild`: Add an empty object to the children
57+
- `remove`: Remove an object from the tree
58+
- `down`: Move an object down by one position
59+
- `left`: Move an object left by one position
60+
- `right`: Move an object right by one position
61+
- `up`: Move an object up by one position
62+
63+
## Development Conventions
64+
65+
### Coding Style
66+
- The project uses TypeScript with Vue 3 reactivity
67+
- Follows ESLint linting rules defined in `@vuebro/configs/eslint`
68+
- TypeScript configuration extends `@vuebro/configs/tsconfig`
69+
- Uses Prettier formatting with `@vuebro/configs/prettierrc` configuration
70+
71+
### File Structure
72+
- `src/index.ts`: Main implementation file
73+
- `dist/`: Compiled output directory
74+
- Configuration files at root level (eslint.config.ts, tsconfig.json, etc.)
75+
76+
### Dependencies
77+
- Vue 3 (reactivity system) as main dependency
78+
- Development dependencies include TypeScript, Node types, and VueBro configuration packages

0 commit comments

Comments
 (0)