From 6e1618164c658c6d5c4c7fa4088369aa21a39ffa Mon Sep 17 00:00:00 2001
From: Ken McGrady <ken@streamlit.io>
Date: Mon, 6 Dec 2021 13:49:49 -0800
Subject: [PATCH] Update API and dependencies

---
 streamlit_org_chart/frontend/package.json |  8 ++++----
 streamlit_org_chart/frontend/src/index.ts | 15 ++++-----------
 2 files changed, 8 insertions(+), 15 deletions(-)

diff --git a/streamlit_org_chart/frontend/package.json b/streamlit_org_chart/frontend/package.json
index d44e3c6..8d5d0c1 100644
--- a/streamlit_org_chart/frontend/package.json
+++ b/streamlit_org_chart/frontend/package.json
@@ -6,13 +6,13 @@
     "@testing-library/jest-dom": "^4.2.4",
     "@testing-library/react": "^9.3.2",
     "@testing-library/user-event": "^7.1.2",
-    "@types/d3": "^7.0.0",
+    "@types/d3": "^7.1.0",
     "@types/d3-org-chart": "^2.3.0",
     "@types/jest": "^24.0.0",
     "@types/node": "^12.0.0",
-    "d3": "^7.0.1",
-    "d3-flextree": "^2.1.1",
-    "d3-org-chart": "^2.3.3",
+    "d3": "^7.2.0",
+    "d3-flextree": "^2.1.2",
+    "d3-org-chart": "^2.5.4",
     "react-scripts": "3.4.1",
     "streamlit-component-lib": "^1.1.3",
     "typescript": "~3.7.2"
diff --git a/streamlit_org_chart/frontend/src/index.ts b/streamlit_org_chart/frontend/src/index.ts
index ad42de3..2d62240 100644
--- a/streamlit_org_chart/frontend/src/index.ts
+++ b/streamlit_org_chart/frontend/src/index.ts
@@ -19,7 +19,7 @@ function onRender(event: Event): void {
     .svgHeight(window.innerHeight)
     .nodeWidth((d) => 384)
     .initialZoom(1)
-    .nodeHeight((d) => 240)
+    .nodeHeight((d) => 260)
     .childrenMargin((d) => 40)
     .compactMarginBetween((d) => 15)
     .compactMarginPair((d) => 80)
@@ -84,7 +84,7 @@ function onRender(event: Event): void {
       name.style.fontWeight = "bold"
       name.style.textAlign = "center"
       name.style.marginTop = "14px"
-      name.textContent = d.data.name || ""
+      name.textContent = d.data.primary || ""
 
       card.appendChild(name)
 
@@ -92,7 +92,7 @@ function onRender(event: Event): void {
       role.style.fontSize = "16px"
       role.style.textAlign = "center"
       role.style.marginTop = "2px"
-      role.textContent = d.data.positionName || ""
+      role.textContent = d.data.secondary || ""
 
       card.appendChild(role)
 
@@ -106,15 +106,8 @@ function onRender(event: Event): void {
       optionsText.style.alignSelf = "flex-end"
       optionsText.style.textAlign = "center"
       optionsText.style.fontSize = "14px"
-      const optionsContent = []
-      if (d.data.department) {
-        optionsContent.push(d.data.department)
-      }
-      if (d.data.location) {
-        optionsContent.push(d.data.location)
-      }
 
-      optionsText.textContent = optionsContent.join(" • ")
+      optionsText.textContent = d.data.tertiary || ""
 
       options.appendChild(optionsText)
       card.appendChild(options)