uilint-core 0.2.97 → 0.2.99
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/dist/{chunk-23BX6XC7.js → chunk-TNIFMF2P.js} +81 -2
- package/dist/chunk-TNIFMF2P.js.map +1 -0
- package/dist/index-K_PXN36M.d.ts +643 -0
- package/dist/index.d.ts +1 -593
- package/dist/index.js +7 -1
- package/dist/node.d.ts +3 -38
- package/dist/node.js +14 -51
- package/dist/node.js.map +1 -1
- package/package.json +1 -1
- package/dist/chunk-23BX6XC7.js.map +0 -1
|
@@ -0,0 +1,643 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Core types for UILint
|
|
3
|
+
*/
|
|
4
|
+
interface UILintIssue {
|
|
5
|
+
id: string;
|
|
6
|
+
type: "color" | "typography" | "spacing" | "component" | "responsive" | "accessibility";
|
|
7
|
+
message: string;
|
|
8
|
+
element?: string;
|
|
9
|
+
selector?: string;
|
|
10
|
+
currentValue?: string;
|
|
11
|
+
expectedValue?: string;
|
|
12
|
+
suggestion?: string;
|
|
13
|
+
}
|
|
14
|
+
interface StyleGuide {
|
|
15
|
+
colors: ColorRule[];
|
|
16
|
+
typography: TypographyRule[];
|
|
17
|
+
spacing: SpacingRule[];
|
|
18
|
+
components: ComponentRule[];
|
|
19
|
+
}
|
|
20
|
+
interface ColorRule {
|
|
21
|
+
name: string;
|
|
22
|
+
value: string;
|
|
23
|
+
usage: string;
|
|
24
|
+
}
|
|
25
|
+
interface TypographyRule {
|
|
26
|
+
element: string;
|
|
27
|
+
fontFamily?: string;
|
|
28
|
+
fontSize?: string;
|
|
29
|
+
fontWeight?: string;
|
|
30
|
+
lineHeight?: string;
|
|
31
|
+
}
|
|
32
|
+
interface SpacingRule {
|
|
33
|
+
name: string;
|
|
34
|
+
value: string;
|
|
35
|
+
}
|
|
36
|
+
interface ComponentRule {
|
|
37
|
+
name: string;
|
|
38
|
+
styles: string[];
|
|
39
|
+
}
|
|
40
|
+
interface ExtractedStyles {
|
|
41
|
+
colors: Map<string, number>;
|
|
42
|
+
fontSizes: Map<string, number>;
|
|
43
|
+
fontFamilies: Map<string, number>;
|
|
44
|
+
fontWeights: Map<string, number>;
|
|
45
|
+
spacing: Map<string, number>;
|
|
46
|
+
borderRadius: Map<string, number>;
|
|
47
|
+
}
|
|
48
|
+
interface SerializedStyles {
|
|
49
|
+
colors: Record<string, number>;
|
|
50
|
+
fontSizes: Record<string, number>;
|
|
51
|
+
fontFamilies: Record<string, number>;
|
|
52
|
+
fontWeights: Record<string, number>;
|
|
53
|
+
spacing: Record<string, number>;
|
|
54
|
+
borderRadius: Record<string, number>;
|
|
55
|
+
}
|
|
56
|
+
interface DOMSnapshot {
|
|
57
|
+
html: string;
|
|
58
|
+
styles: ExtractedStyles;
|
|
59
|
+
elementCount: number;
|
|
60
|
+
timestamp: number;
|
|
61
|
+
}
|
|
62
|
+
interface AnalysisResult {
|
|
63
|
+
issues: UILintIssue[];
|
|
64
|
+
suggestedStyleGuide?: string;
|
|
65
|
+
analysisTime: number;
|
|
66
|
+
}
|
|
67
|
+
/**
|
|
68
|
+
* Lightweight issue type used for per-source scanning (e.g. via data-loc).
|
|
69
|
+
* This intentionally differs from `UILintIssue` (which is for styleSummary analysis).
|
|
70
|
+
*/
|
|
71
|
+
interface UILintScanIssue {
|
|
72
|
+
/** Line number in the source file (1-based). */
|
|
73
|
+
line?: number;
|
|
74
|
+
/** Human-readable description of the issue. */
|
|
75
|
+
message: string;
|
|
76
|
+
/** Optional data-loc reference (format: "path:line:column") */
|
|
77
|
+
dataLoc?: string;
|
|
78
|
+
}
|
|
79
|
+
interface UILintSourceScanResult {
|
|
80
|
+
issues: UILintScanIssue[];
|
|
81
|
+
}
|
|
82
|
+
/**
|
|
83
|
+
* Represents an active generation span that can be ended with output data.
|
|
84
|
+
* Returned by onGenerationStart when instrumentation is enabled.
|
|
85
|
+
*/
|
|
86
|
+
interface InstrumentationSpan {
|
|
87
|
+
/** End the span with the generation output and optional usage metrics */
|
|
88
|
+
end: (output: string, usage?: {
|
|
89
|
+
promptTokens?: number;
|
|
90
|
+
completionTokens?: number;
|
|
91
|
+
totalTokens?: number;
|
|
92
|
+
error?: string;
|
|
93
|
+
}) => void;
|
|
94
|
+
}
|
|
95
|
+
/**
|
|
96
|
+
* Optional instrumentation callbacks for LLM observability.
|
|
97
|
+
* Allows plugging in any observability tool (Langfuse, OpenTelemetry, etc.)
|
|
98
|
+
* without adding hard dependencies to uilint-core.
|
|
99
|
+
*/
|
|
100
|
+
interface LLMInstrumentationCallbacks {
|
|
101
|
+
/**
|
|
102
|
+
* Called when an LLM generation starts.
|
|
103
|
+
* Return an InstrumentationSpan to track the generation, or void to skip.
|
|
104
|
+
*/
|
|
105
|
+
onGenerationStart?: (params: {
|
|
106
|
+
/** Operation name (e.g., "ollama-generate", "analyze-styles") */
|
|
107
|
+
name: string;
|
|
108
|
+
/** Model identifier */
|
|
109
|
+
model: string;
|
|
110
|
+
/** The prompt sent to the LLM */
|
|
111
|
+
prompt: string;
|
|
112
|
+
/** Optional metadata */
|
|
113
|
+
metadata?: Record<string, unknown>;
|
|
114
|
+
}) => InstrumentationSpan | void;
|
|
115
|
+
}
|
|
116
|
+
interface OllamaClientOptions {
|
|
117
|
+
baseUrl?: string;
|
|
118
|
+
model?: string;
|
|
119
|
+
timeout?: number;
|
|
120
|
+
/** Optional instrumentation callbacks for observability (Langfuse, OpenTelemetry, etc.) */
|
|
121
|
+
instrumentation?: LLMInstrumentationCallbacks;
|
|
122
|
+
}
|
|
123
|
+
type StreamProgressCallback = (latestLine: string, fullResponse: string,
|
|
124
|
+
/** The text delta just received (optional, for printing raw streamed output) */
|
|
125
|
+
delta?: string,
|
|
126
|
+
/**
|
|
127
|
+
* The "thinking" delta just received (optional, for models that support Ollama's `think`).
|
|
128
|
+
* For chat this comes from `chunk.message.thinking`; for generate this comes from `chunk.thinking`.
|
|
129
|
+
*/
|
|
130
|
+
thinkingDelta?: string) => void;
|
|
131
|
+
interface ExtractedStyleValues {
|
|
132
|
+
colors: string[];
|
|
133
|
+
fontSizes: string[];
|
|
134
|
+
fontFamilies: string[];
|
|
135
|
+
spacing: string[];
|
|
136
|
+
borderRadius: string[];
|
|
137
|
+
}
|
|
138
|
+
interface TailwindThemeTokens {
|
|
139
|
+
configPath: string;
|
|
140
|
+
colors: string[];
|
|
141
|
+
spacingKeys: string[];
|
|
142
|
+
borderRadiusKeys: string[];
|
|
143
|
+
fontFamilyKeys: string[];
|
|
144
|
+
fontSizeKeys: string[];
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
/**
|
|
148
|
+
* LLM prompt builders for UILint analysis
|
|
149
|
+
*/
|
|
150
|
+
/**
|
|
151
|
+
* Builds a prompt for style analysis
|
|
152
|
+
*/
|
|
153
|
+
declare function buildAnalysisPrompt(styleSummary: string, styleGuide: string | null): string;
|
|
154
|
+
interface BuildSourceAnalysisPromptOptions {
|
|
155
|
+
/**
|
|
156
|
+
* Optional filename/path for extra context in the prompt.
|
|
157
|
+
*/
|
|
158
|
+
filePath?: string;
|
|
159
|
+
/**
|
|
160
|
+
* Optional hint about language (e.g. tsx, jsx, html).
|
|
161
|
+
*/
|
|
162
|
+
languageHint?: string;
|
|
163
|
+
/**
|
|
164
|
+
* Optional additional context (e.g., Tailwind tokens, extracted utilities).
|
|
165
|
+
* Keep this concise; it's appended verbatim.
|
|
166
|
+
*/
|
|
167
|
+
extraContext?: string;
|
|
168
|
+
}
|
|
169
|
+
/**
|
|
170
|
+
* Builds a prompt for analyzing a raw source file/snippet (TSX/JSX/etc) directly,
|
|
171
|
+
* without attempting to parse it as HTML/DOM.
|
|
172
|
+
*/
|
|
173
|
+
declare function buildSourceAnalysisPrompt(source: string, styleGuide: string | null, options?: BuildSourceAnalysisPromptOptions): string;
|
|
174
|
+
interface BuildSourceScanPromptOptions {
|
|
175
|
+
/**
|
|
176
|
+
* Display filename/path for context in the prompt.
|
|
177
|
+
*/
|
|
178
|
+
filePath?: string;
|
|
179
|
+
/**
|
|
180
|
+
* Optional focus target for manual scan UX.
|
|
181
|
+
*/
|
|
182
|
+
componentName?: string;
|
|
183
|
+
componentLine?: number;
|
|
184
|
+
/**
|
|
185
|
+
* If true, the scan is for the selected element + children (UI text only).
|
|
186
|
+
*/
|
|
187
|
+
includeChildren?: boolean;
|
|
188
|
+
/**
|
|
189
|
+
* Optional list of data-loc values (format: "path:line:column") that the model MUST
|
|
190
|
+
* restrict issues to (so UI can highlight exactly).
|
|
191
|
+
*/
|
|
192
|
+
dataLocs?: string[];
|
|
193
|
+
}
|
|
194
|
+
/**
|
|
195
|
+
* Builds a prompt for scanning a source file/snippet for issues that can be mapped
|
|
196
|
+
* back to rendered DOM elements via `data-loc`.
|
|
197
|
+
*
|
|
198
|
+
* Response schema (JSON):
|
|
199
|
+
* { "issues": [{ "line"?: number, "message": string, "dataLoc"?: string }] }
|
|
200
|
+
*/
|
|
201
|
+
declare function buildSourceScanPrompt(sourceCode: string, styleGuide: string | null, options?: BuildSourceScanPromptOptions): string;
|
|
202
|
+
/**
|
|
203
|
+
* Builds a prompt for style guide generation
|
|
204
|
+
*/
|
|
205
|
+
declare function buildStyleGuidePrompt(styleSummary: string): string;
|
|
206
|
+
|
|
207
|
+
/**
|
|
208
|
+
* Ollama API client for LLM interactions
|
|
209
|
+
*/
|
|
210
|
+
|
|
211
|
+
declare class OllamaClient {
|
|
212
|
+
private baseUrl;
|
|
213
|
+
private model;
|
|
214
|
+
private timeout;
|
|
215
|
+
private instrumentation?;
|
|
216
|
+
constructor(options?: OllamaClientOptions);
|
|
217
|
+
/**
|
|
218
|
+
* Low-level completion API for custom prompts (used by installers/tools).
|
|
219
|
+
*
|
|
220
|
+
* When `json` is true, Ollama is requested to emit JSON (best-effort).
|
|
221
|
+
*/
|
|
222
|
+
complete(prompt: string, options?: {
|
|
223
|
+
json?: boolean;
|
|
224
|
+
stream?: boolean;
|
|
225
|
+
onProgress?: StreamProgressCallback;
|
|
226
|
+
}): Promise<string>;
|
|
227
|
+
/**
|
|
228
|
+
* Analyzes styles and returns issues
|
|
229
|
+
*/
|
|
230
|
+
analyzeStyles(styleSummary: string, styleGuide: string | null, onProgress?: StreamProgressCallback): Promise<AnalysisResult>;
|
|
231
|
+
/**
|
|
232
|
+
* Analyzes a raw source file/snippet (TSX/JSX/etc) directly and returns issues.
|
|
233
|
+
* This bypasses HTML/DOM parsing entirely.
|
|
234
|
+
*/
|
|
235
|
+
analyzeSource(source: string, styleGuide: string | null, onProgress?: StreamProgressCallback, options?: BuildSourceAnalysisPromptOptions): Promise<AnalysisResult>;
|
|
236
|
+
/**
|
|
237
|
+
* Generates a style guide from detected styles
|
|
238
|
+
*/
|
|
239
|
+
generateStyleGuide(styleSummary: string): Promise<string | null>;
|
|
240
|
+
/**
|
|
241
|
+
* Core generate method that calls Ollama API
|
|
242
|
+
*/
|
|
243
|
+
private generate;
|
|
244
|
+
/**
|
|
245
|
+
* Streaming generate method that calls Ollama API with streaming
|
|
246
|
+
* and reports progress via callback
|
|
247
|
+
*/
|
|
248
|
+
private generateStreaming;
|
|
249
|
+
/**
|
|
250
|
+
* Parses issues from LLM response
|
|
251
|
+
*/
|
|
252
|
+
private parseIssuesResponse;
|
|
253
|
+
/**
|
|
254
|
+
* Checks if Ollama is available
|
|
255
|
+
*/
|
|
256
|
+
isAvailable(): Promise<boolean>;
|
|
257
|
+
/**
|
|
258
|
+
* Gets the current model
|
|
259
|
+
*/
|
|
260
|
+
getModel(): string;
|
|
261
|
+
/**
|
|
262
|
+
* Sets the model
|
|
263
|
+
*/
|
|
264
|
+
setModel(model: string): void;
|
|
265
|
+
/**
|
|
266
|
+
* Sets instrumentation callbacks for observability.
|
|
267
|
+
* This allows configuring instrumentation after construction.
|
|
268
|
+
*/
|
|
269
|
+
setInstrumentation(instrumentation: LLMInstrumentationCallbacks | undefined): void;
|
|
270
|
+
/**
|
|
271
|
+
* Returns true if instrumentation is currently configured.
|
|
272
|
+
*/
|
|
273
|
+
hasInstrumentation(): boolean;
|
|
274
|
+
}
|
|
275
|
+
declare function getOllamaClient(options?: OllamaClientOptions): OllamaClient;
|
|
276
|
+
|
|
277
|
+
/**
|
|
278
|
+
* Single source of truth for Ollama defaults used across the monorepo.
|
|
279
|
+
*/
|
|
280
|
+
/**
|
|
281
|
+
* Default Ollama model used when none is provided.
|
|
282
|
+
*
|
|
283
|
+
* Note: This should match the model we recommend users `ollama pull`.
|
|
284
|
+
*/
|
|
285
|
+
declare const UILINT_DEFAULT_OLLAMA_MODEL = "qwen3-coder:30b";
|
|
286
|
+
|
|
287
|
+
interface FormatViolationsOptions {
|
|
288
|
+
/**
|
|
289
|
+
* Optional context label (e.g., filename) to include as a single header line.
|
|
290
|
+
* Keep this empty for the most minimal output.
|
|
291
|
+
*/
|
|
292
|
+
context?: string;
|
|
293
|
+
/**
|
|
294
|
+
* Include the trailing "consult the style guide" message.
|
|
295
|
+
* Defaults to true.
|
|
296
|
+
*/
|
|
297
|
+
includeFooter?: boolean;
|
|
298
|
+
/**
|
|
299
|
+
* Override the footer message.
|
|
300
|
+
*/
|
|
301
|
+
footerMessage?: string;
|
|
302
|
+
}
|
|
303
|
+
/**
|
|
304
|
+
* Ensures issues are safe/minimal to print or serialize:
|
|
305
|
+
* - drops `suggestion` (we only want violations)
|
|
306
|
+
* - trims string fields
|
|
307
|
+
*/
|
|
308
|
+
declare function sanitizeIssues(issues: UILintIssue[]): UILintIssue[];
|
|
309
|
+
/**
|
|
310
|
+
* Minimal human-readable rendering of violations.
|
|
311
|
+
* Intended for CLI/MCP text output.
|
|
312
|
+
*/
|
|
313
|
+
declare function formatViolationsText(issues: UILintIssue[], options?: FormatViolationsOptions): string;
|
|
314
|
+
|
|
315
|
+
/**
|
|
316
|
+
* Style extraction from DOM elements
|
|
317
|
+
*/
|
|
318
|
+
|
|
319
|
+
/**
|
|
320
|
+
* Extracts all computed styles from elements in the document
|
|
321
|
+
* Works in both browser and JSDOM environments
|
|
322
|
+
*/
|
|
323
|
+
declare function extractStyles(root: Element | Document, getComputedStyle: (el: Element) => CSSStyleDeclaration): ExtractedStyles;
|
|
324
|
+
/**
|
|
325
|
+
* Extracts styles from browser DOM (uses window.getComputedStyle)
|
|
326
|
+
*/
|
|
327
|
+
declare function extractStylesFromDOM(root?: Element | Document): ExtractedStyles;
|
|
328
|
+
/**
|
|
329
|
+
* Converts ExtractedStyles maps to plain objects for serialization
|
|
330
|
+
*/
|
|
331
|
+
declare function serializeStyles(styles: ExtractedStyles): SerializedStyles;
|
|
332
|
+
/**
|
|
333
|
+
* Converts SerializedStyles back to ExtractedStyles
|
|
334
|
+
*/
|
|
335
|
+
declare function deserializeStyles(serialized: SerializedStyles): ExtractedStyles;
|
|
336
|
+
/**
|
|
337
|
+
* Creates a summary of extracted styles for LLM analysis
|
|
338
|
+
*/
|
|
339
|
+
declare function createStyleSummary(styles: ExtractedStyles, options?: CreateStyleSummaryOptions): string;
|
|
340
|
+
interface CreateStyleSummaryOptions {
|
|
341
|
+
/**
|
|
342
|
+
* Optional HTML/TSX-ish string used to extract utility classes (Tailwind etc).
|
|
343
|
+
*/
|
|
344
|
+
html?: string;
|
|
345
|
+
/**
|
|
346
|
+
* Optional Tailwind theme tokens (typically from tailwind.config.*).
|
|
347
|
+
*/
|
|
348
|
+
tailwindTheme?: TailwindThemeTokens | null;
|
|
349
|
+
}
|
|
350
|
+
/**
|
|
351
|
+
* Truncates HTML to a maximum length
|
|
352
|
+
*/
|
|
353
|
+
declare function truncateHTML(html: string, maxLength?: number): string;
|
|
354
|
+
|
|
355
|
+
/**
|
|
356
|
+
* Parse Markdown style guides into structured data
|
|
357
|
+
*/
|
|
358
|
+
|
|
359
|
+
/**
|
|
360
|
+
* Parses a Markdown style guide into a structured object
|
|
361
|
+
*/
|
|
362
|
+
declare function parseStyleGuide(markdown: string): StyleGuide;
|
|
363
|
+
/**
|
|
364
|
+
* Parses sections from a Markdown style guide (simpler format)
|
|
365
|
+
*/
|
|
366
|
+
declare function parseStyleGuideSections(content: string): Record<string, string>;
|
|
367
|
+
/**
|
|
368
|
+
* Extracts specific values from the style guide
|
|
369
|
+
*/
|
|
370
|
+
declare function extractStyleValues(content: string): ExtractedStyleValues;
|
|
371
|
+
interface TailwindAllowlist {
|
|
372
|
+
allowAnyColor: boolean;
|
|
373
|
+
allowStandardSpacing: boolean;
|
|
374
|
+
allowedTailwindColors: Set<string>;
|
|
375
|
+
allowedUtilities: Set<string>;
|
|
376
|
+
allowedSpacingKeys: Set<string>;
|
|
377
|
+
allowedBorderRadiusKeys: Set<string>;
|
|
378
|
+
allowedFontSizeKeys: Set<string>;
|
|
379
|
+
allowedFontFamilyKeys: Set<string>;
|
|
380
|
+
}
|
|
381
|
+
/**
|
|
382
|
+
* Extract Tailwind / utility-class allowlist configuration from a style guide.
|
|
383
|
+
*
|
|
384
|
+
* Expected formats:
|
|
385
|
+
* - A JSON code block inside a "## Tailwind" section (preferred; produced by UILint)
|
|
386
|
+
* - Fallback: inline backticked utilities within the Tailwind section
|
|
387
|
+
*/
|
|
388
|
+
declare function extractTailwindAllowlist(content: string): TailwindAllowlist;
|
|
389
|
+
|
|
390
|
+
/**
|
|
391
|
+
* Generate Markdown style guides from extracted styles
|
|
392
|
+
*/
|
|
393
|
+
|
|
394
|
+
/**
|
|
395
|
+
* Generates a Markdown style guide from extracted styles
|
|
396
|
+
*/
|
|
397
|
+
interface GenerateStyleGuideOptions {
|
|
398
|
+
/**
|
|
399
|
+
* Optional HTML/TSX-ish string used to extract utility classes (Tailwind etc).
|
|
400
|
+
*/
|
|
401
|
+
html?: string;
|
|
402
|
+
/**
|
|
403
|
+
* Optional Tailwind theme tokens (typically from tailwind.config.*).
|
|
404
|
+
*/
|
|
405
|
+
tailwindTheme?: TailwindThemeTokens | null;
|
|
406
|
+
}
|
|
407
|
+
declare function generateStyleGuideFromStyles(styles: ExtractedStyles, options?: GenerateStyleGuideOptions): string;
|
|
408
|
+
/**
|
|
409
|
+
* Converts a StyleGuide object back to Markdown
|
|
410
|
+
*/
|
|
411
|
+
declare function styleGuideToMarkdown(guide: StyleGuide): string;
|
|
412
|
+
|
|
413
|
+
/**
|
|
414
|
+
* Style guide schema and utilities
|
|
415
|
+
*/
|
|
416
|
+
|
|
417
|
+
/**
|
|
418
|
+
* Creates an empty style guide structure
|
|
419
|
+
*/
|
|
420
|
+
declare function createEmptyStyleGuide(): StyleGuide;
|
|
421
|
+
/**
|
|
422
|
+
* Validates a style guide object
|
|
423
|
+
*/
|
|
424
|
+
declare function validateStyleGuide(guide: unknown): guide is StyleGuide;
|
|
425
|
+
/**
|
|
426
|
+
* Merges detected styles into an existing style guide
|
|
427
|
+
*/
|
|
428
|
+
declare function mergeStyleGuides(existing: StyleGuide, detected: Partial<StyleGuide>): StyleGuide;
|
|
429
|
+
/**
|
|
430
|
+
* Creates a color rule
|
|
431
|
+
*/
|
|
432
|
+
declare function createColorRule(name: string, value: string, usage?: string): ColorRule;
|
|
433
|
+
/**
|
|
434
|
+
* Creates a typography rule
|
|
435
|
+
*/
|
|
436
|
+
declare function createTypographyRule(element: string, options?: Partial<Omit<TypographyRule, "element">>): TypographyRule;
|
|
437
|
+
/**
|
|
438
|
+
* Creates a spacing rule
|
|
439
|
+
*/
|
|
440
|
+
declare function createSpacingRule(name: string, value: string): SpacingRule;
|
|
441
|
+
/**
|
|
442
|
+
* Creates a component rule
|
|
443
|
+
*/
|
|
444
|
+
declare function createComponentRule(name: string, styles: string[]): ComponentRule;
|
|
445
|
+
|
|
446
|
+
/**
|
|
447
|
+
* Types for UI consistency analysis
|
|
448
|
+
*/
|
|
449
|
+
/**
|
|
450
|
+
* Relevant computed styles for consistency checking
|
|
451
|
+
*/
|
|
452
|
+
interface StyleSnapshot {
|
|
453
|
+
fontSize?: string;
|
|
454
|
+
fontWeight?: string;
|
|
455
|
+
color?: string;
|
|
456
|
+
backgroundColor?: string;
|
|
457
|
+
padding?: string;
|
|
458
|
+
borderRadius?: string;
|
|
459
|
+
border?: string;
|
|
460
|
+
boxShadow?: string;
|
|
461
|
+
gap?: string;
|
|
462
|
+
}
|
|
463
|
+
/**
|
|
464
|
+
* Element roles for grouping and analysis
|
|
465
|
+
*/
|
|
466
|
+
type ElementRole = "button" | "link" | "heading" | "input" | "card" | "container" | "text" | "other";
|
|
467
|
+
/**
|
|
468
|
+
* Snapshot of a single DOM element with its styles and context
|
|
469
|
+
*/
|
|
470
|
+
interface ElementSnapshot {
|
|
471
|
+
/** Unique ID mapping to data-elements attribute, e.g. "el-47" */
|
|
472
|
+
id: string;
|
|
473
|
+
/** HTML tag name */
|
|
474
|
+
tag: string;
|
|
475
|
+
/** Inferred semantic role */
|
|
476
|
+
role: ElementRole;
|
|
477
|
+
/** Truncated innerText (max 50 chars) */
|
|
478
|
+
text: string;
|
|
479
|
+
/** From data-ui-component attribute if present */
|
|
480
|
+
component?: string;
|
|
481
|
+
/** Ancestor context like "header > nav" */
|
|
482
|
+
context: string;
|
|
483
|
+
/** Relevant computed styles */
|
|
484
|
+
styles: StyleSnapshot;
|
|
485
|
+
/** Element dimensions */
|
|
486
|
+
rect: {
|
|
487
|
+
width: number;
|
|
488
|
+
height: number;
|
|
489
|
+
};
|
|
490
|
+
}
|
|
491
|
+
/**
|
|
492
|
+
* Elements grouped by role for batch analysis
|
|
493
|
+
*/
|
|
494
|
+
interface GroupedSnapshot {
|
|
495
|
+
buttons: ElementSnapshot[];
|
|
496
|
+
headings: ElementSnapshot[];
|
|
497
|
+
cards: ElementSnapshot[];
|
|
498
|
+
links: ElementSnapshot[];
|
|
499
|
+
inputs: ElementSnapshot[];
|
|
500
|
+
containers: ElementSnapshot[];
|
|
501
|
+
}
|
|
502
|
+
/**
|
|
503
|
+
* Violation categories detected by consistency analysis
|
|
504
|
+
*/
|
|
505
|
+
type ViolationCategory = "spacing" | "color" | "typography" | "sizing" | "borders" | "shadows";
|
|
506
|
+
/**
|
|
507
|
+
* Severity levels for violations
|
|
508
|
+
*/
|
|
509
|
+
type ViolationSeverity = "error" | "warning" | "info";
|
|
510
|
+
/**
|
|
511
|
+
* A consistency violation detected between similar elements
|
|
512
|
+
*/
|
|
513
|
+
interface Violation {
|
|
514
|
+
/** Element IDs involved in the violation, e.g. ["el-3", "el-7"] */
|
|
515
|
+
elementIds: string[];
|
|
516
|
+
/** Category of the inconsistency */
|
|
517
|
+
category: ViolationCategory;
|
|
518
|
+
/** Severity level */
|
|
519
|
+
severity: ViolationSeverity;
|
|
520
|
+
/** Human-readable description */
|
|
521
|
+
message: string;
|
|
522
|
+
/** Detailed information about the violation */
|
|
523
|
+
details: {
|
|
524
|
+
/** The CSS property that differs */
|
|
525
|
+
property: string;
|
|
526
|
+
/** The differing values found */
|
|
527
|
+
values: string[];
|
|
528
|
+
/** Optional suggestion for fixing */
|
|
529
|
+
suggestion?: string;
|
|
530
|
+
};
|
|
531
|
+
}
|
|
532
|
+
/**
|
|
533
|
+
* Result of consistency analysis
|
|
534
|
+
*/
|
|
535
|
+
interface ConsistencyResult {
|
|
536
|
+
violations: Violation[];
|
|
537
|
+
/** Number of elements analyzed */
|
|
538
|
+
elementCount: number;
|
|
539
|
+
/** Time taken in milliseconds */
|
|
540
|
+
analysisTime: number;
|
|
541
|
+
}
|
|
542
|
+
|
|
543
|
+
/**
|
|
544
|
+
* LLM prompt builders for UI consistency analysis
|
|
545
|
+
*/
|
|
546
|
+
|
|
547
|
+
/**
|
|
548
|
+
* Builds a single prompt for analyzing ALL element groups
|
|
549
|
+
* This reduces LLM calls to 1 for better performance
|
|
550
|
+
*/
|
|
551
|
+
declare function buildConsistencyPrompt(snapshot: GroupedSnapshot): string;
|
|
552
|
+
/**
|
|
553
|
+
* Counts total elements across all groups
|
|
554
|
+
*/
|
|
555
|
+
declare function countElements(snapshot: GroupedSnapshot): number;
|
|
556
|
+
/**
|
|
557
|
+
* Checks if a snapshot has any groups worth analyzing (2+ elements)
|
|
558
|
+
*/
|
|
559
|
+
declare function hasAnalyzableGroups(snapshot: GroupedSnapshot): boolean;
|
|
560
|
+
|
|
561
|
+
/**
|
|
562
|
+
* Consistency analysis logic - shared between CLI and API routes
|
|
563
|
+
*/
|
|
564
|
+
|
|
565
|
+
/**
|
|
566
|
+
* Parses and validates a GroupedSnapshot from JSON string
|
|
567
|
+
*/
|
|
568
|
+
declare function parseGroupedSnapshot(json: string): GroupedSnapshot | null;
|
|
569
|
+
/**
|
|
570
|
+
* Parses violations from LLM response with defensive handling
|
|
571
|
+
*/
|
|
572
|
+
declare function parseViolationsResponse(response: string): Violation[];
|
|
573
|
+
/**
|
|
574
|
+
* Validates and filters violations to ensure correct structure
|
|
575
|
+
*/
|
|
576
|
+
declare function validateViolations(violations: unknown[]): Violation[];
|
|
577
|
+
interface AnalyzeConsistencyOptions {
|
|
578
|
+
/** Ollama model to use */
|
|
579
|
+
model?: string;
|
|
580
|
+
/** Ollama base URL */
|
|
581
|
+
baseUrl?: string;
|
|
582
|
+
}
|
|
583
|
+
/**
|
|
584
|
+
* Analyzes a grouped snapshot for UI consistency violations
|
|
585
|
+
* This is the main entry point for consistency analysis
|
|
586
|
+
*/
|
|
587
|
+
declare function analyzeConsistency(snapshot: GroupedSnapshot, options?: AnalyzeConsistencyOptions): Promise<ConsistencyResult>;
|
|
588
|
+
/**
|
|
589
|
+
* Formats violations for plain text output
|
|
590
|
+
*/
|
|
591
|
+
declare function formatConsistencyViolations(violations: Violation[]): string;
|
|
592
|
+
|
|
593
|
+
/**
|
|
594
|
+
* Shared logger for UILint packages
|
|
595
|
+
* Outputs styled messages to stderr to avoid interfering with stdout
|
|
596
|
+
*/
|
|
597
|
+
|
|
598
|
+
/**
|
|
599
|
+
* Log a message to the console (silent during tests).
|
|
600
|
+
* Use this for development/debugging logs that shouldn't appear in test output.
|
|
601
|
+
*/
|
|
602
|
+
declare function devLog(...args: unknown[]): void;
|
|
603
|
+
/**
|
|
604
|
+
* Log a warning to the console (silent during tests).
|
|
605
|
+
* Use this for development warnings that shouldn't appear in test output.
|
|
606
|
+
*/
|
|
607
|
+
declare function devWarn(...args: unknown[]): void;
|
|
608
|
+
/**
|
|
609
|
+
* Log an error to the console (silent during tests).
|
|
610
|
+
* Use this for development errors that shouldn't appear in test output.
|
|
611
|
+
*/
|
|
612
|
+
declare function devError(...args: unknown[]): void;
|
|
613
|
+
/**
|
|
614
|
+
* Log an info message to stderr
|
|
615
|
+
*/
|
|
616
|
+
declare function logInfo(message: string): void;
|
|
617
|
+
/**
|
|
618
|
+
* Log a success message to stderr
|
|
619
|
+
*/
|
|
620
|
+
declare function logSuccess(message: string): void;
|
|
621
|
+
/**
|
|
622
|
+
* Log a warning message to stderr
|
|
623
|
+
*/
|
|
624
|
+
declare function logWarning(message: string): void;
|
|
625
|
+
/**
|
|
626
|
+
* Log an error message to stderr
|
|
627
|
+
*/
|
|
628
|
+
declare function logError(message: string): void;
|
|
629
|
+
/**
|
|
630
|
+
* Log a debug message to stderr (dimmed)
|
|
631
|
+
*/
|
|
632
|
+
declare function logDebug(message: string): void;
|
|
633
|
+
/**
|
|
634
|
+
* Create a progress logger that updates the same line
|
|
635
|
+
* Returns methods to update and finish the progress
|
|
636
|
+
*/
|
|
637
|
+
declare function createProgress(initialMessage: string): {
|
|
638
|
+
update: (message: string) => void;
|
|
639
|
+
succeed: (message: string) => void;
|
|
640
|
+
fail: (message: string) => void;
|
|
641
|
+
};
|
|
642
|
+
|
|
643
|
+
export { type ElementRole as $, type AnalysisResult as A, deserializeStyles as B, type ColorRule as C, type DOMSnapshot as D, type ExtractedStyles as E, createStyleSummary as F, truncateHTML as G, parseStyleGuide as H, type InstrumentationSpan as I, parseStyleGuideSections as J, extractStyleValues as K, type LLMInstrumentationCallbacks as L, extractTailwindAllowlist as M, generateStyleGuideFromStyles as N, type OllamaClientOptions as O, styleGuideToMarkdown as P, createEmptyStyleGuide as Q, validateStyleGuide as R, type StreamProgressCallback as S, type TailwindThemeTokens as T, type UILintIssue as U, mergeStyleGuides as V, createColorRule as W, createTypographyRule as X, createSpacingRule as Y, createComponentRule as Z, type StyleSnapshot as _, logSuccess as a, type ElementSnapshot as a0, type GroupedSnapshot as a1, type ViolationCategory as a2, type ViolationSeverity as a3, type Violation as a4, type ConsistencyResult as a5, type AnalyzeConsistencyOptions as a6, buildConsistencyPrompt as a7, countElements as a8, hasAnalyzableGroups as a9, parseGroupedSnapshot as aa, parseViolationsResponse as ab, validateViolations as ac, analyzeConsistency as ad, formatConsistencyViolations as ae, devLog as af, devWarn as ag, devError as ah, logWarning as b, logError as c, logDebug as d, createProgress as e, type UILintScanIssue as f, type UILintSourceScanResult as g, type StyleGuide as h, type TypographyRule as i, type SpacingRule as j, type ComponentRule as k, logInfo as l, type SerializedStyles as m, type ExtractedStyleValues as n, OllamaClient as o, getOllamaClient as p, UILINT_DEFAULT_OLLAMA_MODEL as q, buildAnalysisPrompt as r, buildSourceAnalysisPrompt as s, buildSourceScanPrompt as t, buildStyleGuidePrompt as u, formatViolationsText as v, sanitizeIssues as w, extractStyles as x, extractStylesFromDOM as y, serializeStyles as z };
|