vue-hook-optimizer 0.0.54 → 0.0.56

package/dist/index.d.mts

@@ -1,7 +1,8 @@
+import { SFCStyleBlock } from '@vue/compiler-sfc';
 export { parse } from '@vue/compiler-sfc';
 import { Edge, Node } from 'vis-network';
 
-declare function analyze$3(content: string): Set<string>;
+declare function analyze$4(content: string): Set<string>;
 
 interface TypedNode {
     label: string;
@@ -18,12 +19,12 @@ declare enum NodeType {
     fun = "fun"
 }
 
-declare function analyze$2(content: string, lineOffset?: number, jsx?: boolean): {
+declare function analyze$3(content: string, lineOffset?: number, jsx?: boolean): {
     nodes: Set<TypedNode>;
     edges: Map<TypedNode, Set<TypedNode>>;
 };
 
-declare function analyze$1(content: string, lineOffset?: number, jsx?: boolean): {
+declare function analyze$2(content: string, lineOffset?: number, jsx?: boolean): {
     graph: {
         nodes: Set<TypedNode>;
         edges: Map<TypedNode, Set<TypedNode>>;
@@ -31,7 +32,7 @@ declare function analyze$1(content: string, lineOffset?: number, jsx?: boolean):
     nodesUsedInTemplate: Set<string>;
 };
 
-declare function analyze(content: string, type?: "vue" | "react", lineOffset?: number, addInfo?: boolean): {
+declare function analyze$1(content: string, type?: "vue" | "react", lineOffset?: number, addInfo?: boolean): {
     graph: {
         nodes: Set<TypedNode>;
         edges: Map<TypedNode, Set<TypedNode>>;
@@ -39,6 +40,8 @@ declare function analyze(content: string, type?: "vue" | "react", lineOffset?: n
     nodesUsedInTemplate: Set<string>;
 };
 
+declare function analyze(styles: SFCStyleBlock[]): Set<string>;
+
 declare enum SuggestionType {
     info = "info",
     warning = "warning",
@@ -52,7 +55,7 @@ interface Suggestion {
 declare function gen(graph: {
     nodes: Set<TypedNode>;
     edges: Map<TypedNode, Set<TypedNode>>;
-}, usedNodes: Set<string>): Suggestion[];
+}, nodesUsedInTemplate: Set<string>, nodesUsedInStyle?: Set<string>): Suggestion[];
 
 type CustomNode = Node & {
     info: TypedNode['info'];
@@ -60,9 +63,9 @@ type CustomNode = Node & {
 declare function getVisData(graph: {
     nodes: Set<TypedNode>;
     edges: Map<TypedNode, Set<TypedNode>>;
-}, usedNodes: Set<string>): {
+}, nodesUsedInTemplate: Set<string>, nodesUsedInStyle?: Set<string>): {
     nodes: CustomNode[];
     edges: Edge[];
 };
 
-export { NodeType, type Suggestion, SuggestionType, type TypedNode, analyze$1 as analyzeOptions, analyze$2 as analyzeSetupScript, analyze$3 as analyzeTemplate, analyze as analyzeTsx, gen, getVisData };
+export { NodeType, type Suggestion, SuggestionType, type TypedNode, analyze$2 as analyzeOptions, analyze$3 as analyzeSetupScript, analyze as analyzeStyle, analyze$4 as analyzeTemplate, analyze$1 as analyzeTsx, gen, getVisData };

package/dist/index.d.ts

@@ -1,7 +1,8 @@
+import { SFCStyleBlock } from '@vue/compiler-sfc';
 export { parse } from '@vue/compiler-sfc';
 import { Edge, Node } from 'vis-network';
 
-declare function analyze$3(content: string): Set<string>;
+declare function analyze$4(content: string): Set<string>;
 
 interface TypedNode {
     label: string;
@@ -18,12 +19,12 @@ declare enum NodeType {
     fun = "fun"
 }
 
-declare function analyze$2(content: string, lineOffset?: number, jsx?: boolean): {
+declare function analyze$3(content: string, lineOffset?: number, jsx?: boolean): {
     nodes: Set<TypedNode>;
     edges: Map<TypedNode, Set<TypedNode>>;
 };
 
-declare function analyze$1(content: string, lineOffset?: number, jsx?: boolean): {
+declare function analyze$2(content: string, lineOffset?: number, jsx?: boolean): {
     graph: {
         nodes: Set<TypedNode>;
         edges: Map<TypedNode, Set<TypedNode>>;
@@ -31,7 +32,7 @@ declare function analyze$1(content: string, lineOffset?: number, jsx?: boolean):
     nodesUsedInTemplate: Set<string>;
 };
 
-declare function analyze(content: string, type?: "vue" | "react", lineOffset?: number, addInfo?: boolean): {
+declare function analyze$1(content: string, type?: "vue" | "react", lineOffset?: number, addInfo?: boolean): {
     graph: {
         nodes: Set<TypedNode>;
         edges: Map<TypedNode, Set<TypedNode>>;
@@ -39,6 +40,8 @@ declare function analyze(content: string, type?: "vue" | "react", lineOffset?: n
     nodesUsedInTemplate: Set<string>;
 };
 
+declare function analyze(styles: SFCStyleBlock[]): Set<string>;
+
 declare enum SuggestionType {
     info = "info",
     warning = "warning",
@@ -52,7 +55,7 @@ interface Suggestion {
 declare function gen(graph: {
     nodes: Set<TypedNode>;
     edges: Map<TypedNode, Set<TypedNode>>;
-}, usedNodes: Set<string>): Suggestion[];
+}, nodesUsedInTemplate: Set<string>, nodesUsedInStyle?: Set<string>): Suggestion[];
 
 type CustomNode = Node & {
     info: TypedNode['info'];
@@ -60,9 +63,9 @@ type CustomNode = Node & {
 declare function getVisData(graph: {
     nodes: Set<TypedNode>;
     edges: Map<TypedNode, Set<TypedNode>>;
-}, usedNodes: Set<string>): {
+}, nodesUsedInTemplate: Set<string>, nodesUsedInStyle?: Set<string>): {
     nodes: CustomNode[];
     edges: Edge[];
 };
 
-export { NodeType, type Suggestion, SuggestionType, type TypedNode, analyze$1 as analyzeOptions, analyze$2 as analyzeSetupScript, analyze$3 as analyzeTemplate, analyze as analyzeTsx, gen, getVisData };
+export { NodeType, type Suggestion, SuggestionType, type TypedNode, analyze$2 as analyzeOptions, analyze$3 as analyzeSetupScript, analyze as analyzeStyle, analyze$4 as analyzeTemplate, analyze$1 as analyzeTsx, gen, getVisData };

package/dist/index.js

@@ -34,6 +34,7 @@ __export(src_exports, {
   SuggestionType: () => SuggestionType,
   analyzeOptions: () => analyze3,
   analyzeSetupScript: () => analyze2,
+  analyzeStyle: () => analyze5,
   analyzeTemplate: () => analyze,
   analyzeTsx: () => analyze4,
   gen: () => gen,
@@ -513,7 +514,24 @@ function processSetup(ast, parentScope, parentPath, _spread, _lineOffset = 0) {
           return;
         }
         const watchArgs = /* @__PURE__ */ new Set();
-        if (hookName === "watch") {
+        if (hookName === "provide") {
+          traverse2(path.node.expression, {
+            Identifier(path1) {
+              const binding = path1.scope.getBinding(path1.node.name);
+              if (graph.nodes.has(path1.node.name) && (path1.parent.type !== "MemberExpression" && path1.parent.type !== "OptionalMemberExpression" || path1.parent.object === path1.node) && (binding?.scope.block.type === "Program" || parentScope === binding?.scope)) {
+                const _node = nodeCollection.getNode(path1.node.name);
+                if (_node?.info?.used) {
+                  _node?.info?.used?.add(hookName);
+                } else if (_node) {
+                  _node.info = {
+                    ..._node?.info,
+                    used: /* @__PURE__ */ new Set([hookName])
+                  };
+                }
+              }
+            }
+          }, path.scope, path);
+        } else if (hookName === "watch") {
           if (path.node.expression.arguments[0].type === "Identifier") {
             const binding = path.scope.getBinding(path.node.expression.arguments[0].name);
             if (graph.nodes.has(path.node.expression.arguments[0].name) && (binding?.scope.block.type === "Program" || parentScope === binding?.scope)) {
@@ -611,7 +629,8 @@ var vueLifeCycleHooks = [
   "deactivated",
   "errorCaptured",
   "renderTracked",
-  "renderTriggered"
+  "renderTriggered",
+  "provide"
 ];
 function analyze3(content, lineOffset = 0, jsx = false) {
   const ast = (0, import_compiler_sfc3.babelParse)(content, { sourceType: "module", plugins: [
@@ -1865,6 +1884,67 @@ function analyze4(content, type = "vue", lineOffset = 0, addInfo = true) {
   };
 }
 
+// src/analyze/style.ts
+function lexBinding(content, start) {
+  let state = 0 /* inParens */;
+  let parenDepth = 0;
+  for (let i = start; i < content.length; i++) {
+    const char = content.charAt(i);
+    switch (state) {
+      case 0 /* inParens */:
+        if (char === "'") {
+          state = 1 /* inSingleQuoteString */;
+        } else if (char === '"') {
+          state = 2 /* inDoubleQuoteString */;
+        } else if (char === "(") {
+          parenDepth++;
+        } else if (char === ")") {
+          if (parenDepth > 0) {
+            parenDepth--;
+          } else {
+            return i;
+          }
+        }
+        break;
+      case 1 /* inSingleQuoteString */:
+        if (char === "'") {
+          state = 0 /* inParens */;
+        }
+        break;
+      case 2 /* inDoubleQuoteString */:
+        if (char === '"') {
+          state = 0 /* inParens */;
+        }
+        break;
+    }
+  }
+  return null;
+}
+function normalizeExpression(exp) {
+  exp = exp.trim();
+  if (exp[0] === "'" && exp[exp.length - 1] === "'" || exp[0] === '"' && exp[exp.length - 1] === '"') {
+    return exp.slice(1, -1);
+  }
+  return exp;
+}
+var vBindRE = /v-bind\s*\(/g;
+function analyze5(styles) {
+  const nodes = /* @__PURE__ */ new Set();
+  styles.forEach((style) => {
+    let match;
+    const content = style.content.replace(/\/\*([\s\S]*?)\*\/|\/\/.*/g, "");
+    while (match = vBindRE.exec(content)) {
+      const start = match.index + match[0].length;
+      const end = lexBinding(content, start);
+      if (end !== null) {
+        const variable = normalizeExpression(content.slice(start, end));
+        nodes.add(variable);
+      }
+    }
+  });
+  return nodes;
+}
+
 // src/suggest/split.ts
 function dfs(graph, node, targets, visited, component) {
   component.add(node);
@@ -2039,7 +2119,8 @@ var SuggestionType = /* @__PURE__ */ ((SuggestionType2) => {
   SuggestionType2["error"] = "error";
   return SuggestionType2;
 })(SuggestionType || {});
-function gen(graph, usedNodes) {
+function gen(graph, nodesUsedInTemplate, nodesUsedInStyle = /* @__PURE__ */ new Set()) {
+  const usedNodes = /* @__PURE__ */ new Set([...nodesUsedInTemplate, ...nodesUsedInStyle]);
   const suggestions = [];
   const splitedGraph = splitGraph(graph.edges);
   splitedGraph.forEach((g) => {
@@ -2103,7 +2184,8 @@ function gen(graph, usedNodes) {
 }
 
 // src/vis.ts
-function getVisData(graph, usedNodes) {
+function getVisData(graph, nodesUsedInTemplate, nodesUsedInStyle = /* @__PURE__ */ new Set()) {
+  const usedNodes = /* @__PURE__ */ new Set([...nodesUsedInTemplate, ...nodesUsedInStyle]);
   const nodes = [];
   const edges = [];
   graph.nodes.forEach((node) => {
@@ -2114,7 +2196,12 @@ function getVisData(graph, usedNodes) {
       group: usedNodes.has(node.label) || node.info?.used?.size ? "used" : "normal",
       title: `${node.info?.used?.size ? `used by ${Array.from(node.info?.used || [])?.map((i) => `\`${i}\``).join(",")}
 
-` : ""}${usedNodes.has(node.label) ? "used in template\n\n" : ""}${node.info?.comment || ""}`.trim() || void 0,
+` : ""}${usedNodes.has(node.label) ? `used in ${[
+        nodesUsedInStyle.has(node.label) ? "style" : "",
+        nodesUsedInTemplate.has(node.label) ? "template" : ""
+      ].filter(Boolean).join(" and ")}
+
+` : ""}${node.info?.comment || ""}`.trim() || void 0,
       info: node.info
     });
   });
@@ -2146,6 +2233,7 @@ function getVisData(graph, usedNodes) {
   SuggestionType,
   analyzeOptions,
   analyzeSetupScript,
+  analyzeStyle,
   analyzeTemplate,
   analyzeTsx,
   gen,