@rcsb/rcsb-saguaro-app 6.0.0-development.1 → 6.0.0-development.2

package/lib/commonjs/RcsbFvUI/Components/PaginationItemComponent.js

@@ -0,0 +1,85 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PaginationItemComponent = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const AbstractMenuItemComponent_1 = require("../AbstractMenuItemComponent");
+class PaginationItemComponent extends AbstractMenuItemComponent_1.AbstractMenuItemComponent {
+    constructor() {
+        super(...arguments);
+        this.state = {
+            after: parseInt(this.props.after),
+            first: this.props.first > this.props.count ? this.props.count : this.props.first
+        };
+    }
+    render() {
+        return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { onClick: () => this.next(-this.state.first), role: this.role(-this.state.first), className: "d-inline-block text-center" + " " + this.textColor(-this.state.first), style: { width: 20 }, children: "\u276E" }), (0, jsx_runtime_1.jsxs)("div", { className: "d-inline-block text-center", style: { width: 90 }, children: [this.state.after + 1, " - ", this.state.after + this.state.first] }), (0, jsx_runtime_1.jsx)("div", { onClick: () => this.next(this.state.first), role: this.role(this.state.first), className: "d-inline-block text-center" + " " + this.textColor(this.state.first), style: { width: 20 }, children: "\u276F" })] }));
+    }
+    componentDidUpdate(prevProps, prevState, snapshot) {
+        super.componentDidUpdate(prevProps, prevState, snapshot);
+    }
+    next(n) {
+        this.switchAction({
+            middle: () => {
+                this.setState({ after: (this.state.after + n) });
+                return undefined;
+            },
+            end: () => {
+                this.setState({ after: this.props.count - n });
+                return undefined;
+            },
+            start: () => {
+                this.setState({ after: 0 });
+                return undefined;
+            },
+            out: () => {
+                return undefined;
+            },
+        }, n);
+    }
+    role(n) {
+        return this.switchAction({
+            middle: () => {
+                return "button";
+            },
+            end: () => {
+                return "button";
+            },
+            start: () => {
+                return "button";
+            },
+            out: () => {
+                return undefined;
+            },
+        }, n);
+    }
+    textColor(n) {
+        return this.switchAction({
+            middle: () => {
+                return "text-white";
+            },
+            end: () => {
+                return "text-white";
+            },
+            start: () => {
+                return "text-white";
+            },
+            out: () => {
+                return "text-opacity-25 text-primary";
+            },
+        }, n);
+    }
+    switchAction(x, n) {
+        const O = n > 0 ? this.state.after + n : this.state.after;
+        if ((O + n) >= 0 && (O + n) <= this.props.count) {
+            return x.middle();
+        }
+        else if ((O + n) >= 0 && O != this.props.count) {
+            return x.end();
+        }
+        else if (O != 0 && n < 0) {
+            return x.start();
+        }
+        return x.out();
+    }
+}
+exports.PaginationItemComponent = PaginationItemComponent;

package/lib/commonjs/RcsbFvUI/GroupPfvUI.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export type UiComponentType<T extends {}> = {
+    component: typeof React.Component<T, any>;
+    props: T;
+};
+export declare class GroupPfvUI {
+    static fvUI(element: string | HTMLElement, uiComponent: UiComponentType<any>[]): void;
+    static addBootstrapElement(elementId: string): HTMLElement;
+    private static htmlElementUI;
+}

package/lib/commonjs/RcsbFvUI/GroupPfvUI.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GroupPfvUI = void 0;
+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 ItemComponent_1 = require("./Components/ItemComponent");
+class GroupPfvUI {
+    static fvUI(element, uiComponent) {
+        (0, client_1.createRoot)(typeof element === "string" ? GroupPfvUI.htmlElementUI(element) : element).render((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: uiComponent.map((b, n) => ((0, jsx_runtime_1.jsx)(ItemComponent_1.ItemComponent, { role: "", children: (0, jsx_runtime_1.jsx)(b.component, Object.assign({}, b.props)) }, "uiItem_" + n))) }));
+    }
+    static addBootstrapElement(elementId) {
+        const div = GroupPfvUI.htmlElementUI(elementId);
+        div.className = bootstrap_fv_display_module_scss_1.default.bootstrapFvComponentScope;
+        return div;
+    }
+    static htmlElementUI(elementId) {
+        var _a, _b;
+        let uiDiv = document.getElementById(elementId + RcsbTabs_1.RcsbTabs.UI_SUFFIX);
+        if (!uiDiv) {
+            uiDiv = document.createElement("div");
+            uiDiv.setAttribute("id", elementId + RcsbTabs_1.RcsbTabs.UI_SUFFIX);
+            (_b = (_a = document.getElementById(elementId)) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.insertBefore(uiDiv, document.getElementById(elementId));
+        }
+        return uiDiv;
+    }
+}
+exports.GroupPfvUI = GroupPfvUI;

package/lib/commonjs/RcsbFvUI/Helper/ActionMethods.d.ts

@@ -0,0 +1,11 @@
+import { RcsbFvAdditionalConfig, RcsbFvModulePublicInterface } from "../../RcsbFvWeb/RcsbFvModule/RcsbFvModuleInterface";
+export declare namespace ActionMethods {
+    type PfvMethodType<T extends unknown[]> = (...pfvParams: MenuActionArgsType<T>) => Promise<RcsbFvModulePublicInterface>;
+    type MenuActionArgsType<T extends unknown[]> = [string, ...T, RcsbFvAdditionalConfig?];
+    export interface FvChangeConfigInterface {
+        beforeChangeCallback?: (module: RcsbFvModulePublicInterface | undefined) => void;
+        onChangeCallback?: (module: RcsbFvModulePublicInterface) => void;
+    }
+    export function paginationCallback<T extends unknown[]>(): (elementId: string, pfv: RcsbFvModulePublicInterface, pfvMethod: PfvMethodType<T>, pfvParams: T, additionalConfig?: RcsbFvAdditionalConfig & FvChangeConfigInterface) => void;
+    export {};
+}

package/lib/commonjs/RcsbFvUI/Helper/ActionMethods.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ActionMethods = void 0;
+const tslib_1 = require("tslib");
+const rxjs_1 = require("rxjs");
+var ActionMethods;
+(function (ActionMethods) {
+    function paginationCallback() {
+        let subscription = undefined;
+        return (elementId, pfv, pfvMethod, pfvParams, additionalConfig) => {
+            if (subscription)
+                subscription.unsubscribe();
+            subscription = rxjs_1.asyncScheduler.schedule(() => tslib_1.__awaiter(this, void 0, void 0, function* () {
+                var _a, _b;
+                const dom = pfv.getFv().getDomain();
+                const sel = pfv.getFv().getSelection("select");
+                (_a = additionalConfig === null || additionalConfig === void 0 ? void 0 : additionalConfig.beforeChangeCallback) === null || _a === void 0 ? void 0 : _a.call(additionalConfig, pfv);
+                yield pfvMethod(elementId, ...pfvParams, Object.assign({}, additionalConfig));
+                pfv.getFv().setDomain(dom);
+                pfv.getFv().setSelection({
+                    elements: sel.map((s) => ({
+                        begin: s.rcsbFvTrackDataElement.begin,
+                        end: s.rcsbFvTrackDataElement.end
+                    })),
+                    mode: "select"
+                });
+                (_b = additionalConfig === null || additionalConfig === void 0 ? void 0 : additionalConfig.onChangeCallback) === null || _b === void 0 ? void 0 : _b.call(additionalConfig, pfv);
+            }), 333);
+        };
+    }
+    ActionMethods.paginationCallback = paginationCallback;
+})(ActionMethods || (exports.ActionMethods = ActionMethods = {}));

package/lib/commonjs/RcsbFvWeb/RcsbFvBuilder/RcsbFvAssemblyBuilder.d.ts

@@ -0,0 +1,5 @@
+import { InstanceSequenceOnchangeInterface } from "./RcsbFvInstanceBuilder";
+import { RcsbFvModulePublicInterface } from "../RcsbFvModule/RcsbFvModuleInterface";
+export declare class RcsbFvAssemblyBuilder {
+    static buildAssemblySequenceFv(elementFvId: string, elementSelectAssemblyId: string, elementSelectInstanceId: string, entryId: string, onAsseblyChangeCallback?: (x: string) => void, onInstanceChangeCallback?: (x: InstanceSequenceOnchangeInterface) => void): Promise<RcsbFvModulePublicInterface>;
+}

package/lib/commonjs/RcsbFvWeb/RcsbFvBuilder/RcsbFvAssemblyBuilder.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RcsbFvAssemblyBuilder = void 0;
+const tslib_1 = require("tslib");
+const RcsbFvCoreBuilder_1 = require("./RcsbFvCoreBuilder");
+const RcsbFvInstanceBuilder_1 = require("./RcsbFvInstanceBuilder");
+const RcsbRequestContextManager_1 = require("../../RcsbRequest/RcsbRequestContextManager");
+const Assertions_1 = require("../../RcsbUtils/Helpers/Assertions");
+var assertDefined = Assertions_1.Assertions.assertDefined;
+class RcsbFvAssemblyBuilder {
+    static buildAssemblySequenceFv(elementFvId, elementSelectAssemblyId, elementSelectInstanceId, entryId, onAsseblyChangeCallback, onInstanceChangeCallback) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const assemblyTranslate = yield RcsbRequestContextManager_1.rcsbRequestCtxManager.getEntryToAssembly(entryId);
+            const assemblyMap = assemblyTranslate.getData();
+            if (assemblyMap.size == 0) {
+                RcsbFvCoreBuilder_1.RcsbFvCoreBuilder.showMessage(elementFvId, "No sequence features are available");
+                throw new Error("No sequence features are available");
+            }
+            else {
+                RcsbFvCoreBuilder_1.RcsbFvCoreBuilder.buildSelectButton(elementFvId, elementSelectAssemblyId, Array.from(assemblyMap.keys()).map(assemblyId => {
+                    return {
+                        name: assemblyId,
+                        label: assemblyId,
+                        onChange: () => tslib_1.__awaiter(this, void 0, void 0, function* () {
+                            const o = assemblyMap.get(assemblyId);
+                            if (!o)
+                                return;
+                            yield RcsbFvInstanceBuilder_1.RcsbFvInstanceBuilder.buildSelectorInstanceFv(o, elementFvId, elementSelectInstanceId, entryId, { onChangeCallback: onInstanceChangeCallback });
+                            if (typeof onAsseblyChangeCallback === "function")
+                                onAsseblyChangeCallback(assemblyId);
+                        })
+                    };
+                }), { dropdownTitle: "ASSEMBLY" });
+                const o = assemblyMap.get(RcsbRequestContextManager_1.rcsbRequestCtxManager.modelKey);
+                assertDefined(o);
+                const out = yield RcsbFvInstanceBuilder_1.RcsbFvInstanceBuilder.buildSelectorInstanceFv(o, elementFvId, elementSelectInstanceId, entryId, { onChangeCallback: onInstanceChangeCallback });
+                if (typeof onAsseblyChangeCallback === "function")
+                    onAsseblyChangeCallback(RcsbRequestContextManager_1.rcsbRequestCtxManager.modelKey);
+                return out;
+            }
+        });
+    }
+}
+exports.RcsbFvAssemblyBuilder = RcsbFvAssemblyBuilder;

package/lib/commonjs/RcsbFvWeb/RcsbFvBuilder/RcsbFvChromosomeBuilder.d.ts

@@ -0,0 +1,7 @@
+import { RcsbFvAdditionalConfig, RcsbFvModulePublicInterface } from "../RcsbFvModule/RcsbFvModuleInterface";
+export declare class RcsbFvChromosomeBuilder {
+    static buildFullChromosome(elementFvId: string, chrId: string): Promise<RcsbFvModulePublicInterface>;
+    static buildEntryChromosome(elementFvId: string, entitySelectId: string, chromosomeSelectId: string, entryId: string): Promise<RcsbFvModulePublicInterface>;
+    static buildEntityChromosome(elementFvId: string, elementSelectId: string, entityId: string): Promise<RcsbFvModulePublicInterface>;
+    static buildChromosome(elementFvId: string, entityId: string | undefined, chrId: string | undefined, elementSelectId?: string, additionalConfig?: RcsbFvAdditionalConfig): Promise<RcsbFvModulePublicInterface>;
+}

package/lib/commonjs/RcsbFvWeb/RcsbFvBuilder/RcsbFvChromosomeBuilder.js

@@ -0,0 +1,97 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RcsbFvChromosomeBuilder = void 0;
+const tslib_1 = require("tslib");
+const RcsbFvChromosome_1 = require("../RcsbFvModule/RcsbFvChromosome");
+const RcsbFvCoreBuilder_1 = require("./RcsbFvCoreBuilder");
+const RcsbRequestContextManager_1 = require("../../RcsbRequest/RcsbRequestContextManager");
+const TagDelimiter_1 = require("@rcsb/rcsb-api-tools/build/RcsbUtils/TagDelimiter");
+class RcsbFvChromosomeBuilder {
+    static buildFullChromosome(elementFvId, chrId) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            return yield RcsbFvChromosomeBuilder.buildChromosome(elementFvId, undefined, chrId);
+        });
+    }
+    static buildEntryChromosome(elementFvId, entitySelectId, chromosomeSelectId, entryId) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            return new Promise((resolve, reject) => tslib_1.__awaiter(this, void 0, void 0, function* () {
+                const entityInstanceTranslator = yield RcsbRequestContextManager_1.rcsbRequestCtxManager.getEntityToInstance(entryId);
+                const result = entityInstanceTranslator.getData();
+                const entitySet = new Set();
+                result.sort((a, b) => {
+                    return parseInt(a.entityId) - parseInt(b.entityId);
+                }).forEach(r => {
+                    entitySet.add(r.entryId + TagDelimiter_1.TagDelimiter.entity + r.entityId);
+                });
+                const entityChrTranslate = yield RcsbRequestContextManager_1.rcsbRequestCtxManager.getEntityToChromosome(Array.from(entitySet));
+                const entityMap = entityChrTranslate.getData();
+                if (entityMap.size == 0) {
+                    RcsbFvCoreBuilder_1.RcsbFvCoreBuilder.showMessage(elementFvId, "No genome alignments are available");
+                }
+                else {
+                    const unique = new Set();
+                    RcsbFvCoreBuilder_1.RcsbFvCoreBuilder.buildSelectButton(elementFvId, entitySelectId, result.filter(r => {
+                        const included = unique.has(r.entryId + TagDelimiter_1.TagDelimiter.entity + r.entityId);
+                        unique.add(r.entryId + TagDelimiter_1.TagDelimiter.entity + r.entityId);
+                        return entityMap.has(r.entryId + TagDelimiter_1.TagDelimiter.entity + r.entityId) && !included;
+                    }).map((e, n) => {
+                        const entityId = e.entryId + TagDelimiter_1.TagDelimiter.entity + e.entityId;
+                        if (n == 0) {
+                            RcsbFvChromosomeBuilder.buildEntityChromosome(elementFvId, chromosomeSelectId, entityId).then((module) => {
+                                resolve(module);
+                            });
+                        }
+                        return {
+                            name: e.name + " - " + e.taxNames.join(", "),
+                            label: entityId + " - " + e.name,
+                            shortLabel: entityId,
+                            onChange: () => tslib_1.__awaiter(this, void 0, void 0, function* () {
+                                yield RcsbFvChromosomeBuilder.buildEntityChromosome(elementFvId, chromosomeSelectId, entityId);
+                            })
+                        };
+                    }), { addTitle: true, dropdownTitle: "ENTITY" });
+                }
+            }));
+        });
+    }
+    static buildEntityChromosome(elementFvId, elementSelectId, entityId) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const chrViewer = yield RcsbFvChromosomeBuilder.buildChromosome(elementFvId, entityId, undefined, elementSelectId, { boardConfig: { rowTitleWidth: 160 } });
+            const targets = yield chrViewer.getTargets();
+            RcsbFvCoreBuilder_1.RcsbFvCoreBuilder.buildSelectButton(elementFvId, elementSelectId, targets.map((chrId, n) => {
+                return {
+                    label: chrId,
+                    name: chrId,
+                    shortLabel: chrId,
+                    onChange: () => tslib_1.__awaiter(this, void 0, void 0, function* () {
+                        yield RcsbFvChromosomeBuilder.buildChromosome(elementFvId, entityId, chrId, elementSelectId);
+                    })
+                };
+            }), { addTitle: false, width: 190, dropdownTitle: "CHROMOSOME" });
+            return chrViewer;
+        });
+    }
+    static buildChromosome(elementFvId, entityId, chrId, elementSelectId, additionalConfig) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            return new Promise((resolve, reject) => {
+                try {
+                    RcsbFvCoreBuilder_1.RcsbFvCoreBuilder.createFv({
+                        elementId: elementFvId,
+                        fvModuleI: RcsbFvChromosome_1.RcsbFvChromosome,
+                        config: {
+                            entityId: entityId,
+                            chrId: chrId,
+                            elementSelectId: elementSelectId,
+                            additionalConfig: Object.assign({ rcsbContext: Object.assign(Object.assign({}, (entityId ? TagDelimiter_1.TagDelimiter.parseEntity(entityId) : {})), { chrId: chrId }) }, additionalConfig),
+                            resolve: resolve
+                        }
+                    });
+                }
+                catch (e) {
+                    reject(e);
+                }
+            });
+        });
+    }
+}
+exports.RcsbFvChromosomeBuilder = RcsbFvChromosomeBuilder;

package/lib/commonjs/RcsbFvWeb/RcsbFvBuilder/RcsbFvContextManager.d.ts

@@ -0,0 +1,14 @@
+import { RcsbFv } from "@rcsb/rcsb-saguaro/lib/RcsbFv/RcsbFv";
+import { RcsbFvBoardConfigInterface } from "@rcsb/rcsb-saguaro/lib/RcsbFv/RcsbFvConfig/RcsbFvConfigInterface";
+declare class RcsbFvContextManager {
+    private readonly rcsbFvManager;
+    private readonly rcsbButtonManager;
+    getFv(elementFvId: string, boardConfig?: Partial<RcsbFvBoardConfigInterface>): RcsbFv;
+    hasFv(elementFvId: string): boolean;
+    private setFv;
+    getButtonList(elementFvId: string): Set<string> | undefined;
+    setButton(elementFvId: string, buttonId: string): void;
+    removeFv(elementFvId: string): void;
+}
+export declare const rcsbFvCtxManager: RcsbFvContextManager;
+export {};

package/lib/commonjs/RcsbFvWeb/RcsbFvBuilder/RcsbFvContextManager.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.rcsbFvCtxManager = void 0;
+const RcsbFv_1 = require("@rcsb/rcsb-saguaro/lib/RcsbFv/RcsbFv");
+const RcsbFvTooltip_1 = require("../RcsbFvTooltip/RcsbFvTooltip");
+class RcsbFvContextManager {
+    constructor() {
+        this.rcsbFvManager = new Map();
+        this.rcsbButtonManager = new Map();
+    }
+    getFv(elementFvId, boardConfig) {
+        const o = this.rcsbFvManager.get(elementFvId);
+        if (o) {
+            return o;
+        }
+        else {
+            const rcsbFvSingleViewer = buildRcsbFvSingleViewer(elementFvId, boardConfig);
+            this.setFv(elementFvId, rcsbFvSingleViewer);
+            return rcsbFvSingleViewer;
+        }
+    }
+    hasFv(elementFvId) {
+        return this.rcsbFvManager.has(elementFvId);
+    }
+    setFv(elementFvId, rcsbFv) {
+        this.rcsbFvManager.set(elementFvId, rcsbFv);
+    }
+    getButtonList(elementFvId) {
+        return this.rcsbButtonManager.get(elementFvId);
+    }
+    setButton(elementFvId, buttonId) {
+        var _a;
+        if (this.rcsbButtonManager.get(elementFvId) == null)
+            this.rcsbButtonManager.set(elementFvId, new Set());
+        (_a = this.rcsbButtonManager.get(elementFvId)) === null || _a === void 0 ? void 0 : _a.add(buttonId);
+    }
+    removeFv(elementFvId) {
+        this.rcsbFvManager.delete(elementFvId);
+        if (this.rcsbButtonManager.has(elementFvId))
+            this.rcsbButtonManager.delete(elementFvId);
+    }
+}
+function buildRcsbFvSingleViewer(elementId, boardConfig) {
+    const config = Object.assign({ rowTitleWidth: 190, trackWidth: 900, tooltipGenerator: new RcsbFvTooltip_1.RcsbFvTooltip() }, boardConfig);
+    return new RcsbFv_1.RcsbFv({
+        rowConfigData: [],
+        boardConfigData: config,
+        elementId: elementId
+    });
+}
+exports.rcsbFvCtxManager = new RcsbFvContextManager();

package/lib/commonjs/RcsbFvWeb/RcsbFvBuilder/RcsbFvCoreBuilder.d.ts

@@ -0,0 +1,35 @@
+import { PolymerEntityInstanceTranslate } from "../../RcsbUtils/Translators/PolymerEntityInstanceTranslate";
+import { RcsbFv } from "@rcsb/rcsb-saguaro/lib/RcsbFv/RcsbFv";
+import { RcsbFvModuleBuildInterface, RcsbFvModuleInterface, RcsbFvModulePublicInterface } from "../RcsbFvModule/RcsbFvModuleInterface";
+import { SelectButtonConfigInterface } from "../RcsbFvComponents/ComponentsManager";
+import { GroupedOptionsInterface, SelectOptionInterface } from "../RcsbFvComponents/SelectButton";
+export interface CreateFvInterface {
+    elementId: string;
+    fvModuleI: new (elementId: string, rcsbFv: RcsbFv) => RcsbFvModuleInterface;
+    config: RcsbFvModuleBuildInterface;
+    p?: PolymerEntityInstanceTranslate;
+}
+/**
+ * This class provides static methods to build PFVs. PFVs should be always created using methods in this class
+ * */
+export declare class RcsbFvCoreBuilder {
+    /**
+     * @description The main purpose of this method is to have a unique point where Entity to Instance maps are collected.  It forces to generate a <PolymerEntityInstanceTranslate> that will be passed to the PFV create method <getPolymerEntityInstanceMapAndBuildFv>
+     * @param entryId PDB entry Id
+     * @param createFvBuilder This is the function used to create the PFV. Cases where buttons are needed will be created in custom definitions of createFvBuilder. The PFV should be always created calling RcsbFvCoreBuilder.createFv
+     * */
+    static getPolymerEntityInstanceMapAndCustomBuildFv(entryId: string, createFvBuilder: (p: PolymerEntityInstanceTranslate) => Promise<RcsbFvModulePublicInterface>): Promise<RcsbFvModulePublicInterface>;
+    /**
+     * @description Generic method to create PFVs. This method must be used if no other elements such as buttons are needed.
+     * */
+    static getPolymerEntityInstanceMapAndBuildFv(elementId: string, entryId: string, fvModuleI: new (elementId: string, rcsbFv: RcsbFv) => RcsbFvModuleInterface, config: RcsbFvModuleBuildInterface): Promise<RcsbFvModulePublicInterface>;
+    /**
+     * @description This method implements a centralized point where PFVs are created. All PFV should be created using this method directly or through <CreateFvInterface.getPolymerEntityInstanceMapAndBuildFv>. In any case PFV should be built using a custom implementation.
+     * */
+    static createFv(createFvI: CreateFvInterface): Promise<RcsbFvModulePublicInterface>;
+    static unmount(elementId: string): void;
+    static buildSelectButton(elementFvId: string, selectButtonId: string, options: Array<SelectOptionInterface> | Array<GroupedOptionsInterface>, config?: SelectButtonConfigInterface): void;
+    static clearAdditionalSelectButton(elementFvId: string, selectButtonId: string): void;
+    static addSelectButton(elementFvId: string, selectButtonId: string, options: Array<SelectOptionInterface>, config?: SelectButtonConfigInterface): void;
+    static showMessage(elementId: string, message: string): void;
+}

package/lib/commonjs/RcsbFvWeb/RcsbFvBuilder/RcsbFvCoreBuilder.js

@@ -0,0 +1,95 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RcsbFvCoreBuilder = void 0;
+const tslib_1 = require("tslib");
+const RcsbFvContextManager_1 = require("./RcsbFvContextManager");
+const ComponentsManager_1 = require("../RcsbFvComponents/ComponentsManager");
+const RcsbRequestContextManager_1 = require("../../RcsbRequest/RcsbRequestContextManager");
+/**
+ * This class provides static methods to build PFVs. PFVs should be always created using methods in this class
+ * */
+class RcsbFvCoreBuilder {
+    /**
+     * @description The main purpose of this method is to have a unique point where Entity to Instance maps are collected.  It forces to generate a <PolymerEntityInstanceTranslate> that will be passed to the PFV create method <getPolymerEntityInstanceMapAndBuildFv>
+     * @param entryId PDB entry Id
+     * @param createFvBuilder This is the function used to create the PFV. Cases where buttons are needed will be created in custom definitions of createFvBuilder. The PFV should be always created calling RcsbFvCoreBuilder.createFv
+     * */
+    static getPolymerEntityInstanceMapAndCustomBuildFv(entryId, createFvBuilder) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const entityToInstance = yield RcsbRequestContextManager_1.rcsbRequestCtxManager.getEntityToInstance(entryId);
+            return yield createFvBuilder(entityToInstance);
+        });
+    }
+    /**
+     * @description Generic method to create PFVs. This method must be used if no other elements such as buttons are needed.
+     * */
+    static getPolymerEntityInstanceMapAndBuildFv(elementId, entryId, fvModuleI, config) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const entityToInstance = yield RcsbRequestContextManager_1.rcsbRequestCtxManager.getEntityToInstance(entryId);
+            return yield RcsbFvCoreBuilder.createFv({
+                elementId: elementId,
+                fvModuleI: fvModuleI,
+                config: config,
+                p: entityToInstance
+            });
+        });
+    }
+    /**
+     * @description This method implements a centralized point where PFVs are created. All PFV should be created using this method directly or through <CreateFvInterface.getPolymerEntityInstanceMapAndBuildFv>. In any case PFV should be built using a custom implementation.
+     * */
+    static createFv(createFvI) {
+        var _a;
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const elementId = createFvI.elementId;
+            const fvModuleI = createFvI.fvModuleI;
+            const config = createFvI.config;
+            const p = createFvI.p;
+            const rcsbFv = RcsbFvContextManager_1.rcsbFvCtxManager.getFv(elementId, (_a = createFvI.config.additionalConfig) === null || _a === void 0 ? void 0 : _a.boardConfig);
+            yield rcsbFv.then(() => {
+                console.info(`PFV ${elementId} render complete`);
+            });
+            const rcsbFvInstance = new fvModuleI(elementId, rcsbFv);
+            if (p != null)
+                rcsbFvInstance.setPolymerEntityInstanceTranslator(p);
+            yield rcsbFvInstance.build(config);
+            if (!rcsbFvInstance.activeDisplay())
+                throw "ERROR: Module display failed";
+            config.resolve(rcsbFvInstance);
+            return rcsbFvInstance;
+        });
+    }
+    static unmount(elementId) {
+        var _a;
+        if (RcsbFvContextManager_1.rcsbFvCtxManager.hasFv(elementId)) {
+            if (RcsbFvContextManager_1.rcsbFvCtxManager.getButtonList(elementId) != null) {
+                (_a = RcsbFvContextManager_1.rcsbFvCtxManager.getButtonList(elementId)) === null || _a === void 0 ? void 0 : _a.forEach(buttonId => {
+                    ComponentsManager_1.ComponentsManager.clearSelectButton(buttonId);
+                });
+            }
+            RcsbFvContextManager_1.rcsbFvCtxManager.getFv(elementId).unmount();
+            RcsbFvContextManager_1.rcsbFvCtxManager.removeFv(elementId);
+        }
+    }
+    static buildSelectButton(elementFvId, selectButtonId, options, config) {
+        RcsbFvContextManager_1.rcsbFvCtxManager.setButton(elementFvId, selectButtonId);
+        ComponentsManager_1.ComponentsManager.buildSelectButton(selectButtonId, options, config);
+    }
+    static clearAdditionalSelectButton(elementFvId, selectButtonId) {
+        var _a, _b;
+        if ((_a = RcsbFvContextManager_1.rcsbFvCtxManager.getButtonList(elementFvId)) === null || _a === void 0 ? void 0 : _a.has(selectButtonId)) {
+            (_b = RcsbFvContextManager_1.rcsbFvCtxManager.getButtonList(elementFvId)) === null || _b === void 0 ? void 0 : _b.delete(selectButtonId);
+        }
+        ComponentsManager_1.ComponentsManager.clearAdditionalSelectButton(selectButtonId);
+    }
+    static addSelectButton(elementFvId, selectButtonId, options, config) {
+        RcsbFvContextManager_1.rcsbFvCtxManager.setButton(elementFvId, selectButtonId);
+        ComponentsManager_1.ComponentsManager.addSelectButton(selectButtonId, options, config);
+    }
+    static showMessage(elementId, message) {
+        var _a;
+        const domElement = document.createElement("h4");
+        domElement.innerHTML = message;
+        (_a = document.getElementById(elementId)) === null || _a === void 0 ? void 0 : _a.append(domElement);
+    }
+}
+exports.RcsbFvCoreBuilder = RcsbFvCoreBuilder;

package/lib/commonjs/RcsbFvWeb/RcsbFvBuilder/RcsbFvDataProviderBuilder.d.ts

@@ -0,0 +1,4 @@
+import { RcsbFvAdditionalConfig, RcsbFvModulePublicInterface } from "../RcsbFvModule/RcsbFvModuleInterface";
+export declare class RcsbFvDataProviderBuilder {
+    static buildFv(elementId: string, additionalConfig?: RcsbFvAdditionalConfig): Promise<RcsbFvModulePublicInterface>;
+}

package/lib/commonjs/RcsbFvWeb/RcsbFvBuilder/RcsbFvDataProviderBuilder.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RcsbFvDataProviderBuilder = void 0;
+const tslib_1 = require("tslib");
+const RcsbFvCoreBuilder_1 = require("./RcsbFvCoreBuilder");
+const RcsbFvDataProvider_1 = require("../RcsbFvModule/RcsbFvDataProvider");
+const GroupPfvUI_1 = require("../../RcsbFvUI/GroupPfvUI");
+class RcsbFvDataProviderBuilder {
+    static buildFv(elementId, additionalConfig) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            return new Promise((resolve, reject) => {
+                var _a, _b;
+                try {
+                    RcsbFvCoreBuilder_1.RcsbFvCoreBuilder.createFv({
+                        elementId,
+                        fvModuleI: RcsbFvDataProvider_1.RcsbFvDataProvider,
+                        config: {
+                            resolve,
+                            additionalConfig
+                        }
+                    });
+                    GroupPfvUI_1.GroupPfvUI.fvUI(GroupPfvUI_1.GroupPfvUI.addBootstrapElement(elementId), (additionalConfig === null || additionalConfig === void 0 ? void 0 : additionalConfig.externalUiComponents) ? [...((_a = additionalConfig.externalUiComponents.add) !== null && _a !== void 0 ? _a : []), ...((_b = additionalConfig.externalUiComponents.replace) !== null && _b !== void 0 ? _b : [])] : []);
+                }
+                catch (e) {
+                    reject(e);
+                }
+            });
+        });
+    }
+}
+exports.RcsbFvDataProviderBuilder = RcsbFvDataProviderBuilder;

package/lib/commonjs/RcsbFvWeb/RcsbFvBuilder/RcsbFvEntityBuilder.d.ts

@@ -0,0 +1,7 @@
+import { RcsbFvAdditionalConfig } from "../RcsbFvModule/RcsbFvModuleInterface";
+import { RcsbFvModulePublicInterface } from "../RcsbFvModule/RcsbFvModuleInterface";
+export declare class RcsbFvEntityBuilder {
+    static buildEntitySummaryFv(elementFvId: string, elementSelectId: string, entityId: string): Promise<RcsbFvModulePublicInterface>;
+    static buildSingleEntitySummaryFv(elementId: string, entityId: string): Promise<RcsbFvModulePublicInterface>;
+    static buildEntityFv(elementId: string, entityId: string, additionalConfig?: RcsbFvAdditionalConfig): Promise<RcsbFvModulePublicInterface>;
+}