@thehoneyjar/sigil-diagnostics 0.1.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.md +660 -0
- package/README.md +128 -0
- package/dist/index.d.ts +312 -0
- package/dist/index.js +931 -0
- package/package.json +59 -0
- package/src/compliance.ts +250 -0
- package/src/detection.ts +373 -0
- package/src/index.ts +48 -0
- package/src/patterns.ts +327 -0
- package/src/service.ts +330 -0
- package/src/types.ts +243 -0
package/README.md
ADDED
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
# @sigil/diagnostics
|
|
2
|
+
|
|
3
|
+
Physics compliance checking and issue detection for Sigil.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
pnpm add @sigil/diagnostics
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Usage
|
|
12
|
+
|
|
13
|
+
### Quick Diagnosis
|
|
14
|
+
|
|
15
|
+
```typescript
|
|
16
|
+
import { createDiagnosticsService } from '@sigil/diagnostics'
|
|
17
|
+
|
|
18
|
+
const diagnosticsService = createDiagnosticsService()
|
|
19
|
+
|
|
20
|
+
// Diagnose a symptom
|
|
21
|
+
const diagnosis = diagnosticsService.diagnose('dialog flickers on open')
|
|
22
|
+
console.log(diagnosis)
|
|
23
|
+
// **Found: Dialog/Modal Instability** (70% confidence)
|
|
24
|
+
// **Cause:** ResponsiveDialog hydration
|
|
25
|
+
// ...
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
### Effect Detection
|
|
29
|
+
|
|
30
|
+
```typescript
|
|
31
|
+
import { detectEffect, getExpectedPhysics } from '@sigil/diagnostics'
|
|
32
|
+
|
|
33
|
+
// Detect effect from keywords
|
|
34
|
+
const effect = detectEffect(['claim', 'button'])
|
|
35
|
+
console.log(effect) // 'financial'
|
|
36
|
+
|
|
37
|
+
// Get expected physics for effect
|
|
38
|
+
const physics = getExpectedPhysics('financial')
|
|
39
|
+
console.log(physics)
|
|
40
|
+
// { sync: 'pessimistic', timing: 800, confirmation: true }
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
### Compliance Checking
|
|
44
|
+
|
|
45
|
+
```typescript
|
|
46
|
+
import { checkCompliance, isFullyCompliant } from '@sigil/diagnostics'
|
|
47
|
+
|
|
48
|
+
const compliance = checkCompliance('financial', {
|
|
49
|
+
behavioral: {
|
|
50
|
+
sync: 'optimistic', // Wrong! Should be pessimistic
|
|
51
|
+
timing: 200,
|
|
52
|
+
confirmation: false,
|
|
53
|
+
},
|
|
54
|
+
})
|
|
55
|
+
|
|
56
|
+
console.log(isFullyCompliant(compliance)) // false
|
|
57
|
+
console.log(compliance.behavioral.reason)
|
|
58
|
+
// 'sync should be pessimistic, got optimistic; ...'
|
|
59
|
+
```
|
|
60
|
+
|
|
61
|
+
### Pattern Matching
|
|
62
|
+
|
|
63
|
+
```typescript
|
|
64
|
+
import { createDiagnosticsService } from '@sigil/diagnostics'
|
|
65
|
+
|
|
66
|
+
const diagnosticsService = createDiagnosticsService()
|
|
67
|
+
|
|
68
|
+
// Match symptoms to patterns
|
|
69
|
+
const matches = diagnosticsService.matchPatterns('hydration mismatch flicker')
|
|
70
|
+
|
|
71
|
+
for (const match of matches) {
|
|
72
|
+
console.log(`${match.pattern.name}: ${match.confidence * 100}%`)
|
|
73
|
+
console.log(match.matchedCause.solution)
|
|
74
|
+
}
|
|
75
|
+
```
|
|
76
|
+
|
|
77
|
+
## API
|
|
78
|
+
|
|
79
|
+
### Service
|
|
80
|
+
|
|
81
|
+
| Method | Description |
|
|
82
|
+
|--------|-------------|
|
|
83
|
+
| `analyze(component, code?)` | Analyze component for issues |
|
|
84
|
+
| `checkCompliance(effect, physics)` | Check physics compliance |
|
|
85
|
+
| `detectEffect(keywords, types?)` | Detect effect type |
|
|
86
|
+
| `matchPatterns(symptoms)` | Match symptoms to patterns |
|
|
87
|
+
| `diagnose(symptom)` | Get quick diagnosis |
|
|
88
|
+
|
|
89
|
+
### Detection
|
|
90
|
+
|
|
91
|
+
| Function | Description |
|
|
92
|
+
|----------|-------------|
|
|
93
|
+
| `detectEffect(keywords, types?)` | Detect effect from keywords/types |
|
|
94
|
+
| `getExpectedPhysics(effect)` | Get expected physics for effect |
|
|
95
|
+
|
|
96
|
+
### Compliance
|
|
97
|
+
|
|
98
|
+
| Function | Description |
|
|
99
|
+
|----------|-------------|
|
|
100
|
+
| `checkBehavioralCompliance(effect, actual)` | Check behavioral physics |
|
|
101
|
+
| `checkAnimationCompliance(effect, actual)` | Check animation physics |
|
|
102
|
+
| `checkMaterialCompliance(effect, actual)` | Check material physics |
|
|
103
|
+
| `checkCompliance(effect, physics)` | Check all physics |
|
|
104
|
+
| `isFullyCompliant(compliance)` | Check if fully compliant |
|
|
105
|
+
|
|
106
|
+
### Patterns
|
|
107
|
+
|
|
108
|
+
| Function | Description |
|
|
109
|
+
|----------|-------------|
|
|
110
|
+
| `PATTERNS` | Array of all diagnostic patterns |
|
|
111
|
+
| `getPatterns()` | Get all patterns |
|
|
112
|
+
| `getPatternsByCategory(category)` | Get patterns by category |
|
|
113
|
+
| `getPatternById(id)` | Get pattern by ID |
|
|
114
|
+
|
|
115
|
+
## Built-in Patterns
|
|
116
|
+
|
|
117
|
+
- `hydration-media-query` - useMediaQuery hydration mismatch
|
|
118
|
+
- `dialog-instability` - Dialog/modal glitches
|
|
119
|
+
- `render-performance` - Performance issues
|
|
120
|
+
- `layout-shift` - CLS issues
|
|
121
|
+
- `server-component-error` - Server component hook errors
|
|
122
|
+
- `react-19-changes` - React 19 breaking changes
|
|
123
|
+
- `physics-financial-optimistic` - Financial with wrong sync
|
|
124
|
+
- `physics-destructive-no-confirm` - Destructive without confirm
|
|
125
|
+
|
|
126
|
+
## License
|
|
127
|
+
|
|
128
|
+
MIT
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,312 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @sigil/diagnostics
|
|
3
|
+
*
|
|
4
|
+
* Types for physics compliance checking and issue detection.
|
|
5
|
+
*/
|
|
6
|
+
/**
|
|
7
|
+
* Effect types that determine physics behavior
|
|
8
|
+
*/
|
|
9
|
+
type EffectType = 'financial' | 'destructive' | 'soft-delete' | 'standard' | 'local' | 'navigation' | 'query';
|
|
10
|
+
/**
|
|
11
|
+
* Issue severity levels
|
|
12
|
+
*/
|
|
13
|
+
type Severity = 'error' | 'warning' | 'info';
|
|
14
|
+
/**
|
|
15
|
+
* Pattern categories for diagnostics
|
|
16
|
+
*/
|
|
17
|
+
type PatternCategory = 'hydration' | 'dialog' | 'performance' | 'layout' | 'server-component' | 'react-19' | 'physics';
|
|
18
|
+
/**
|
|
19
|
+
* A diagnostic issue found during analysis
|
|
20
|
+
*/
|
|
21
|
+
interface DiagnosticIssue {
|
|
22
|
+
/** Severity level */
|
|
23
|
+
severity: Severity;
|
|
24
|
+
/** Unique code for this issue type */
|
|
25
|
+
code: string;
|
|
26
|
+
/** Human-readable message */
|
|
27
|
+
message: string;
|
|
28
|
+
/** Source location if available */
|
|
29
|
+
location?: {
|
|
30
|
+
file?: string;
|
|
31
|
+
line?: number;
|
|
32
|
+
column?: number;
|
|
33
|
+
};
|
|
34
|
+
/** Suggested fix */
|
|
35
|
+
suggestion?: string;
|
|
36
|
+
}
|
|
37
|
+
/**
|
|
38
|
+
* Behavioral physics compliance check result
|
|
39
|
+
*/
|
|
40
|
+
interface BehavioralCompliance {
|
|
41
|
+
/** Sync strategy: optimistic, pessimistic, or immediate */
|
|
42
|
+
sync: 'optimistic' | 'pessimistic' | 'immediate';
|
|
43
|
+
/** Expected timing in ms */
|
|
44
|
+
timing: number;
|
|
45
|
+
/** Whether confirmation is required */
|
|
46
|
+
confirmation: boolean;
|
|
47
|
+
/** Whether current implementation is compliant */
|
|
48
|
+
compliant: boolean;
|
|
49
|
+
/** Reason for non-compliance */
|
|
50
|
+
reason?: string;
|
|
51
|
+
}
|
|
52
|
+
/**
|
|
53
|
+
* Animation physics compliance check result
|
|
54
|
+
*/
|
|
55
|
+
interface AnimationCompliance {
|
|
56
|
+
/** Easing function used */
|
|
57
|
+
easing: string;
|
|
58
|
+
/** Duration in ms */
|
|
59
|
+
duration: number;
|
|
60
|
+
/** Whether current implementation is compliant */
|
|
61
|
+
compliant: boolean;
|
|
62
|
+
/** Reason for non-compliance */
|
|
63
|
+
reason?: string;
|
|
64
|
+
}
|
|
65
|
+
/**
|
|
66
|
+
* Material physics compliance check result
|
|
67
|
+
*/
|
|
68
|
+
interface MaterialCompliance {
|
|
69
|
+
/** Surface type */
|
|
70
|
+
surface: string;
|
|
71
|
+
/** Shadow style */
|
|
72
|
+
shadow: string;
|
|
73
|
+
/** Border radius */
|
|
74
|
+
radius?: string;
|
|
75
|
+
/** Whether current implementation is compliant */
|
|
76
|
+
compliant: boolean;
|
|
77
|
+
/** Reason for non-compliance */
|
|
78
|
+
reason?: string;
|
|
79
|
+
}
|
|
80
|
+
/**
|
|
81
|
+
* Complete compliance result across all physics layers
|
|
82
|
+
*/
|
|
83
|
+
interface ComplianceResult {
|
|
84
|
+
/** Behavioral physics compliance */
|
|
85
|
+
behavioral: BehavioralCompliance;
|
|
86
|
+
/** Animation physics compliance */
|
|
87
|
+
animation: AnimationCompliance;
|
|
88
|
+
/** Material physics compliance */
|
|
89
|
+
material: MaterialCompliance;
|
|
90
|
+
}
|
|
91
|
+
/**
|
|
92
|
+
* Full diagnostic result for a component
|
|
93
|
+
*/
|
|
94
|
+
interface DiagnosticResult {
|
|
95
|
+
/** Component name or identifier */
|
|
96
|
+
component: string;
|
|
97
|
+
/** Detected effect type */
|
|
98
|
+
effect: EffectType;
|
|
99
|
+
/** Issues found during analysis */
|
|
100
|
+
issues: DiagnosticIssue[];
|
|
101
|
+
/** Physics compliance results */
|
|
102
|
+
compliance: ComplianceResult;
|
|
103
|
+
/** Improvement suggestions */
|
|
104
|
+
suggestions: string[];
|
|
105
|
+
}
|
|
106
|
+
/**
|
|
107
|
+
* Pattern cause for matching symptoms
|
|
108
|
+
*/
|
|
109
|
+
interface PatternCause {
|
|
110
|
+
/** Cause name */
|
|
111
|
+
name: string;
|
|
112
|
+
/** Signature/pattern to look for */
|
|
113
|
+
signature: string;
|
|
114
|
+
/** Example of problematic code */
|
|
115
|
+
codeSmell?: string;
|
|
116
|
+
/** Solution code or explanation */
|
|
117
|
+
solution: string;
|
|
118
|
+
}
|
|
119
|
+
/**
|
|
120
|
+
* Diagnostic pattern for matching known issues
|
|
121
|
+
*/
|
|
122
|
+
interface DiagnosticPattern {
|
|
123
|
+
/** Unique pattern ID */
|
|
124
|
+
id: string;
|
|
125
|
+
/** Human-readable name */
|
|
126
|
+
name: string;
|
|
127
|
+
/** Category of issue */
|
|
128
|
+
category: PatternCategory;
|
|
129
|
+
/** Severity level */
|
|
130
|
+
severity: Severity;
|
|
131
|
+
/** Symptoms that indicate this pattern */
|
|
132
|
+
symptoms: string[];
|
|
133
|
+
/** Keywords to match against */
|
|
134
|
+
keywords: string[];
|
|
135
|
+
/** Possible causes and solutions */
|
|
136
|
+
causes: PatternCause[];
|
|
137
|
+
}
|
|
138
|
+
/**
|
|
139
|
+
* Result of pattern matching
|
|
140
|
+
*/
|
|
141
|
+
interface PatternMatchResult {
|
|
142
|
+
/** Matched pattern */
|
|
143
|
+
pattern: DiagnosticPattern;
|
|
144
|
+
/** Most likely cause */
|
|
145
|
+
matchedCause: PatternCause;
|
|
146
|
+
/** Confidence score 0-1 */
|
|
147
|
+
confidence: number;
|
|
148
|
+
}
|
|
149
|
+
/**
|
|
150
|
+
* Configuration for the diagnostics service
|
|
151
|
+
*/
|
|
152
|
+
interface DiagnosticsConfig {
|
|
153
|
+
/** Enable strict mode (more warnings) */
|
|
154
|
+
strict?: boolean;
|
|
155
|
+
/** Custom patterns to include */
|
|
156
|
+
customPatterns?: DiagnosticPattern[];
|
|
157
|
+
/** Pattern categories to check */
|
|
158
|
+
categories?: PatternCategory[];
|
|
159
|
+
}
|
|
160
|
+
/**
|
|
161
|
+
* Diagnostics service interface
|
|
162
|
+
*/
|
|
163
|
+
interface DiagnosticsService {
|
|
164
|
+
/**
|
|
165
|
+
* Analyze a component for physics compliance and issues
|
|
166
|
+
*/
|
|
167
|
+
analyze(component: string, code?: string): Promise<DiagnosticResult>;
|
|
168
|
+
/**
|
|
169
|
+
* Check if physics settings comply with effect type
|
|
170
|
+
*/
|
|
171
|
+
checkCompliance(effect: EffectType, physics: Partial<ComplianceResult>): boolean;
|
|
172
|
+
/**
|
|
173
|
+
* Detect effect type from keywords and types
|
|
174
|
+
*/
|
|
175
|
+
detectEffect(keywords: string[], types?: string[]): EffectType;
|
|
176
|
+
/**
|
|
177
|
+
* Match symptoms to known patterns
|
|
178
|
+
*/
|
|
179
|
+
matchPatterns(symptoms: string): PatternMatchResult[];
|
|
180
|
+
/**
|
|
181
|
+
* Get quick diagnosis from symptom description
|
|
182
|
+
*/
|
|
183
|
+
diagnose(symptom: string): string;
|
|
184
|
+
}
|
|
185
|
+
/**
|
|
186
|
+
* Error codes for diagnostics package
|
|
187
|
+
*/
|
|
188
|
+
declare const DiagnosticsErrorCodes: {
|
|
189
|
+
readonly ANALYSIS_FAILED: "ANALYSIS_FAILED";
|
|
190
|
+
readonly PATTERN_NOT_FOUND: "PATTERN_NOT_FOUND";
|
|
191
|
+
readonly INVALID_EFFECT: "INVALID_EFFECT";
|
|
192
|
+
readonly ANCHOR_NOT_AVAILABLE: "ANCHOR_NOT_AVAILABLE";
|
|
193
|
+
};
|
|
194
|
+
/**
|
|
195
|
+
* Diagnostics error class
|
|
196
|
+
*/
|
|
197
|
+
declare class DiagnosticsError extends Error {
|
|
198
|
+
code: keyof typeof DiagnosticsErrorCodes;
|
|
199
|
+
recoverable: boolean;
|
|
200
|
+
constructor(message: string, code: keyof typeof DiagnosticsErrorCodes, recoverable?: boolean);
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
/**
|
|
204
|
+
* Effect Detection
|
|
205
|
+
*
|
|
206
|
+
* Detect effect type from keywords, types, and context.
|
|
207
|
+
*/
|
|
208
|
+
|
|
209
|
+
/**
|
|
210
|
+
* Detect effect type from keywords and types
|
|
211
|
+
*
|
|
212
|
+
* Priority:
|
|
213
|
+
* 1. Types override keywords (Currency, Wei, etc. → Financial)
|
|
214
|
+
* 2. Context can modify detection (with undo → Soft Delete)
|
|
215
|
+
* 3. Keywords determine base effect
|
|
216
|
+
*/
|
|
217
|
+
declare function detectEffect(keywords: string[], types?: string[]): EffectType;
|
|
218
|
+
/**
|
|
219
|
+
* Get expected physics for an effect type
|
|
220
|
+
*/
|
|
221
|
+
declare function getExpectedPhysics(effect: EffectType): {
|
|
222
|
+
sync: 'optimistic' | 'pessimistic' | 'immediate';
|
|
223
|
+
timing: number;
|
|
224
|
+
confirmation: boolean;
|
|
225
|
+
};
|
|
226
|
+
/**
|
|
227
|
+
* Export keyword lists for external use
|
|
228
|
+
*/
|
|
229
|
+
declare const keywords: {
|
|
230
|
+
financial: string[];
|
|
231
|
+
destructive: string[];
|
|
232
|
+
softDelete: string[];
|
|
233
|
+
standard: string[];
|
|
234
|
+
local: string[];
|
|
235
|
+
navigation: string[];
|
|
236
|
+
query: string[];
|
|
237
|
+
};
|
|
238
|
+
|
|
239
|
+
/**
|
|
240
|
+
* Physics Compliance Checking
|
|
241
|
+
*
|
|
242
|
+
* Verify that component physics match expected values for effect type.
|
|
243
|
+
*/
|
|
244
|
+
|
|
245
|
+
/**
|
|
246
|
+
* Check behavioral physics compliance
|
|
247
|
+
*/
|
|
248
|
+
declare function checkBehavioralCompliance(effect: EffectType, actual: Partial<BehavioralCompliance>): BehavioralCompliance;
|
|
249
|
+
/**
|
|
250
|
+
* Check animation physics compliance
|
|
251
|
+
*/
|
|
252
|
+
declare function checkAnimationCompliance(effect: EffectType, actual: Partial<AnimationCompliance>): AnimationCompliance;
|
|
253
|
+
/**
|
|
254
|
+
* Check material physics compliance
|
|
255
|
+
*/
|
|
256
|
+
declare function checkMaterialCompliance(effect: EffectType, actual: Partial<MaterialCompliance>): MaterialCompliance;
|
|
257
|
+
/**
|
|
258
|
+
* Check full compliance across all physics layers
|
|
259
|
+
*/
|
|
260
|
+
declare function checkCompliance(effect: EffectType, physics: Partial<ComplianceResult>): ComplianceResult;
|
|
261
|
+
/**
|
|
262
|
+
* Generate issues from compliance result
|
|
263
|
+
*/
|
|
264
|
+
declare function complianceToIssues(compliance: ComplianceResult): DiagnosticIssue[];
|
|
265
|
+
/**
|
|
266
|
+
* Check if compliance result is fully compliant
|
|
267
|
+
*/
|
|
268
|
+
declare function isFullyCompliant(compliance: ComplianceResult): boolean;
|
|
269
|
+
|
|
270
|
+
/**
|
|
271
|
+
* Known Diagnostic Patterns
|
|
272
|
+
*
|
|
273
|
+
* Patterns for detecting common issues in React/Next.js applications.
|
|
274
|
+
*/
|
|
275
|
+
|
|
276
|
+
/**
|
|
277
|
+
* Built-in diagnostic patterns
|
|
278
|
+
*/
|
|
279
|
+
declare const PATTERNS: DiagnosticPattern[];
|
|
280
|
+
/**
|
|
281
|
+
* Get all patterns
|
|
282
|
+
*/
|
|
283
|
+
declare function getPatterns(): DiagnosticPattern[];
|
|
284
|
+
/**
|
|
285
|
+
* Get patterns by category
|
|
286
|
+
*/
|
|
287
|
+
declare function getPatternsByCategory(category: DiagnosticPattern['category']): DiagnosticPattern[];
|
|
288
|
+
/**
|
|
289
|
+
* Get pattern by ID
|
|
290
|
+
*/
|
|
291
|
+
declare function getPatternById(id: string): DiagnosticPattern | undefined;
|
|
292
|
+
|
|
293
|
+
/**
|
|
294
|
+
* Diagnostics Service
|
|
295
|
+
*
|
|
296
|
+
* Main service for physics compliance checking and issue detection.
|
|
297
|
+
*/
|
|
298
|
+
|
|
299
|
+
/**
|
|
300
|
+
* Create a diagnostics service
|
|
301
|
+
*/
|
|
302
|
+
declare function createDiagnosticsService(anchorClient?: unknown, config?: DiagnosticsConfig): DiagnosticsService;
|
|
303
|
+
/**
|
|
304
|
+
* Get the default diagnostics service
|
|
305
|
+
*/
|
|
306
|
+
declare function getDiagnosticsService(anchorClient?: unknown): DiagnosticsService;
|
|
307
|
+
/**
|
|
308
|
+
* Reset the default diagnostics service
|
|
309
|
+
*/
|
|
310
|
+
declare function resetDiagnosticsService(): void;
|
|
311
|
+
|
|
312
|
+
export { type AnimationCompliance, type BehavioralCompliance, type ComplianceResult, type DiagnosticIssue, type DiagnosticPattern, type DiagnosticResult, type DiagnosticsConfig, DiagnosticsError, DiagnosticsErrorCodes, type DiagnosticsService, type EffectType, type MaterialCompliance, PATTERNS, type PatternCategory, type PatternCause, type PatternMatchResult, type Severity, checkAnimationCompliance, checkBehavioralCompliance, checkCompliance, checkMaterialCompliance, complianceToIssues, createDiagnosticsService, detectEffect, getDiagnosticsService, getExpectedPhysics, getPatternById, getPatterns, getPatternsByCategory, isFullyCompliant, keywords, resetDiagnosticsService };
|