@flourish/info-popup - npm Package Compare versions

Comparing version 4.0.2 to 4.0.4

package.json

 {
   "name": "@flourish/info-popup",
-  "version": "4.0.2",
+  "version": "4.0.4",
   "description": "Popup with data insertion",
@@ -5,0 +5,0 @@ "main": "info-popup.js",

README.md

@@ -136,8 +136,9 @@ # Flourish Info Popup
 function getLockedPositionCallback(locked_id) {
-    // if there is no locked popup 
-    if (locked_id === null) return null;
-
     // get the node that relates to this id (this is just one common way you might do this)
     const el_node = select(`#${locked_id}`).node();
 
+    // if there is no locked popup, or there is currently no element on the screen 
+    // corresponding to the stored locked popup return null
+    if (!el_node) return null;
+
     // get the data from that node
@@ -144,0 +145,0 @@ const datum = el_node && el_node.__data__;

RELEASE_NOTES.md

@@ -0,1 +1,8 @@
+# 4.0.4
+* Make `popupDirections()` a getter
+
+# 4.0.3
+* Fix bottom padding with empty custom content and an inline header
+* Don't show empty content with block header
+
 # 4.0.2
@@ -75,2 +82,2 @@ * Fix flicking bug that occurs when the popup panel is opened in rapid succession.
 * Add more styling options for content
-* Improve popup direction placement
+* Improve popup direction placement

src/html.js

@@ -28,3 +28,3 @@ function getDefaultHTML(instance, d, mode) {
 		}
-		html += "<div class='main-content'><" + list_mode + ">";
+		var main_content = "";
 		for (var binding in instance._column_names) {
@@ -38,4 +38,4 @@ if (binding == instance._title_key) continue;
 					col_names_in_popup[col_name] = true;
-					if (list_mode == "table") html += "<tr><td class='table-col-label'><span class='data-heading'>" + col_name + "</span></td><td class='table-col-value'>" + d[binding][m] + "</td></tr>";
-					else if (list_mode == "ul") html += "<li><span class='data-heading'>" + col_name + character_separator +" </span> "+ line_break + d[binding][m] + "</li>";
+					if (list_mode == "table") main_content += "<tr><td class='table-col-label'><span class='data-heading'>" + col_name + "</span></td><td class='table-col-value'>" + d[binding][m] + "</td></tr>";
+					else if (list_mode == "ul") main_content += "<li><span class='data-heading'>" + col_name + character_separator +" </span> "+ line_break + d[binding][m] + "</li>";
 				}
@@ -47,7 +47,11 @@ }
 				col_names_in_popup[col_name] = true;
-				if (list_mode == "table") html += "<tr><td class='table-col-label'><span class='data-heading'>" + col_name + "</span></td><td class='table-col-value'>" + d[binding] + "</td></tr>";
-				else if (list_mode == "ul") html += "<li><span class='data-heading'>" + col_name + character_separator + " </span> " + line_break + d[binding] + "</li>";
+				if (list_mode == "table") main_content += "<tr><td class='table-col-label'><span class='data-heading'>" + col_name + "</span></td><td class='table-col-value'>" + d[binding] + "</td></tr>";
+				else if (list_mode == "ul") main_content += "<li><span class='data-heading'>" + col_name + character_separator + " </span> " + line_break + d[binding] + "</li>";
 			}
 		}
-		html += "</" + list_mode + "></div></div>";
+		if (main_content !== "") {
+			html += "<div class='main-content'><" + list_mode + ">";
+			html += main_content;
+			html += "</" + list_mode + "></div></div>";
+		}
 	}
@@ -54,0 +58,0 @@ else {

src/index.js

@@ -262,2 +262,3 @@ import Popup from "@flourish/popup";
 InfoPopup.prototype.popupDirections = function(value) {
+	if (!value) return this._popup_directions.slice();
 	this._popup_directions = value;
@@ -264,0 +265,0 @@ return this;

src/style.js

@@ -56,5 +56,15 @@ import { color } from "d3-color";
 		.style("padding", instance._state.popup_padding + "rem")
-		.style("padding-bottom", header_block ? null : "0")
 		.style("border-radius", instance._state.popup_radius + "rem " + instance._state.popup_radius + "rem 0 0");
 
+	// If a header is not the last child that means the popup has content
+	const headers_with_content = styles.select(".flourish-popup header:not(:last-child)");
+	// We want the padding bottom to be zero only when the popup has content and has an inline header
+	headers_with_content.style("padding-bottom", header_block ? null : "0");
+
+	// Header which isn't the last child has content following it. If it's an
+	// inline header, there should be no extra padding between it and the content.
+	styles.select(".flourish-popup header:not(:last-child)")
+		.style("padding-bottom", header_block ? null : "0");
+
+
 	styles.select(".flourish-panel .flourish-panel-content-inner")
@@ -61,0 +71,0 @@ .style("overflow", "auto");

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

215610

increased by0.82%

Lines of code

4900

increased by0.49%

Number of lines in readme file

213

increased by0.47%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes