@dcoder-x/plugin-shared 0.1.5 → 0.1.6

package/dist/extractors/ComponentExtractor.js

@@ -271,7 +271,7 @@ class ComponentExtractor {
                     return;
                 const staticProps = extractStaticProps(nodePath.node.attributes);
                 const nearbyText = extractNearbyText(nodePath);
-                const label = deriveLabel(staticProps, nearbyText) ?? undefined;
+                const label = deriveLabel(tagName, staticProps, nearbyText) ?? undefined;
                 const componentName = (0, IdStrategy_1.findEnclosingComponentName)(nodePath) ?? undefined;
                 elements.push({
                     tag: tagName,
@@ -380,7 +380,16 @@ function extractTextFromChildren(children, depth) {
     }
     return texts.filter(Boolean);
 }
-function deriveLabel(props, nearbyText) {
+function deriveLabel(tag, props, nearbyText) {
+    // Forms: child text is a concatenation of every field label + button inside the form.
+    // That is not a useful description. Use aria-label if present, otherwise take only
+    // the last short text node (typically the submit button label).
+    if (tag === 'form') {
+        if (props['aria-label'])
+            return props['aria-label'];
+        const lastShort = [...nearbyText].reverse().find((t) => t.length >= 2 && t.length <= 30);
+        return lastShort || null;
+    }
     if (props['aria-label'])
         return props['aria-label'];
     if (props['title'])

package/dist/extractors/FlowInferrer.d.ts

@@ -7,7 +7,25 @@ export declare class FlowInferrer {
     infer(): InferredFlow[];
     private buildEdgeGraph;
     private detectLinearFlows;
+    /**
+     * Fix 3b: A coherent chain stays within the same top-level route domain.
+     * A chain that jumps from /auth/* to / or from /dashboard/* to /auth/signup
+     * is an artifact of footer/layout navigation links, not a real user flow.
+     */
+    private isCoherentChain;
     private detectInteractionFlows;
     private buildChain;
     private generateIntentPatterns;
+    /**
+     * Returns true if a string is a usable user intent phrase.
+     * Rejects blocklisted words, PascalCase component names, very short strings,
+     * and URL-like strings.
+     */
+    private isValidIntentPattern;
+    /**
+     * Fix 4: Remove intent patterns that appear across more than 30% of all flows.
+     * These are structural navigation phrases (sidebar, footer links) that ended up
+     * attached to many unrelated flows rather than genuine user intents.
+     */
+    private deduplicateCrossFlowNoise;
 }

package/dist/extractors/FlowInferrer.js

@@ -29,6 +29,13 @@ const SEMANTIC_INTENT_PATTERNS = {
     'workflows': ['workflows', 'manage workflows'],
     'invite': ['accept invite', 'join team'],
 };
+// Fix 4: words that are never meaningful user intent phrases
+const INTENT_BLOCKLIST = new Set([
+    'back', 'next', 'continue', 'click', 'button', 'here', 'more',
+    'loader2', 'loader', 'spinner', 'close', 'x', 'menu', 'open',
+    'cancel', 'ok', 'yes', 'no', 'loading', 'view all', 'learn more',
+    'read more', 'see more', 'link', 'skip', 'done', 'go',
+]);
 class FlowInferrer {
     constructor(routes, elements, components) {
         this.routes = routes;
@@ -39,34 +46,39 @@ class FlowInferrer {
         const edges = this.buildEdgeGraph();
         const routeFlows = this.detectLinearFlows(edges);
         const interactionFlows = this.detectInteractionFlows();
-        return [...routeFlows, ...interactionFlows];
+        const combined = [...routeFlows, ...interactionFlows];
+        // Fix 4: remove patterns that appear in too many flows — they are structural
+        // navigation chrome (sidebars, footers) rather than user intent signals
+        return this.deduplicateCrossFlowNoise(combined);
     }
+    // ---------------------------------------------------------------------------
+    // Edge graph
+    // ---------------------------------------------------------------------------
     buildEdgeGraph() {
         const edges = [];
         const routePaths = new Set(this.routes.map((r) => r.path));
         for (const el of this.elements) {
-            // Include both native <a> tags and navigation components (Link, NavLink)
-            const isNav = el.tag === 'a' ||
-                el.isNavigationLink === true;
+            const isNav = el.tag === 'a' || el.isNavigationLink === true;
             const href = el.staticProps['href'] || el.staticProps['to'];
             if (!isNav || !href)
                 continue;
-            // Only build edges to known internal routes
             if (!routePaths.has(href))
                 continue;
             const triggerText = el.staticProps['aria-label'] ||
                 el.label ||
                 el.nearbyText[0] ||
                 'link';
-            edges.push({
-                from: el.route,
-                to: href,
-                trigger: triggerText,
-                confidence: 0.85,
-            });
+            // Fix 3a: demote confidence for elements from layout/footer/header files.
+            // These links appear on every page and corrupt flow chains when followed.
+            const isLayoutSource = /footer|layout|header|navbar|sidebar|navigation/i.test(el.filePath || '');
+            const confidence = isLayoutSource ? 0.3 : 0.85;
+            edges.push({ from: el.route, to: href, trigger: triggerText, confidence });
         }
         return edges;
     }
+    // ---------------------------------------------------------------------------
+    // Linear flow detection
+    // ---------------------------------------------------------------------------
     detectLinearFlows(edges) {
         const adjacency = new Map();
         for (const edge of edges) {
@@ -80,12 +92,11 @@ class FlowInferrer {
             if (visited.has(route.path))
                 continue;
             const chain = this.buildChain(route.path, adjacency, new Set());
-            if (chain.length >= 2) {
+            if (chain.length >= 2 && this.isCoherentChain(chain)) {
                 const chainEdges = edges.filter((e) => {
                     const s = new Set(chain);
                     return s.has(e.from) && s.has(e.to);
                 });
-                const intentPatterns = this.generateIntentPatterns(chain, chainEdges);
                 flows.push({
                     id: `flow_${flows.length + 1}`,
                     name: chain
@@ -94,20 +105,32 @@ class FlowInferrer {
                     page: chain[0],
                     steps: chain,
                     edges: chainEdges,
-                    intentPatterns,
+                    intentPatterns: this.generateIntentPatterns(chain, chainEdges),
                 });
                 chain.forEach((p) => visited.add(p));
             }
         }
         return flows;
     }
+    /**
+     * Fix 3b: A coherent chain stays within the same top-level route domain.
+     * A chain that jumps from /auth/* to / or from /dashboard/* to /auth/signup
+     * is an artifact of footer/layout navigation links, not a real user flow.
+     */
+    isCoherentChain(chain) {
+        const firstSegment = (p) => p.split('/').filter(Boolean)[0] ?? 'root';
+        const domain = firstSegment(chain[0]);
+        return chain.every((r) => firstSegment(r) === domain);
+    }
+    // ---------------------------------------------------------------------------
+    // Interaction flow detection
+    // ---------------------------------------------------------------------------
     detectInteractionFlows() {
         if (!this.components || this.components.length === 0)
             return [];
         const flows = [];
         for (const component of this.components) {
             for (const interaction of component.interactions || []) {
-                // Only emit flows for interactions with a meaningful wait strategy
                 if (!interaction.trigger?.event)
                     continue;
                 if (!interaction.effect || interaction.effect.waitStrategy === 'none')
@@ -138,6 +161,9 @@ class FlowInferrer {
         }
         return flows;
     }
+    // ---------------------------------------------------------------------------
+    // Chain builder
+    // ---------------------------------------------------------------------------
     buildChain(start, adjacency, seen) {
         if (seen.has(start))
             return [];
@@ -148,6 +174,9 @@ class FlowInferrer {
         const best = [...next].sort((a, b) => b.confidence - a.confidence)[0];
         return [start, ...this.buildChain(best.to, adjacency, seen)];
     }
+    // ---------------------------------------------------------------------------
+    // Intent pattern generation (Fix 4)
+    // ---------------------------------------------------------------------------
     generateIntentPatterns(chain, edges) {
         const patterns = new Set();
         // 1. Route-segment semantic lookup
@@ -160,14 +189,52 @@ class FlowInferrer {
                     known.forEach((p) => patterns.add(p));
             }
         }
-        // 2. Link/button trigger text from the edges themselves
+        // 2. Link/button trigger text from the edges — apply noise filter
         for (const edge of edges) {
             const trigger = edge.trigger?.trim();
-            if (trigger && trigger !== 'link' && trigger.length > 2) {
+            if (trigger && this.isValidIntentPattern(trigger)) {
                 patterns.add(trigger.toLowerCase());
             }
         }
         return Array.from(patterns).filter(Boolean);
     }
+    /**
+     * Returns true if a string is a usable user intent phrase.
+     * Rejects blocklisted words, PascalCase component names, very short strings,
+     * and URL-like strings.
+     */
+    isValidIntentPattern(pattern) {
+        if (!pattern || pattern.length < 4)
+            return false;
+        const lower = pattern.toLowerCase();
+        if (INTENT_BLOCKLIST.has(lower))
+            return false;
+        // Reject PascalCase strings — these are component names leaking through
+        if (/^[A-Z][a-zA-Z0-9]+$/.test(pattern))
+            return false;
+        // Reject paths and URLs
+        if (pattern.startsWith('/') || pattern.startsWith('http'))
+            return false;
+        return true;
+    }
+    /**
+     * Fix 4: Remove intent patterns that appear across more than 30% of all flows.
+     * These are structural navigation phrases (sidebar, footer links) that ended up
+     * attached to many unrelated flows rather than genuine user intents.
+     */
+    deduplicateCrossFlowNoise(flows) {
+        if (flows.length === 0)
+            return flows;
+        const threshold = Math.max(3, Math.ceil(flows.length * 0.3));
+        const counts = new Map();
+        flows.forEach((f) => (f.intentPatterns ?? []).forEach((p) => counts.set(p, (counts.get(p) ?? 0) + 1)));
+        const globalNoise = new Set([...counts.entries()].filter(([, n]) => n > threshold).map(([p]) => p));
+        if (globalNoise.size === 0)
+            return flows;
+        return flows.map((f) => ({
+            ...f,
+            intentPatterns: (f.intentPatterns ?? []).filter((p) => !globalNoise.has(p)),
+        }));
+    }
 }
 exports.FlowInferrer = FlowInferrer;

package/dist/extractors/SelectorGenerator.d.ts

@@ -1,10 +1,6 @@
 import type { DiscoveredElement, ElementWithSelectors } from '../types';
+import type { InjectedEntry } from '../injection/ClippyIdInjector';
 export declare class SelectorGenerator {
-    generate(elements: DiscoveredElement[], injectedMap?: Record<string, Array<{
-        clippyId: string;
-        component: string;
-        tag: string;
-        line: number;
-    }>>): ElementWithSelectors[];
+    generate(elements: DiscoveredElement[], injectedMap?: Record<string, InjectedEntry[]>): ElementWithSelectors[];
     private generateForElement;
 }

package/dist/extractors/SelectorGenerator.js

@@ -16,14 +16,19 @@ class SelectorGenerator {
             if (injectedMap && el.filePath) {
                 const entries = injectedMap[el.filePath];
                 if (entries && entries.length) {
-                    // Prefer exact line match when available
-                    let match = null;
-                    if (el.loc && el.loc.line) {
-                        match = entries.find((e) => e.line === el.loc.line);
+                    const elLine = el.loc?.line;
+                    const elLabel = el.label;
+                    // 1. Exact line match — most reliable
+                    let match = elLine ? entries.find((e) => e.line === elLine) : null;
+                    // 2. Label + tag match — handles multiple same-tag elements in one file
+                    // (e.g. two <button> tags where line lookup fails due to AST offset)
+                    if (!match && elLabel) {
+                        match = entries.find((e) => e.tag === el.tag && e.label === elLabel) ?? null;
                     }
-                    // Fallback to tag/component match
+                    // 3. Tag-only fallback — last resort, may pick the wrong element when
+                    // multiple same-tag elements exist but is better than no clippy_id at all
                     if (!match) {
-                        match = entries.find((e) => e.tag === el.tag);
+                        match = entries.find((e) => e.tag === el.tag) ?? null;
                     }
                     if (match) {
                         candidates.push({

package/dist/injection/ClippyIdInjector.js

@@ -49,7 +49,7 @@ function injectClippyIds(source, filePath, routePath) {
             }
             const line = opening.loc?.start.line ?? 0;
             // Extract visible label text from element children for ID enrichment
-            const labelText = extractLabelFromOpeningElement(path, attrs);
+            const labelText = extractLabelFromOpeningElement(path, attrs, tagName);
             const clippyId = (0, IdStrategy_1.deriveClippyId)(componentName, tagName, line, routePath, labelText ?? undefined);
             const componentAttr = (0, HtmlTagGuards_1.hasAttribute)(attrs, 'data-clippy-component')
                 ? ''
@@ -77,8 +77,10 @@ function injectClippyIds(source, filePath, routePath) {
 /**
  * Extract a usable label from the element's attributes and children.
  * Priority: aria-label > title > visible text content > placeholder > name.
+ * For form elements: only aria-label or the last short text (submit button),
+ * never the full concatenation of all child field labels.
  */
-function extractLabelFromOpeningElement(path, attrs) {
+function extractLabelFromOpeningElement(path, attrs, tagName) {
     // Check attributes first — fastest path
     for (const attr of attrs) {
         if (attr.type !== 'JSXAttribute')
@@ -96,11 +98,17 @@ function extractLabelFromOpeningElement(path, attrs) {
     const parent = path.parentPath?.node;
     if (parent?.children) {
         const text = extractTextFromChildren(parent.children, 0);
+        if (tagName === 'form') {
+            // Forms: only use the last short text node (submit button label), not the full
+            // concatenation of every field label inside the form.
+            const lastShort = [...text].reverse().find((t) => t.length >= 2 && t.length <= 30);
+            return lastShort || null;
+        }
         const joined = text.join(' ').trim();
         if (joined && joined.length <= 60) {
             const sanitized = (0, IdStrategy_1.sanitizeLabelForId)(joined);
             if (sanitized)
-                return joined; // return raw joined text; sanitization happens in deriveClippyId
+                return joined;
         }
     }
     // Fallback to placeholder / name for inputs

package/dist/upload/PackageBuilder.d.ts

@@ -3,6 +3,7 @@ export declare class PackageBuilder {
     private version;
     buildPackage(data: Omit<KnowledgePackage, 'generatedAt'>): KnowledgePackage;
     buildArtifacts(data: {
+        projectRoot?: string;
         buildId: string;
         bundler: 'webpack' | 'vite';
         routes: DiscoveredRoute[];
@@ -11,6 +12,7 @@ export declare class PackageBuilder {
         components?: PolicyComponent[];
     }): PolicyArtifacts;
     buildPolicyDocument(data: {
+        projectRoot?: string;
         buildId: string;
         generatedAt: string;
         bundler: 'webpack' | 'vite';
@@ -26,13 +28,21 @@ export declare class PackageBuilder {
     }): SelectorManifest;
     build(data: Omit<KnowledgePackage, 'generatedAt'>): Buffer;
     buildArtifactsBuffer(artifacts: PolicyArtifacts): Buffer;
+    /**
+     * Compute a fallback project root from the common ancestor of route file paths.
+     * Used only when the adapter does not provide an explicit projectRoot.
+     */
     private inferProjectRoot;
     private normalizePath;
+    /**
+     * Remove design-system primitives and other shared components that carry no
+     * state or interaction data. Normalises filePaths against the project root.
+     */
+    private filterMeaningfulComponents;
     private toPolicySelectors;
     private toPolicyComponents;
     private toPolicyFlows;
     private deriveComponentName;
     private deriveStableId;
     private extractClippyIdFromSelector;
-    private simpleHash;
 }

package/dist/upload/PackageBuilder.js

@@ -40,13 +40,20 @@ class PackageBuilder {
         };
     }
     buildPolicyDocument(data) {
-        const projectRoot = this.inferProjectRoot(data.routes);
+        // Use the adapter-provided project root (most reliable).
+        // Fall back to computing the common ancestor of route paths only when unavailable.
+        const projectRoot = data.projectRoot || this.inferProjectRoot(data.routes);
         const normalizedRoutes = data.routes.map((r) => ({
             ...r,
             filePath: this.normalizePath(r.filePath, projectRoot),
             layout: r.layout ? this.normalizePath(r.layout, projectRoot) : null,
         }));
         const policySelectors = this.toPolicySelectors(data.selectors, projectRoot);
+        // Fix 2: only keep components that carry meaningful data (state or interactions).
+        // Pure design-system primitives (Button, Card, Input, etc.) with empty arrays
+        // are excluded — they bloat the policy without adding actionable information.
+        const rawComponents = data.components ?? this.toPolicyComponents(data.selectors, projectRoot);
+        const meaningfulComponents = this.filterMeaningfulComponents(rawComponents, projectRoot);
         return {
             version: this.version,
             buildId: data.buildId,
@@ -54,7 +61,7 @@ class PackageBuilder {
             bundler: data.bundler,
             routes: normalizedRoutes,
             selectors: policySelectors,
-            components: data.components ?? this.toPolicyComponents(data.selectors),
+            components: meaningfulComponents,
             flows: this.toPolicyFlows(data.flows, normalizedRoutes, policySelectors),
         };
     }
@@ -94,11 +101,17 @@ class PackageBuilder {
     buildArtifactsBuffer(artifacts) {
         return zlib_1.default.gzipSync(JSON.stringify(artifacts));
     }
+    // ---------------------------------------------------------------------------
+    // Path helpers
+    // ---------------------------------------------------------------------------
+    /**
+     * Compute a fallback project root from the common ancestor of route file paths.
+     * Used only when the adapter does not provide an explicit projectRoot.
+     */
     inferProjectRoot(routes) {
         const filePaths = routes.map((r) => r.filePath).filter(Boolean);
         if (filePaths.length === 0)
             return process.cwd();
-        // Find the longest common directory prefix across all route file paths
         const parts = filePaths[0].replace(/\\/g, '/').split('/');
         let commonParts = parts;
         for (const fp of filePaths.slice(1)) {
@@ -109,17 +122,45 @@ class PackageBuilder {
                 i++;
             commonParts = commonParts.slice(0, i);
         }
-        return commonParts.join('/') || process.cwd();
+        // Common ancestor of route files is typically the `app/` dir.
+        // Go one level up to reach the actual project root.
+        if (commonParts.length > 0) {
+            const candidate = commonParts.join('/');
+            const parent = candidate.includes('/') ? candidate.replace(/\/[^/]+$/, '') : candidate;
+            if (parent)
+                return parent;
+        }
+        return process.cwd();
     }
     normalizePath(filePath, projectRoot) {
         try {
             const rel = path_1.default.relative(projectRoot, filePath).replace(/\\/g, '/');
+            // Only use the relative path if it doesn't escape above the project root
             return rel.startsWith('..') ? filePath.replace(/\\/g, '/') : rel;
         }
         catch {
             return filePath.replace(/\\/g, '/');
         }
     }
+    // ---------------------------------------------------------------------------
+    // Component filtering (Fix 2)
+    // ---------------------------------------------------------------------------
+    /**
+     * Remove design-system primitives and other shared components that carry no
+     * state or interaction data. Normalises filePaths against the project root.
+     */
+    filterMeaningfulComponents(components, projectRoot) {
+        return components
+            .filter((c) => (c.stateVariables && c.stateVariables.length > 0) ||
+            (c.interactions && c.interactions.length > 0))
+            .map((c) => ({
+            ...c,
+            filePath: this.normalizePath(c.filePath, projectRoot),
+        }));
+    }
+    // ---------------------------------------------------------------------------
+    // Selector conversion
+    // ---------------------------------------------------------------------------
     toPolicySelectors(selectors, projectRoot) {
         return selectors
             .filter((element) => !element.isNavigationLink)
@@ -132,8 +173,7 @@ class PackageBuilder {
                 ? this.extractClippyIdFromSelector(preferred.value) ||
                     this.deriveStableId(component, element.tag, stableLine)
                 : this.deriveStableId(component, element.tag, stableLine);
-            const selector = preferred?.value ||
-                `[data-clippy-id='${clippyId}']`;
+            const selector = preferred?.value || `[data-clippy-id='${clippyId}']`;
             return {
                 clippyId,
                 selector,
@@ -141,13 +181,15 @@ class PackageBuilder {
                 component,
                 label: element.label,
                 route: element.route,
-                filePath: projectRoot ? this.normalizePath(element.filePath, projectRoot) : element.filePath.replace(/\\/g, '/'),
+                filePath: projectRoot
+                    ? this.normalizePath(element.filePath, projectRoot)
+                    : element.filePath.replace(/\\/g, '/'),
                 attributes: Object.entries(element.staticProps).map(([name, value]) => ({ name, value })),
                 candidates: element.selectors,
             };
         });
     }
-    toPolicyComponents(selectors) {
+    toPolicyComponents(selectors, projectRoot) {
         const byFile = new Map();
         for (const element of selectors) {
             if (element.isNavigationLink)
@@ -157,32 +199,28 @@ class PackageBuilder {
             byFile.get(element.filePath).push(element);
         }
         return Array.from(byFile.entries()).map(([filePath, items]) => {
-            // Prefer the component name captured during extraction over the filename
-            const componentName = items.find((i) => i.component)?.component ||
-                this.deriveComponentName(filePath);
+            const componentName = items.find((i) => i.component)?.component || this.deriveComponentName(filePath);
             const route = items[0]?.route || '/';
             return {
                 name: componentName,
-                filePath,
+                filePath: projectRoot ? this.normalizePath(filePath, projectRoot) : filePath.replace(/\\/g, '/'),
                 route,
                 stateVariables: [],
                 interactions: [],
             };
         });
     }
+    // ---------------------------------------------------------------------------
+    // Flow conversion
+    // ---------------------------------------------------------------------------
     toPolicyFlows(flows, routes, selectors) {
         return flows.map((flow, flowIndex) => {
             const firstRoute = flow.steps[0] || '/';
             const page = flow.page || routes.find((r) => r.path === firstRoute)?.path || firstRoute;
             const steps = flow.steps.map((routePath, stepIndex) => {
-                // For transition steps (not the first), find the edge that leads to this route
-                // and try to match its trigger text to a specific selector
-                const incomingEdge = stepIndex > 0
-                    ? flow.edges.find((e) => e.to === routePath)
-                    : null;
+                const incomingEdge = stepIndex > 0 ? flow.edges.find((e) => e.to === routePath) : null;
                 let target;
                 if (incomingEdge?.trigger && incomingEdge.trigger !== 'link') {
-                    // Try to find the specific triggering element by label match
                     const fromRoute = incomingEdge.from;
                     const byLabel = selectors.find((s) => s.route === fromRoute &&
                         s.label?.toLowerCase() === incomingEdge.trigger.toLowerCase());
@@ -192,7 +230,6 @@ class PackageBuilder {
                         : null;
                     target = (byLabel || byAttr)?.selector;
                 }
-                // Fallback: first selector on the destination route
                 if (!target) {
                     target =
                         selectors.find((s) => s.route === routePath)?.selector ||
@@ -202,9 +239,7 @@ class PackageBuilder {
                 const isInteractionStep = flow.edges.some((e) => e.from === e.to && e.trigger?.startsWith('on'));
                 return {
                     step: stepIndex + 1,
-                    action: isFirst
-                        ? isInteractionStep ? 'interact' : 'navigate'
-                        : 'transition',
+                    action: isFirst ? (isInteractionStep ? 'interact' : 'navigate') : 'transition',
                     target,
                 };
             });
@@ -219,6 +254,9 @@ class PackageBuilder {
             };
         });
     }
+    // ---------------------------------------------------------------------------
+    // Helpers
+    // ---------------------------------------------------------------------------
     deriveComponentName(filePath) {
         return (0, IdStrategy_1.deriveComponentName)(filePath);
     }
@@ -229,12 +267,5 @@ class PackageBuilder {
         const match = selector.match(/\[data-clippy-id=['\"]([^'\"]+)['\"]\]/);
         return match?.[1] || null;
     }
-    simpleHash(input) {
-        let hash = 0;
-        for (let i = 0; i < input.length; i++) {
-            hash = (hash * 31 + input.charCodeAt(i)) >>> 0;
-        }
-        return hash.toString(36);
-    }
 }
 exports.PackageBuilder = PackageBuilder;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dcoder-x/plugin-shared",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "private": false,
   "main": "dist/index.js",
   "types": "dist/index.d.ts",