Skip to content

Commit e54b5a3

Browse files
securingsincitysecuringsincity
authored
Merge pull request #2114 from securingsincity/vite-upgrade
Vite Upgrade
2 parents d33a924 + e886bbe commit e54b5a3

18 files changed

+2973
-8266
lines changed

‎CLAUDE.md‎

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
# CLAUDE.md
2+
3+
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
4+
5+
## Project Overview
6+
7+
React-Ace is a React component library providing wrapper components for the Ace Editor. This is a TypeScript-first library that has migrated from Brace to ace-builds and supports React 0.13+ through 19.0.0.
8+
9+
## Key Commands
10+
11+
### Build Commands
12+
- `npm run build` - Full build (lib + UMD)
13+
- `npm run build:lib` - TypeScript compilation to CommonJS (lib/)
14+
- `npm run build:umd` - Vite UMD build for browsers (dist/)
15+
- `npm run build:umd:min` - Minified UMD build (production mode)
16+
17+
### Development Commands
18+
- `npm run example` - Start Vite development server for examples
19+
- `npm run build:example` - Build examples for production
20+
- `npm test` - Run Vitest tests
21+
- `npm run test:ui` - Run Vitest with UI
22+
- `npm run coverage` - Generate test coverage report
23+
- `npm run prettier` - Format code with Prettier
24+
25+
### Maintenance Commands
26+
- `npm run clean` - Remove lib/ and dist/ directories
27+
- `npm run lint` - Currently a no-op (echo 'foo')
28+
29+
## Code Architecture
30+
31+
### Core Components
32+
The library provides three main editor components in `/src/`:
33+
34+
1. **`ace.tsx`** - Main editor component with comprehensive prop interface (`IAceEditorProps`)
35+
2. **`split.tsx`** - Split-view editor for side-by-side editing (`ISplitEditorProps`)
36+
3. **`diff.tsx`** - Diff editor for comparing content (`IDiffEditorProps`)
37+
38+
### Key Files
39+
- **`src/index.ts`** - Main entry point, exports all components and TypeScript interfaces
40+
- **`src/types.ts`** - Comprehensive TypeScript type definitions
41+
- **`src/editorOptions.ts`** - Editor configuration utilities and Ace instance management
42+
43+
### Build System
44+
- **TypeScript** - Primary language with strict typing
45+
- **Vite** - Modern build tool with fast dev server and optimized builds
46+
- **Babel** - JavaScript transpilation with React/TypeScript presets
47+
- **Vitest** - Testing framework with jsdom environment
48+
49+
### Dependencies
50+
- **ace-builds** - Modern Ace editor (replaces legacy brace)
51+
- **diff-match-patch** - Powers diff editor functionality
52+
- **lodash.get**, **lodash.isequal** - Minimal lodash utilities
53+
- **prop-types** - Runtime type checking for older React versions
54+
55+
## Development Notes
56+
57+
### TypeScript Integration
58+
- All components have comprehensive TypeScript interfaces
59+
- Strict typing with `noImplicitAny: true`
60+
- Generated declarations in `lib/index.d.ts`
61+
62+
### Testing
63+
- Vitest with React Testing Library
64+
- jsdom environment for DOM testing
65+
- Coverage reporting (HTML, LCOV, text formats)
66+
- UI mode available with `npm run test:ui`
67+
68+
### Code Quality
69+
- Prettier formatting (no single quotes, no trailing commas, avoid arrow parens)
70+
- Husky pre-commit hooks with pretty-quick
71+
- PropTypes for runtime validation
72+
73+
### Build Outputs
74+
- **`lib/`** - CommonJS build (main entry point)
75+
- **`dist/`** - UMD builds for browser usage
76+
- **`example/`** - Working examples and development server
77+
78+
### Key Patterns
79+
- Ace builds integration instead of legacy brace
80+
- Comprehensive event callback system
81+
- Flexible editor configuration through props
82+
- Multi-format build system (CommonJS + UMD) with Vite
83+
- TypeScript-first development approach
84+
- Fast development server with HMR

‎example/diff.html‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
1-
<!DOCTYPE html>
1+
<!doctype html>
22
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8">
3+
<head>
4+
<meta charset="UTF-8" />
55
<title>Diff Editor</title>
6-
<link rel="stylesheet" href="diff.css"></link>
7-
</head>
8-
<body>
6+
<link rel="stylesheet" href="diff.css" />
7+
</head>
8+
<body>
99
<div class="container">
10-
<div class="content">
11-
<h1>React-Ace: Diff Example</h1>
12-
<div id="example"></div>
13-
</div>
10+
<div class="content">
11+
<h1>React-Ace: Diff Example</h1>
12+
<div id="example"></div>
13+
</div>
1414
</div>
1515
<script src="./static/diff.js"></script>
16-
</body>
16+
</body>
1717
</html>

‎example/index.html‎

Lines changed: 17 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,20 @@
1-
<!DOCTYPE html>
1+
<!doctype html>
22
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8">
5-
<title>Document</title>
6-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.4.1/css/bulma.min.css"></link>
7-
</head>
8-
<body>
9-
<div class="container">
10-
<div class="content">
11-
<h1>React-Ace</h1>
12-
<div id="example"></div>
3+
<head>
4+
<meta charset="UTF-8" />
5+
<title>Document</title>
6+
<link
7+
rel="stylesheet"
8+
href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.4.1/css/bulma.min.css"
9+
/>
10+
</head>
11+
<body>
12+
<div class="container">
13+
<div class="content">
14+
<h1>React-Ace</h1>
15+
<div id="example"></div>
16+
</div>
1317
</div>
14-
</div>
15-
<script src="./static/index.js"></script>
16-
</body>
18+
<script src="./static/index.js"></script>
19+
</body>
1720
</html>

‎example/split.html‎

Lines changed: 17 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,20 @@
1-
<!DOCTYPE html>
1+
<!doctype html>
22
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8">
5-
<title>Split Editor</title>
6-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.4.1/css/bulma.min.css"></link>
7-
</head>
8-
<body>
9-
<div class="container">
10-
<div class="content">
11-
<h1>React-Ace: Split Editor Example</h1>
12-
<div id="example"></div>
3+
<head>
4+
<meta charset="UTF-8" />
5+
<title>Split Editor</title>
6+
<link
7+
rel="stylesheet"
8+
href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.4.1/css/bulma.min.css"
9+
/>
10+
</head>
11+
<body>
12+
<div class="container">
13+
<div class="content">
14+
<h1>React-Ace: Split Editor Example</h1>
15+
<div id="example"></div>
16+
</div>
1317
</div>
14-
</div>
15-
<script src="./static/split.js"></script>
16-
</body>
18+
<script src="./static/split.js"></script>
19+
</body>
1720
</html>

‎jest.config.ts‎

Lines changed: 0 additions & 9 deletions
This file was deleted.

0 commit comments

Comments
 (0)