@rcsb/rcsb-saguaro-app 6.2.1 → 6.2.3

package/lib/RcsbFvUI/GroupPfvUI.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import { RcsbTabs } from "../RcsbFvWeb/RcsbFvComponents/RcsbTabs";
 import { createRoot } from "react-dom/client";
-import classes from "../scss/bootstrap-fv-display.module.scss";
+import * as classes from "../scss/bootstrap-fv-display.module.scss";
 import { ItemComponent } from "./Components/ItemComponent";
 export class GroupPfvUI {
     static fvUI(element, uiComponent) {

package/lib/RcsbFvWeb/RcsbFvComponents/LoaderSpinner.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
-import classes from "../../scss/load-spinner.scss";
+import * as classes from "../../scss/load-spinner.scss";
 export class LoaderSpinner extends React.Component {
     render() {
         return (_jsx("div", { style: { position: "absolute", left: 0, right: 0, marginLeft: "auto", zIndex: Number.MAX_SAFE_INTEGER, marginRight: "auto" }, children: _jsx("div", { className: classes.loadSpinnerComponentScope, children: _jsx("div", { className: "loader" }) }) }));

package/lib/RcsbFvWeb/RcsbFvComponents/MountableComponent.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from "react";
 export declare class MountableComponent {
-    private readonly element;
+    private static readonly ROOT;
     private root;
     constructor(element: HTMLElement);
     render(node: ReactNode): void;

package/lib/RcsbFvWeb/RcsbFvComponents/MountableComponent.js

@@ -1,8 +1,10 @@
 import { createRoot } from "react-dom/client";
 export class MountableComponent {
     constructor(element) {
-        this.element = element;
-        this.root = createRoot(this.element);
+        var _a;
+        if (!MountableComponent.ROOT.has(element.id))
+            MountableComponent.ROOT.set(element.id, createRoot(element));
+        this.root = (_a = MountableComponent.ROOT.get(element.id)) !== null && _a !== void 0 ? _a : createRoot(element);
     }
     render(node) {
         this.unmount();
@@ -12,3 +14,4 @@ export class MountableComponent {
         this.root.render(undefined);
     }
 }
+MountableComponent.ROOT = new Map();

package/lib/RcsbFvWeb/RcsbFvComponents/RcsbTabs.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
 import { Tab, Tabs } from "react-bootstrap";
-import classes from "../../scss/bootstrap-fv-display.module.scss";
+import * as classes from "../../scss/bootstrap-fv-display.module.scss";
 import uniqid from "uniqid";
 export class RcsbTabs extends React.Component {
     constructor(props) {

package/lib/RcsbGroupWeb/RcsbGroupView/RcsbGroupChart/RcsbGroupChartComponent.js

@@ -4,7 +4,7 @@ import React from "react";
 import { GroupChartLayout } from "./GroupChartLayout";
 import { SearchQueryTools as SQT } from "../../../RcsbSeacrh/SearchQueryTools";
 import { GroupChartMap as GDCM } from "./GroupChartTools";
-import classes from "../../../scss/bootstrap-group-display.module.scss";
+import * as classes from "../../../scss/bootstrap-group-display.module.scss";
 import { SearchQueryComponentFactory } from "../RcsbGroupSeacrhQuery/RcsbGroupSeacrhQueryComponent";
 //TODO include chartDisplayConfig?: Partial<ChartDisplayConfigInterface> in props and propagate it
 export class RcsbGroupChartComponent extends React.Component {

package/lib/RcsbGroupWeb/RcsbGroupView/RcsbGroupChart/RcsbStatsChartComponent.js

@@ -1,7 +1,7 @@
 import { __awaiter } from "tslib";
 import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import React from "react";
-import classes from "../../../scss/bootstrap-group-display.module.scss";
+import * as classes from "../../../scss/bootstrap-group-display.module.scss";
 import { GroupChartLayout } from "./GroupChartLayout";
 import { FacetTools } from "../../../RcsbSeacrh/FacetTools";
 import { rcsbRequestCtxManager } from "../../../RcsbRequest/RcsbRequestContextManager";
@@ -15,7 +15,7 @@ export class RcsbStatsChartComponent extends React.Component {
     render() {
         var _a;
         if ((_a = this.state) === null || _a === void 0 ? void 0 : _a.facets)
-            return (_jsx("div", { className: classes.bootstrapComponentScope, children: _jsx(GroupChartLayout, { layout: this.props.facetStore.facetLayoutGrid, chartMap: FacetTools.getResultDrilldowns(this.props.facetStore.getFacetService("all"), this.state.facets).reduce((prev, current) => {
+            return (_jsx("div", { className: classes.bootstrapGroupComponentScope, children: _jsx(GroupChartLayout, { layout: this.props.facetStore.facetLayoutGrid, chartMap: FacetTools.getResultDrilldowns(this.props.facetStore.getFacetService("all"), this.state.facets).reduce((prev, current) => {
                         return prev.set(current.attribute, [current]);
                     }, new Map()) }) }));
         return _jsx(_Fragment, {});

package/lib/RcsbGroupWeb/RcsbGroupView/RcsbGroupMembers/RcsbGroupMembersComponent.js

@@ -1,7 +1,7 @@
 import { __awaiter } from "tslib";
 import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import React from "react";
-import classes from "../../../scss/bootstrap-group-display.module.scss";
+import * as classes from "../../../scss/bootstrap-group-display.module.scss";
 import { GroupMembersGrid } from "./GroupMembersGrid";
 import { SearchQueryTools as SQT } from "../../../RcsbSeacrh/SearchQueryTools";
 import { ReturnType } from "@rcsb/rcsb-api-tools/build/RcsbSearch/Types/SearchEnums";

package/lib/RcsbGroupWeb/RcsbGroupView/RcsbResidueChart/RcsbResidueChartComponent.js

@@ -3,13 +3,13 @@ import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import React from "react";
 import { GroupChartLayout } from "../RcsbGroupChart/GroupChartLayout";
 import { ResidueChartTools as RCT } from "./ResidueChartTools/ResidueChartTools";
-import classes from "../../../scss/bootstrap-group-display.module.scss";
+import * as classes from "../../../scss/bootstrap-group-display.module.scss";
 import { FacetTools } from "../../../RcsbSeacrh/FacetTools";
 export class RcsbResidueChartComponent extends React.Component {
     render() {
         var _a, _b;
         if ((_b = (_a = this.state) === null || _a === void 0 ? void 0 : _a.layout) === null || _b === void 0 ? void 0 : _b.flat().filter((e) => { var _a, _b; return ((_b = (_a = this.state) === null || _a === void 0 ? void 0 : _a.chartMap) === null || _b === void 0 ? void 0 : _b.get(e)); })) {
-            return (_jsx("div", { className: classes.bootstrapComponentScope, children: _jsx(GroupChartLayout, { layout: this.state.layout, chartMap: this.state.chartMap }) }));
+            return (_jsx("div", { className: classes.bootstrapGroupComponentScope, children: _jsx(GroupChartLayout, { layout: this.state.layout, chartMap: this.state.chartMap }) }));
         }
         return _jsx(_Fragment, {});
     }

package/lib/commonjs/RcsbFvUI/GroupPfvUI.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const RcsbTabs_1 = require("../RcsbFvWeb/RcsbFvComponents/RcsbTabs");
 const client_1 = require("react-dom/client");
-const bootstrap_fv_display_module_scss_1 = tslib_1.__importDefault(require("../scss/bootstrap-fv-display.module.scss"));
+const classes = tslib_1.__importStar(require("../scss/bootstrap-fv-display.module.scss"));
 const ItemComponent_1 = require("./Components/ItemComponent");
 class GroupPfvUI {
     static fvUI(element, uiComponent) {
@@ -13,7 +13,7 @@ class GroupPfvUI {
     }
     static addBootstrapElement(elementId) {
         const div = GroupPfvUI.htmlElementUI(elementId);
-        div.className = bootstrap_fv_display_module_scss_1.default.bootstrapFvComponentScope;
+        div.className = classes.bootstrapFvComponentScope;
         return div;
     }
     static htmlElementUI(elementId) {

package/lib/commonjs/RcsbFvWeb/RcsbFvComponents/LoaderSpinner.js

@@ -4,10 +4,10 @@ exports.LoaderSpinner = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importDefault(require("react"));
-const load_spinner_scss_1 = tslib_1.__importDefault(require("../../scss/load-spinner.scss"));
+const classes = tslib_1.__importStar(require("../../scss/load-spinner.scss"));
 class LoaderSpinner extends react_1.default.Component {
     render() {
-        return ((0, jsx_runtime_1.jsx)("div", { style: { position: "absolute", left: 0, right: 0, marginLeft: "auto", zIndex: Number.MAX_SAFE_INTEGER, marginRight: "auto" }, children: (0, jsx_runtime_1.jsx)("div", { className: load_spinner_scss_1.default.loadSpinnerComponentScope, children: (0, jsx_runtime_1.jsx)("div", { className: "loader" }) }) }));
+        return ((0, jsx_runtime_1.jsx)("div", { style: { position: "absolute", left: 0, right: 0, marginLeft: "auto", zIndex: Number.MAX_SAFE_INTEGER, marginRight: "auto" }, children: (0, jsx_runtime_1.jsx)("div", { className: classes.loadSpinnerComponentScope, children: (0, jsx_runtime_1.jsx)("div", { className: "loader" }) }) }));
     }
 }
 exports.LoaderSpinner = LoaderSpinner;

package/lib/commonjs/RcsbFvWeb/RcsbFvComponents/MountableComponent.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from "react";
 export declare class MountableComponent {
-    private readonly element;
+    private static readonly ROOT;
     private root;
     constructor(element: HTMLElement);
     render(node: ReactNode): void;

package/lib/commonjs/RcsbFvWeb/RcsbFvComponents/MountableComponent.js

@@ -4,8 +4,10 @@ exports.MountableComponent = void 0;
 const client_1 = require("react-dom/client");
 class MountableComponent {
     constructor(element) {
-        this.element = element;
-        this.root = (0, client_1.createRoot)(this.element);
+        var _a;
+        if (!MountableComponent.ROOT.has(element.id))
+            MountableComponent.ROOT.set(element.id, (0, client_1.createRoot)(element));
+        this.root = (_a = MountableComponent.ROOT.get(element.id)) !== null && _a !== void 0 ? _a : (0, client_1.createRoot)(element);
     }
     render(node) {
         this.unmount();
@@ -16,3 +18,4 @@ class MountableComponent {
     }
 }
 exports.MountableComponent = MountableComponent;
+MountableComponent.ROOT = new Map();

package/lib/commonjs/RcsbFvWeb/RcsbFvComponents/RcsbTabs.js

@@ -5,14 +5,14 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importDefault(require("react"));
 const react_bootstrap_1 = require("react-bootstrap");
-const bootstrap_fv_display_module_scss_1 = tslib_1.__importDefault(require("../../scss/bootstrap-fv-display.module.scss"));
+const classes = tslib_1.__importStar(require("../../scss/bootstrap-fv-display.module.scss"));
 const uniqid_1 = tslib_1.__importDefault(require("uniqid"));
 class RcsbTabs extends react_1.default.Component {
     constructor(props) {
         super(props);
     }
     render() {
-        return ((0, jsx_runtime_1.jsx)("div", { className: bootstrap_fv_display_module_scss_1.default.bootstrapFvComponentScope, children: (0, jsx_runtime_1.jsx)(react_bootstrap_1.Tabs, { id: this.props.id, defaultActiveKey: this.props.default, onSelect: (eventKey) => {
+        return ((0, jsx_runtime_1.jsx)("div", { className: classes.bootstrapFvComponentScope, children: (0, jsx_runtime_1.jsx)(react_bootstrap_1.Tabs, { id: this.props.id, defaultActiveKey: this.props.default, onSelect: (eventKey) => {
                     this.props.onSelect(eventKey);
                 }, children: this.props.tabList.map((tab, n) => ((0, jsx_runtime_1.jsxs)(react_bootstrap_1.Tab, { eventKey: tab.key, title: tab.title, children: [tab.additionalComponent, (0, jsx_runtime_1.jsx)("div", { id: tab.key + RcsbTabs.UI_SUFFIX, style: { height: 20 } }), (0, jsx_runtime_1.jsx)("div", { id: tab.key })] }, (0, uniqid_1.default)(`${tab.key}_`)))) }) }));
     }

package/lib/commonjs/RcsbGroupWeb/RcsbGroupView/RcsbGroupChart/RcsbGroupChartComponent.js

@@ -7,7 +7,7 @@ const react_1 = tslib_1.__importDefault(require("react"));
 const GroupChartLayout_1 = require("./GroupChartLayout");
 const SearchQueryTools_1 = require("../../../RcsbSeacrh/SearchQueryTools");
 const GroupChartTools_1 = require("./GroupChartTools");
-const bootstrap_group_display_module_scss_1 = tslib_1.__importDefault(require("../../../scss/bootstrap-group-display.module.scss"));
+const classes = tslib_1.__importStar(require("../../../scss/bootstrap-group-display.module.scss"));
 const RcsbGroupSeacrhQueryComponent_1 = require("../RcsbGroupSeacrhQuery/RcsbGroupSeacrhQueryComponent");
 //TODO include chartDisplayConfig?: Partial<ChartDisplayConfigInterface> in props and propagate it
 class RcsbGroupChartComponent extends react_1.default.Component {
@@ -19,7 +19,7 @@ class RcsbGroupChartComponent extends react_1.default.Component {
     render() {
         var _a, _b, _c, _d, _e;
         if (((_a = this.state) === null || _a === void 0 ? void 0 : _a.layout) && ((_b = this.state) === null || _b === void 0 ? void 0 : _b.chartMap) && ((_e = (_d = (_c = this.state) === null || _c === void 0 ? void 0 : _c.layout) === null || _d === void 0 ? void 0 : _d.filter((e) => { var _a, _b; return ((_b = (_a = this.state) === null || _a === void 0 ? void 0 : _a.chartMap) === null || _b === void 0 ? void 0 : _b.get(e)); })) !== null && _e !== void 0 ? _e : []).length > 0) {
-            return ((0, jsx_runtime_1.jsxs)("div", { className: bootstrap_group_display_module_scss_1.default.bootstrapGroupComponentScope, children: [RcsbGroupSeacrhQueryComponent_1.SearchQueryComponentFactory.getGroupSearchComponent(this.props.groupProvenanceId, this.props.groupId, this.props.searchQuery), (0, jsx_runtime_1.jsx)(GroupChartLayout_1.GroupChartLayout, { layout: this.state.layout, chartMap: this.state.chartMap })] }));
+            return ((0, jsx_runtime_1.jsxs)("div", { className: classes.bootstrapGroupComponentScope, children: [RcsbGroupSeacrhQueryComponent_1.SearchQueryComponentFactory.getGroupSearchComponent(this.props.groupProvenanceId, this.props.groupId, this.props.searchQuery), (0, jsx_runtime_1.jsx)(GroupChartLayout_1.GroupChartLayout, { layout: this.state.layout, chartMap: this.state.chartMap })] }));
         }
         else {
             return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});

package/lib/commonjs/RcsbGroupWeb/RcsbGroupView/RcsbGroupChart/RcsbStatsChartComponent.js

@@ -4,7 +4,7 @@ exports.RcsbStatsChartComponent = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importDefault(require("react"));
-const bootstrap_group_display_module_scss_1 = tslib_1.__importDefault(require("../../../scss/bootstrap-group-display.module.scss"));
+const classes = tslib_1.__importStar(require("../../../scss/bootstrap-group-display.module.scss"));
 const GroupChartLayout_1 = require("./GroupChartLayout");
 const FacetTools_1 = require("../../../RcsbSeacrh/FacetTools");
 const RcsbRequestContextManager_1 = require("../../../RcsbRequest/RcsbRequestContextManager");
@@ -18,7 +18,7 @@ class RcsbStatsChartComponent extends react_1.default.Component {
     render() {
         var _a;
         if ((_a = this.state) === null || _a === void 0 ? void 0 : _a.facets)
-            return ((0, jsx_runtime_1.jsx)("div", { className: bootstrap_group_display_module_scss_1.default.bootstrapComponentScope, children: (0, jsx_runtime_1.jsx)(GroupChartLayout_1.GroupChartLayout, { layout: this.props.facetStore.facetLayoutGrid, chartMap: FacetTools_1.FacetTools.getResultDrilldowns(this.props.facetStore.getFacetService("all"), this.state.facets).reduce((prev, current) => {
+            return ((0, jsx_runtime_1.jsx)("div", { className: classes.bootstrapGroupComponentScope, children: (0, jsx_runtime_1.jsx)(GroupChartLayout_1.GroupChartLayout, { layout: this.props.facetStore.facetLayoutGrid, chartMap: FacetTools_1.FacetTools.getResultDrilldowns(this.props.facetStore.getFacetService("all"), this.state.facets).reduce((prev, current) => {
                         return prev.set(current.attribute, [current]);
                     }, new Map()) }) }));
         return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});

package/lib/commonjs/RcsbGroupWeb/RcsbGroupView/RcsbGroupMembers/RcsbGroupMembersComponent.js

@@ -4,7 +4,7 @@ exports.searchRequest = exports.RcsbGroupMembersComponent = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importDefault(require("react"));
-const bootstrap_group_display_module_scss_1 = tslib_1.__importDefault(require("../../../scss/bootstrap-group-display.module.scss"));
+const classes = tslib_1.__importStar(require("../../../scss/bootstrap-group-display.module.scss"));
 const GroupMembersGrid_1 = require("./GroupMembersGrid");
 const SearchQueryTools_1 = require("../../../RcsbSeacrh/SearchQueryTools");
 const SearchEnums_1 = require("@rcsb/rcsb-api-tools/build/RcsbSearch/Types/SearchEnums");
@@ -24,7 +24,7 @@ class RcsbGroupMembersComponent extends react_1.default.Component {
     }
     render() {
         if (this.state.nPages > 0)
-            return ((0, jsx_runtime_1.jsx)("div", { id: this.groupMembersDiv, style: { minHeight: 627 }, className: `${bootstrap_group_display_module_scss_1.default.bootstrapGroupComponentScope}`, children: (0, jsx_runtime_1.jsx)(Slider_1.Slider, { slide: this.slide.bind(this), pages: this.state.nPages, currentPage: this.state.selectedIndex + 1, children: (0, jsx_runtime_1.jsx)(GroupMembersGrid_1.GroupMembersGrid, { groupProvenanceId: this.props.groupProvenanceId, groupId: this.props.groupId, nRows: this.props.nRows, nColumns: this.props.nColumns, index: this.state.selectedIndex, searchQuery: this.state.searchQuery }) }) }));
+            return ((0, jsx_runtime_1.jsx)("div", { id: this.groupMembersDiv, style: { minHeight: 627 }, className: `${classes.bootstrapGroupComponentScope}`, children: (0, jsx_runtime_1.jsx)(Slider_1.Slider, { slide: this.slide.bind(this), pages: this.state.nPages, currentPage: this.state.selectedIndex + 1, children: (0, jsx_runtime_1.jsx)(GroupMembersGrid_1.GroupMembersGrid, { groupProvenanceId: this.props.groupProvenanceId, groupId: this.props.groupId, nRows: this.props.nRows, nColumns: this.props.nColumns, index: this.state.selectedIndex, searchQuery: this.state.searchQuery }) }) }));
         else
             return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }

package/lib/commonjs/RcsbGroupWeb/RcsbGroupView/RcsbResidueChart/RcsbResidueChartComponent.js

@@ -6,13 +6,13 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importDefault(require("react"));
 const GroupChartLayout_1 = require("../RcsbGroupChart/GroupChartLayout");
 const ResidueChartTools_1 = require("./ResidueChartTools/ResidueChartTools");
-const bootstrap_group_display_module_scss_1 = tslib_1.__importDefault(require("../../../scss/bootstrap-group-display.module.scss"));
+const classes = tslib_1.__importStar(require("../../../scss/bootstrap-group-display.module.scss"));
 const FacetTools_1 = require("../../../RcsbSeacrh/FacetTools");
 class RcsbResidueChartComponent extends react_1.default.Component {
     render() {
         var _a, _b;
         if ((_b = (_a = this.state) === null || _a === void 0 ? void 0 : _a.layout) === null || _b === void 0 ? void 0 : _b.flat().filter((e) => { var _a, _b; return ((_b = (_a = this.state) === null || _a === void 0 ? void 0 : _a.chartMap) === null || _b === void 0 ? void 0 : _b.get(e)); })) {
-            return ((0, jsx_runtime_1.jsx)("div", { className: bootstrap_group_display_module_scss_1.default.bootstrapComponentScope, children: (0, jsx_runtime_1.jsx)(GroupChartLayout_1.GroupChartLayout, { layout: this.state.layout, chartMap: this.state.chartMap }) }));
+            return ((0, jsx_runtime_1.jsx)("div", { className: classes.bootstrapGroupComponentScope, children: (0, jsx_runtime_1.jsx)(GroupChartLayout_1.GroupChartLayout, { layout: this.state.layout, chartMap: this.state.chartMap }) }));
         }
         return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rcsb/rcsb-saguaro-app",
-  "version": "6.2.1",
+  "version": "6.2.3",
   "description": "RCSB 1D Saguaro Web App",
   "main": "build/app.js",
   "files": [
@@ -14,7 +14,6 @@
     "buildApp": "npm run clean && npm run checkQueries && npm run buildOnlyApp",
     "buildAppDev": "npm run clean && npm run checkQueries && npm run buildDev",
     "build": "webpack --config ./webpack.config.js",
-    "buildDev": "webpack --config ./webpack.server.dev.config.js",
     "checkQueries": "ts-node src/RcsbQueries/QueryCheck.ts",
     "copyQueries": "npm run copyBorregoQueries && npm run copyYosemiteQueries",
     "copyBorregoQueries": "ncp src/RcsbQueries/Borrego lib/RcsbQueries/Borrego && ncp src/RcsbQueries/Borrego lib/commonjs/RcsbQueries/Borrego",
@@ -51,21 +50,21 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@babel/core": "^7.24.0",
-    "@babel/plugin-proposal-class-properties": "^7.17.12",
-    "@babel/preset-env": "^7.24.0",
+    "@babel/core": "^7.25.2",
+    "@babel/plugin-proposal-class-properties": "^7.18.6",
+    "@babel/preset-env": "^7.25.3",
     "@svgr/webpack": "^8.1.0",
-    "@types/lodash": "^4.14.202",
+    "@types/lodash": "^4.17.7",
     "@types/lodash.range": "^3.2.9",
     "@types/object-hash": "^3.0.6",
-    "@types/react": "^18.2.64",
-    "@types/react-dom": "^18.2.21",
+    "@types/react": "^18.3.4",
+    "@types/react-dom": "^18.3.0",
     "@types/uniqid": "^5.3.4",
     "babel-loader": "^9.1.3",
     "bootstrap": "^5.3.3",
     "buffer": "^6.0.3",
     "crypto-browserify": "^3.12.0",
-    "css-loader": "^6.10.0",
+    "css-loader": "^7.1.2",
     "del-cli": "^5.1.0",
     "graphql-request": "^6.1.0",
     "html-webpack-plugin": "^5.6.0",
@@ -75,37 +74,37 @@
     "path-browserify": "^1.0.1",
     "raw-loader": "^4.0.2",
     "react-draggable": "^4.4.6",
-    "sass": "^1.71.1",
-    "sass-loader": "^14.1.1",
+    "sass": "^1.77.8",
+    "sass-loader": "^16.0.1",
     "stream-browserify": "^3.0.0",
-    "style-loader": "^3.3.4",
+    "style-loader": "^4.0.0",
     "ts-loader": "^9.5.1",
     "ts-node": "^10.9.2",
-    "typedoc": "^0.25.11",
-    "typedoc-plugin-missing-exports": "^2.2.0",
-    "typedoc-theme-hierarchy": "^4.1.2",
-    "typescript": "^5.3.3",
+    "typedoc": "^0.26.6",
+    "typedoc-plugin-missing-exports": "^3.0.0",
+    "typedoc-theme-hierarchy": "^5.0.3",
+    "typescript": "^5.5.4",
     "uniqid": "^5.4.0",
-    "webpack": "^5.90.3",
+    "webpack": "^5.93.0",
     "webpack-cli": "^5.1.4",
-    "webpack-dev-server": "^5.0.2",
+    "webpack-dev-server": "^5.0.4",
     "worker-loader": "^3.0.8"
   },
   "dependencies": {
-    "@rcsb/rcsb-charts": "^0.2.23",
-    "@rcsb/rcsb-saguaro": "^3.0.8",
+    "@rcsb/rcsb-charts": "^0.2.24",
+    "@rcsb/rcsb-saguaro": "^3.0.9",
     "@rcsb/rcsb-search-tools": "^0.0.14",
-    "ideogram": "^1.45.1",
-    "react-bootstrap": "^2.10.1",
+    "ideogram": "^1.47.0",
+    "react-bootstrap": "^2.10.4",
     "react-select": "^5.8.0",
     "rxjs": "^7.8.1",
     "string-to-color": "^2.2.2"
   },
   "peerDependencies": {
-    "@rcsb/rcsb-api-tools": "^4.1.14",
-    "boxicons": "^2.1.0",
-    "react": "^18.1.0",
-    "react-dom": "^18.1.0"
+    "@rcsb/rcsb-api-tools": "^4.3.0",
+    "boxicons": "^2.1.4",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
   },
   "bugs": {
     "url": "https://github.com/rcsb/rcsb-saguaro-app/issues"