fastapi-voyager 0.15.5__py3-none-any.whl → 0.15.6__py3-none-any.whl

fastapi_voyager/version.py

@@ -1,2 +1,2 @@
 __all__ = ["__version__"]
-__version__ = "0.15.5"
+__version__ = "0.15.6"

fastapi_voyager/web/graph-ui.js

@@ -1,4 +1,15 @@
 export class GraphUI {
+  // ====================
+  // Constants
+  // ====================
+
+  static HIGHLIGHT_COLOR = "#822dba"
+  static HIGHLIGHT_STROKE_WIDTH = "3.0"
+
+  // ====================
+  // Constructor
+  // ====================
+
   constructor(selector = "#graph", options = {}) {
     this.selector = selector
     this.options = options // e.g. { onSchemaClick: (name) => {} }
@@ -9,6 +20,10 @@ export class GraphUI {
     this._init()
   }
 
+  // ====================
+  // Highlight Methods
+  // ====================
+
   _highlight(mode = "bidirectional") {
     let highlightedNodes = $()
     for (const selection of this.currentSelection) {
@@ -68,49 +83,79 @@ export class GraphUI {
     return $result
   }
 
+  // ====================
+  // Schema Banner Methods
+  // ====================
+
   highlightSchemaBanner(node) {
-    // Get all polygons in the node
     const polygons = node.querySelectorAll("polygon")
-
-    // The first polygon is typically the outer frame of the entire node
     const outerFrame = polygons[0]
-    // The second polygon is typically the title background
     const titleBg = polygons[1]
 
     if (outerFrame) {
-      // Save original attributes for potential restoration
-      if (!outerFrame.hasAttribute("data-original-stroke")) {
-        outerFrame.setAttribute("data-original-stroke", outerFrame.getAttribute("stroke") || "")
-        outerFrame.setAttribute(
-          "data-original-stroke-width",
-          outerFrame.getAttribute("stroke-width") || "1"
-        )
-        outerFrame.setAttribute("data-original-fill", outerFrame.getAttribute("fill") || "")
-      }
-
-      // Apply bold purple border to the outer frame
-      outerFrame.setAttribute("stroke", "#822dba")
-      outerFrame.setAttribute("stroke-width", "3.0")
+      this._saveOriginalAttributes(outerFrame)
+      outerFrame.setAttribute("stroke", GraphUI.HIGHLIGHT_COLOR)
+      outerFrame.setAttribute("stroke-width", GraphUI.HIGHLIGHT_STROKE_WIDTH)
     }
 
     if (titleBg) {
-      // Save original attributes
-      if (!titleBg.hasAttribute("data-original-stroke")) {
-        titleBg.setAttribute("data-original-stroke", titleBg.getAttribute("stroke") || "")
-        titleBg.setAttribute(
-          "data-original-stroke-width",
-          titleBg.getAttribute("stroke-width") || "1"
-        )
-        titleBg.setAttribute("data-original-fill", titleBg.getAttribute("fill") || "")
-      }
+      this._saveOriginalAttributes(titleBg)
+      titleBg.setAttribute("fill", GraphUI.HIGHLIGHT_COLOR)
+      titleBg.setAttribute("stroke", GraphUI.HIGHLIGHT_COLOR)
+    }
+  }
 
-      // Apply purple background to title
-      titleBg.setAttribute("fill", "#822dba")
-      // Also update the stroke to match
-      titleBg.setAttribute("stroke", "#822dba")
+  clearSchemaBanners() {
+    if (this.gv) {
+      this.gv.highlight()
+    }
+
+    const allPolygons = document.querySelectorAll("polygon[data-original-stroke]")
+    allPolygons.forEach((polygon) => {
+      polygon.removeAttribute("data-original-stroke")
+      polygon.removeAttribute("data-original-stroke-width")
+      polygon.removeAttribute("data-original-fill")
+    })
+  }
+
+  _saveOriginalAttributes(element) {
+    if (!element.hasAttribute("data-original-stroke")) {
+      element.setAttribute("data-original-stroke", element.getAttribute("stroke") || "")
+      element.setAttribute(
+        "data-original-stroke-width",
+        element.getAttribute("stroke-width") || "1"
+      )
+      element.setAttribute("data-original-fill", element.getAttribute("fill") || "")
     }
   }
 
+  _applyNodeHighlight(node) {
+    const set = $()
+    set.push(node)
+    const obj = { set, direction: "bidirectional" }
+
+    this.clearSchemaBanners()
+    this.currentSelection = [obj]
+    this._highlight()
+
+    return obj
+  }
+
+  _triggerCallback(callbackName, schemaName) {
+    const callback = this.options[callbackName]
+    if (callback && schemaName) {
+      try {
+        callback(schemaName)
+      } catch (e) {
+        console.warn(`${callbackName} callback failed`, e)
+      }
+    }
+  }
+
+  // ====================
+  // Initialization & Events
+  // ====================
+
   _init() {
     const self = this
     $(this.selector).graphviz({
@@ -127,80 +172,64 @@ export class GraphUI {
 
         nodes.on("dblclick.graphui", function (event) {
           event.stopPropagation()
+
+          self._applyNodeHighlight(this)
+
           try {
             self.highlightSchemaBanner(this)
           } catch (e) {
             console.log(e)
           }
-          const set = $()
-          set.push(this)
-          const schemaName = event.currentTarget.dataset.name
-          if (schemaName) {
-            try {
-              self.options.onSchemaClick(schemaName)
-            } catch (e) {
-              console.warn("onSchemaClick callback failed", e)
-            }
-          }
+
+          self._triggerCallback("onSchemaClick", event.currentTarget.dataset.name)
         })
 
         edges.on("click.graphui", function (event) {
+          const [upStreamNode, downStreamNode] = event.currentTarget.dataset.name.split("->")
+          const nodes = self.gv.nodesByName()
+
           const up = $()
           const down = $()
           const edge = $()
-          const [upStreamNode, downStreamNode] = event.currentTarget.dataset.name.split("->")
-          const nodes = self.gv.nodesByName()
+
           up.push(nodes[upStreamNode])
           down.push(nodes[downStreamNode])
           edge.push(this)
-          const upObj = { set: up, direction: "upstream" }
-          const downObj = { set: down, direction: "downstream" }
-          const edgeOjb = { set: edge, direction: "single" }
-          self.currentSelection = [upObj, downObj, edgeOjb]
+
+          self.currentSelection = [
+            { set: up, direction: "upstream" },
+            { set: down, direction: "downstream" },
+            { set: edge, direction: "single" },
+          ]
 
           self._highlightEdgeNodes()
         })
 
         nodes.on("click.graphui", function (event) {
-          const set = $()
-          set.push(this)
-          const obj = { set, direction: "bidirectional" }
-
-          const schemaName = event.currentTarget.dataset.name
-          console.log("shift click detected")
-          if (event.shiftKey && self.options.onSchemaShiftClick) {
-            if (schemaName) {
-              try {
-                self.options.onSchemaShiftClick(schemaName)
-              } catch (e) {
-                console.warn("onSchemaShiftClick callback failed", e)
-              }
-            }
+          if (event.shiftKey) {
+            self._triggerCallback("onSchemaShiftClick", event.currentTarget.dataset.name)
           } else {
-            self.currentSelection = [obj]
-            self._highlight()
+            self._applyNodeHighlight(this)
           }
         })
 
         $(document)
           .off("click.graphui")
           .on("click.graphui", function (evt) {
-            // if outside container, do nothing
             const graphContainer = $(self.selector)[0]
             if (!graphContainer || !evt.target || !graphContainer.contains(evt.target)) {
               return
             }
 
-            let isNode = false
             const $everything = self.gv.$nodes.add(self.gv.$edges).add(self.gv.$clusters)
             const node = evt.target.parentNode
-            $everything.each(function () {
-              if (this === node) {
-                isNode = true
-              }
+            const isNode = $everything.is(function () {
+              return this === node
             })
+
             if (!isNode && self.gv) {
-              self.gv.highlight()
+              self.clearSchemaBanners()
+
               if (self.options.resetCb) {
                 self.options.resetCb()
               }
@@ -210,6 +239,10 @@ export class GraphUI {
     })
   }
 
+  // ====================
+  // Render Method
+  // ====================
+
   async render(dotSrc, resetZoom = true) {
     const height = this.options.height || "100%"
     return new Promise((resolve, reject) => {

fastapi_voyager/web/graphviz.svg.js

@@ -17,6 +17,13 @@
 
   GraphvizSvg.GVPT_2_PX = 32.5 // used to ease removal of extra space
 
+  // SVG element selectors for color manipulation
+  // NOTE: If you need to add more element types for highlighting/dimming,
+  // update SHAPE_ELEMENTS and the code will automatically handle them
+  GraphvizSvg.SHAPE_ELEMENTS = "polygon, ellipse, path, polyline"
+  GraphvizSvg.TEXT_ELEMENTS = "text"
+  GraphvizSvg.ALL_COLOR_ELEMENTS = GraphvizSvg.SHAPE_ELEMENTS + ", " + GraphvizSvg.TEXT_ELEMENTS
+
   GraphvizSvg.DEFAULTS = {
     url: null,
     svg: null,
@@ -178,8 +185,8 @@
       this.setInteractiveCursor($el, type === "edge")
     }
 
-    // save the colors of the paths, ellipses and polygons
-    $el.find("polygon, ellipse, path").each(function () {
+    // Save the colors of shape elements (polygon, ellipse, path, polyline)
+    $el.find(GraphvizSvg.SHAPE_ELEMENTS).each(function () {
       var $this = $(this)
       if ($this.attr("data-graphviz-hitbox") === "true") {
         return
@@ -196,6 +203,20 @@
       }
     })
 
+    // Save the colors of text elements
+    $el.find(GraphvizSvg.TEXT_ELEMENTS).each(function () {
+      var $this = $(this)
+      // text elements might not have explicit fill attribute, use black as default
+      var fill = $this.attr("fill")
+      if (!fill || fill === "none") {
+        fill = "#000000" // default black color for text
+      }
+      $this.data("graphviz.svg.color", {
+        fill: fill,
+        stroke: $this.attr("stroke"),
+      })
+    })
+
     // save the node name and check if theres a comment above; save it
     var $title = $el.children("title")
     if ($title[0]) {
@@ -404,6 +425,57 @@
     return retval
   }
 
+  // Helper function to apply color transformation to elements
+  GraphvizSvg.prototype._applyColorToElements = function (
+    $elements,
+    colorTransformer,
+    bgColor,
+    setStrokeWidth
+  ) {
+    var that = this
+    $elements.each(function () {
+      var $this = $(this)
+      if ($this.attr("data-graphviz-hitbox") === "true") {
+        return
+      }
+      var color = $this.data("graphviz.svg.color")
+      if (color) {
+        if (color.fill && color.fill != "none") {
+          $this.attr("fill", colorTransformer(color.fill, bgColor))
+        }
+        if (color.stroke && color.stroke != "none") {
+          $this.attr("stroke", colorTransformer(color.stroke, bgColor))
+        }
+        if (setStrokeWidth !== undefined) {
+          $this.attr("stroke-width", setStrokeWidth)
+        }
+      }
+    })
+  }
+
+  // Helper function to restore original colors
+  GraphvizSvg.prototype._restoreElementColors = function ($elements, setStrokeWidth) {
+    var that = this
+    $elements.each(function () {
+      var $this = $(this)
+      if ($this.attr("data-graphviz-hitbox") === "true") {
+        return
+      }
+      var color = $this.data("graphviz.svg.color")
+      if (color) {
+        if (color.fill && color.fill != "none") {
+          $this.attr("fill", color.fill)
+        }
+        if (color.stroke && color.stroke != "none") {
+          $this.attr("stroke", color.stroke)
+        }
+        if (setStrokeWidth !== undefined) {
+          $this.attr("stroke-width", setStrokeWidth)
+        }
+      }
+    })
+  }
+
   GraphvizSvg.prototype.findEdge = function (nodeName, testEdge, $retval) {
     var retval = []
     for (var name in this._edgesByName) {
@@ -439,37 +511,14 @@
 
   GraphvizSvg.prototype.colorElement = function ($el, getColor) {
     var bg = this.$element.css("background")
-    $el.find("polygon, ellipse, path").each(function () {
-      var $this = $(this)
-      if ($this.attr("data-graphviz-hitbox") === "true") {
-        return
-      }
-      var color = $this.data("graphviz.svg.color")
-      if (color.fill && color.fill != "none") {
-        $this.attr("fill", getColor(color.fill, bg)) // don't set  fill if it's a path
-      }
-      if (color.stroke && color.stroke != "none") {
-        $this.attr("stroke", getColor(color.stroke, bg))
-      }
-      $this.attr("stroke-width", 1.6)
-    })
+
+    // Apply color transformation to all elements (shapes + text)
+    this._applyColorToElements($el.find(GraphvizSvg.ALL_COLOR_ELEMENTS), getColor, bg)
   }
 
   GraphvizSvg.prototype.restoreElement = function ($el) {
-    $el.find("polygon, ellipse, path").each(function () {
-      var $this = $(this)
-      if ($this.attr("data-graphviz-hitbox") === "true") {
-        return
-      }
-      var color = $this.data("graphviz.svg.color")
-      if (color.fill && color.fill != "none") {
-        $this.attr("fill", color.fill) // don't set  fill if it's a path
-      }
-      if (color.stroke && color.stroke != "none") {
-        $this.attr("stroke", color.stroke)
-      }
-      $this.attr("stroke-width", 1)
-    })
+    // Restore original colors for all elements (shapes + text)
+    this._restoreElementColors($el.find(GraphvizSvg.ALL_COLOR_ELEMENTS), 1)
   }
 
   // methods users can actually call

{fastapi_voyager-0.15.5.dist-info → fastapi_voyager-0.15.6.dist-info}/METADATA

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: fastapi-voyager
-Version: 0.15.5
+Version: 0.15.6
 Summary: Visualize FastAPI application's routing tree and dependencies
 Project-URL: Homepage, https://github.com/allmonday/fastapi-voyager
 Project-URL: Source, https://github.com/allmonday/fastapi-voyager

{fastapi_voyager-0.15.5.dist-info → fastapi_voyager-0.15.6.dist-info}/RECORD

@@ -9,7 +9,7 @@ fastapi_voyager/render_style.py,sha256=mPOuChEl71-3agCbPwkMt2sFmax2AEKDI6dK90eFP
 fastapi_voyager/server.py,sha256=E0gGU7D1pBvnV7gFLBUvnkwtiBFbU1PbxEXHHSIA1oA,9115
 fastapi_voyager/type.py,sha256=zluWvh5vpnjXJ9aAmyNJTSmXZPjAHCvgRT5oQRAjHrg,2104
 fastapi_voyager/type_helper.py,sha256=FmfrZAI3Z4uDdh3sH_kH7UGoY6yNVPapneSN86qY_wo,10209
-fastapi_voyager/version.py,sha256=7F_t4pHiI_38oJ-3IRvYl5xfn2qV8LfVfFPlM9BacI0,49
+fastapi_voyager/version.py,sha256=ILB2INUiq4EGupYfMT2L0gsR_3dHm9fPDuoUnU5BSf0,49
 fastapi_voyager/voyager.py,sha256=4vonmL-xt54C5San-DRBq4mjoV8Q96eoWRy68MJ1IJw,14169
 fastapi_voyager/templates/dot/cluster.j2,sha256=I2z9KkfCzmAtqXe0gXBnxnOfBXUSpdlATs3uf-O8_B8,307
 fastapi_voyager/templates/dot/cluster_container.j2,sha256=2tH1mOJvPoVKE_aHVMR3t06TfH_dYa9OeH6DBqSHt_A,204
@@ -24,9 +24,9 @@ fastapi_voyager/templates/html/pydantic_meta.j2,sha256=_tsSqjucs_QrAlPIVRy9u6I2-
 fastapi_voyager/templates/html/schema_field_row.j2,sha256=KfKexHO_QJV-OIJS0eiY_7fqA8031fWpD2g2wTv4BuE,111
 fastapi_voyager/templates/html/schema_header.j2,sha256=9WpuHLy3Zbv5GHG08qqaj5Xf-gaR-79ErBYuANZp7iA,179
 fastapi_voyager/templates/html/schema_table.j2,sha256=rzphiGk1il7uv4Gr2p_HLPHqyLZk63vLrGAmIduTdSE,117
-fastapi_voyager/web/graph-ui.js,sha256=4gEkXTgbA6CouD4IDMW5yKYfJTxHN2vL9G0CAr6w4qA,7662
+fastapi_voyager/web/graph-ui.js,sha256=9b2auyGWEpUcF65YV231GNojQ9Uk6FsT1SlRR3lSYnc,7664
 fastapi_voyager/web/graphviz.svg.css,sha256=K218ov_mdSe3ga4KwhiBB92ynVvm5zaAk9_D9a3d8hE,1546
-fastapi_voyager/web/graphviz.svg.js,sha256=deI815RgxpZ3_MpELeV-TBYy2MVuUvZtQOHfS3aeXHY,18203
+fastapi_voyager/web/graphviz.svg.js,sha256=VokgCghvP4zm3SFiFVPIikdW6XzjkZJXQkBbCrEitug,19885
 fastapi_voyager/web/index.html,sha256=wM9vJ_UfHR8p98F6SEMCKKjJcBEl0EyosWuPqVZYXvA,23496
 fastapi_voyager/web/quasar.min.css,sha256=F5jQe7X2XT54VlvAaa2V3GsBFdVD-vxDZeaPLf6U9CU,203145
 fastapi_voyager/web/quasar.min.js,sha256=h0ftyPMW_CRiyzeVfQqiup0vrVt4_QWojpqmpnpn07E,502974
@@ -43,8 +43,8 @@ fastapi_voyager/web/icon/favicon-16x16.png,sha256=JC07jEzfIYxBIoQn_FHXvyHuxESdhW
 fastapi_voyager/web/icon/favicon-32x32.png,sha256=C7v1h58cfWOsiLp9yOIZtlx-dLasBcq3NqpHVGRmpt4,1859
 fastapi_voyager/web/icon/favicon.ico,sha256=tZolYIXkkBcFiYl1A8ksaXN2VjGamzcSdes838dLvNc,15406
 fastapi_voyager/web/icon/site.webmanifest,sha256=GRozZ5suTykYcPMap1QhjrAB8PLW0mbT_phhzw_utvQ,316
-fastapi_voyager-0.15.5.dist-info/METADATA,sha256=nvrvye9JChzW2WQLNq2S3wzPrDU67ZEFoOMYkNcXtuA,9870
-fastapi_voyager-0.15.5.dist-info/WHEEL,sha256=WLgqFyCfm_KASv4WHyYy0P3pM_m7J5L9k2skdKLirC8,87
-fastapi_voyager-0.15.5.dist-info/entry_points.txt,sha256=pEIKoUnIDXEtdMBq8EmXm70m16vELIu1VPz9-TBUFWM,53
-fastapi_voyager-0.15.5.dist-info/licenses/LICENSE,sha256=lNVRR3y_bFVoFKuK2JM8N4sFaj3m-7j29kvL3olFi5Y,1067
-fastapi_voyager-0.15.5.dist-info/RECORD,,
+fastapi_voyager-0.15.6.dist-info/METADATA,sha256=D-09okYHB5uaatoDc5SqmOVr_jTbw18o4_76pmxO4_g,9870
+fastapi_voyager-0.15.6.dist-info/WHEEL,sha256=WLgqFyCfm_KASv4WHyYy0P3pM_m7J5L9k2skdKLirC8,87
+fastapi_voyager-0.15.6.dist-info/entry_points.txt,sha256=pEIKoUnIDXEtdMBq8EmXm70m16vELIu1VPz9-TBUFWM,53
+fastapi_voyager-0.15.6.dist-info/licenses/LICENSE,sha256=lNVRR3y_bFVoFKuK2JM8N4sFaj3m-7j29kvL3olFi5Y,1067
+fastapi_voyager-0.15.6.dist-info/RECORD,,