@finsemble/finsemble-ui 1.0.0-beta-1

package/react/components/sdd/ExportDeployInfo.js

@@ -0,0 +1,18 @@
+import React, { useRef } from "react";
+import { ButtonIcon } from "../common/ButtonIcon";
+import { useSelector } from "../../store";
+export const ExportDeployInfo = () => {
+    const publishURLRef = useRef(null);
+    const deployInfo = useSelector((store) => store.smartDesktopDesigner.export.deployInfo);
+    return (React.createElement("div", { className: "export-publish-url" },
+        React.createElement("input", { "aria-label": "Publish URL", type: "text", disabled: true, value: deployInfo === null || deployInfo === void 0 ? void 0 : deployInfo.installerURL, ref: publishURLRef }),
+        React.createElement(ButtonIcon, { text: "Copy", icon: "copy", onClick: () => {
+                const input = publishURLRef.current;
+                input.disabled = false;
+                input.focus();
+                input.select();
+                document.execCommand("copy");
+                input.disabled = true;
+            } })));
+};
+//# sourceMappingURL=ExportDeployInfo.js.map

package/react/components/sdd/ExportDeployInfo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExportDeployInfo.js","sourceRoot":"","sources":["../../../src/components/sdd/ExportDeployInfo.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG1C,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE;IACpC,MAAM,aAAa,GAAG,MAAM,CAA0B,IAAI,CAAC,CAAC;IAE5D,MAAM,UAAU,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;IAEnG,OAAO,CACN,6BAAK,SAAS,EAAC,oBAAoB;QAClC,6CAAkB,aAAa,EAAC,IAAI,EAAC,MAAM,EAAC,QAAQ,QAAC,KAAK,EAAE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,YAAY,EAAE,GAAG,EAAE,aAAa,GAAI;QAC5G,oBAAC,UAAU,IACV,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,GAAG,EAAE;gBACb,MAAM,KAAK,GAAG,aAAa,CAAC,OAA2B,CAAC;gBACxD,KAAK,CAAC,QAAQ,GAAG,KAAK,CAAC;gBACvB,KAAK,CAAC,KAAK,EAAE,CAAC;gBACd,KAAK,CAAC,MAAM,EAAE,CAAC;gBACf,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;gBAC7B,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC;YACvB,CAAC,GACA,CACG,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useRef } from \"react\";\nimport { ButtonIcon } from \"../common/ButtonIcon\";\nimport { useSelector } from \"../../store\";\nimport { RootState } from \"../../reducers/rootReducer\";\n\nexport const ExportDeployInfo = () => {\n\tconst publishURLRef = useRef<HTMLInputElement | null>(null);\n\n\tconst deployInfo = useSelector((store: RootState) => store.smartDesktopDesigner.export.deployInfo);\n\n\treturn (\n\t\t<div className=\"export-publish-url\">\n\t\t\t<input aria-label=\"Publish URL\" type=\"text\" disabled value={deployInfo?.installerURL} ref={publishURLRef} />\n\t\t\t<ButtonIcon\n\t\t\t\ttext=\"Copy\"\n\t\t\t\ticon=\"copy\"\n\t\t\t\tonClick={() => {\n\t\t\t\t\tconst input = publishURLRef.current as HTMLInputElement;\n\t\t\t\t\tinput.disabled = false;\n\t\t\t\t\tinput.focus();\n\t\t\t\t\tinput.select();\n\t\t\t\t\tdocument.execCommand(\"copy\");\n\t\t\t\t\tinput.disabled = true;\n\t\t\t\t}}\n\t\t\t/>\n\t\t</div>\n\t);\n};\n"]}

package/react/components/sdd/ExportZip.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { ExportProps } from "./Export";
+export declare type ExportZipProps = ExportProps & {
+    valid: boolean;
+};
+export declare const ExportZip: (props: ExportZipProps) => JSX.Element;

package/react/components/sdd/ExportZip.js

@@ -0,0 +1,48 @@
+import React, { useState } from "react";
+import { useSelector } from "../../store";
+import { FinsembleIcon } from "../common/FinsembleIcon";
+import { Button } from "../common/Button";
+import { Checkbox } from "../common/Checkbox";
+export const ExportZip = (props) => {
+    const projectSettings = useSelector((store) => store.smartDesktopDesigner.projectInfo);
+    const projectErrors = useSelector((store) => store.smartDesktopDesigner.errors);
+    const [isCopying, setIsCopying] = useState(false);
+    const [lastExportCount, setLastExportCount] = useState(0);
+    const [lastExportTime, setLastExportTime] = useState(null);
+    const [lastExportError, setLastExportError] = useState(null);
+    const [iUnderstand, setIUnderstand] = useState(false);
+    return (React.createElement("div", { className: "export-method" },
+        React.createElement("div", null,
+            React.createElement("h2", null, "Package project"),
+            React.createElement("p", null, "Many Finsemble features can't be configured by using SDD. Share your project with developers or IT to take it further."),
+            React.createElement(Checkbox, { label: "I understand that packaging a project is a one-time only operation. A packaged .zip file can\u2019t be imported back into SDD.", checked: iUnderstand, onClick: () => {
+                    setIUnderstand(!iUnderstand);
+                } })),
+        React.createElement("div", { className: "export-method-actions" },
+            !isCopying ? (React.createElement(Button, { className: "export-method-button", disabled: projectErrors.length > 0 || !props.valid || !iUnderstand, fashion: "secondary", text: "Package", buttonAttributes: { "data-target-upload-path": "" }, onClick: (e) => {
+                    setIsCopying(true);
+                    setLastExportError(null);
+                    props
+                        .copyProjectFiles(projectSettings.name, e.currentTarget.dataset.targetUploadPath)
+                        .catch((error) => {
+                        setLastExportError(error);
+                    })
+                        .then((files) => {
+                        setLastExportTime(new Date().toLocaleTimeString());
+                        if (files) {
+                            setLastExportCount(files.length);
+                        }
+                    })
+                        .finally(() => {
+                        setIsCopying(false);
+                    });
+                } })) : (React.createElement("div", null, "Exporting to seed project...")),
+            lastExportTime !== null && lastExportCount > 0 && (React.createElement("span", { className: "last-export-time" },
+                React.createElement(FinsembleIcon, { className: "last-export-time-icon", icon: "check" }),
+                "Exported ",
+                lastExportCount,
+                " files at ",
+                lastExportTime)),
+            lastExportError !== null && React.createElement("span", { className: "last-export-error" }, lastExportError))));
+};
+//# sourceMappingURL=ExportZip.js.map

package/react/components/sdd/ExportZip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExportZip.js","sourceRoot":"","sources":["../../../src/components/sdd/ExportZip.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState } from \"react\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport { useSelector } from \"../../store\";\nimport { FinsembleIcon } from \"../common/FinsembleIcon\";\nimport { ExportProps } from \"./Export\";\nimport { Button } from \"../common/Button\";\nimport { Checkbox } from \"../common/Checkbox\";\n\nexport type ExportZipProps = ExportProps & {\n\tvalid: boolean;\n};\n\nexport const ExportZip = (props: ExportZipProps) => {\n\tconst projectSettings = useSelector((store: RootState) => store.smartDesktopDesigner.projectInfo);\n\tconst projectErrors = useSelector((store: RootState) => store.smartDesktopDesigner.errors);\n\n\tconst [isCopying, setIsCopying] = useState(false);\n\tconst [lastExportCount, setLastExportCount] = useState<number>(0);\n\tconst [lastExportTime, setLastExportTime] = useState<null | string>(null);\n\tconst [lastExportError, setLastExportError] = useState<null | string>(null);\n\tconst [iUnderstand, setIUnderstand] = useState(false);\n\n\treturn (\n\t\t<div className=\"export-method\">\n\t\t\t<div>\n\t\t\t\t<h2>Package project</h2>\n\n\t\t\t\t<p>\n\t\t\t\t\tMany Finsemble features can&apos;t be configured by using SDD. Share your project with developers or IT to\n\t\t\t\t\ttake it further.\n\t\t\t\t</p>\n\n\t\t\t\t<Checkbox\n\t\t\t\t\tlabel=\"I understand that packaging a project is a one-time only operation. A packaged .zip file can’t be imported back into SDD.\"\n\t\t\t\t\tchecked={iUnderstand}\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tsetIUnderstand(!iUnderstand);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t<div className=\"export-method-actions\">\n\t\t\t\t{!isCopying ? (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"export-method-button\"\n\t\t\t\t\t\tdisabled={projectErrors.length > 0 || !props.valid || !iUnderstand}\n\t\t\t\t\t\tfashion=\"secondary\"\n\t\t\t\t\t\ttext=\"Package\"\n\t\t\t\t\t\tbuttonAttributes={{ \"data-target-upload-path\": \"\" }}\n\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\tsetIsCopying(true);\n\t\t\t\t\t\t\tsetLastExportError(null);\n\n\t\t\t\t\t\t\tprops\n\t\t\t\t\t\t\t\t.copyProjectFiles(projectSettings.name, e.currentTarget.dataset.targetUploadPath)\n\t\t\t\t\t\t\t\t.catch((error) => {\n\t\t\t\t\t\t\t\t\tsetLastExportError(error);\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t\t.then((files) => {\n\t\t\t\t\t\t\t\t\tsetLastExportTime(new Date().toLocaleTimeString());\n\n\t\t\t\t\t\t\t\t\tif (files) {\n\t\t\t\t\t\t\t\t\t\tsetLastExportCount(files.length);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t\t.finally(() => {\n\t\t\t\t\t\t\t\t\tsetIsCopying(false);\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<div>Exporting to seed project...</div>\n\t\t\t\t)}\n\t\t\t\t{lastExportTime !== null && lastExportCount > 0 && (\n\t\t\t\t\t<span className=\"last-export-time\">\n\t\t\t\t\t\t<FinsembleIcon className=\"last-export-time-icon\" icon=\"check\"></FinsembleIcon>\n\t\t\t\t\t\tExported {lastExportCount} files at {lastExportTime}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t{lastExportError !== null && <span className=\"last-export-error\">{lastExportError}</span>}\n\t\t\t\t{/* <button type=\"submit\">Share to Github</button> */}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"]}

package/react/components/sdd/GettingStarted.d.ts

@@ -0,0 +1,8 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+/// <reference types="react" />
+import "./css/getting-started.css";
+export declare type GettingStartedProps = {};
+export declare const GettingStarted: () => JSX.Element;

package/react/components/sdd/GettingStarted.js

@@ -0,0 +1,25 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+import React from "react";
+import { useDispatch } from "../../store";
+import { Header } from "../common/Header";
+import { View } from "./View";
+import { Content } from "./Content";
+import { launchTutorialLink } from "./common/fsbl_functions";
+import "./css/getting-started.css";
+export const GettingStarted = () => {
+    const dispatch = useDispatch();
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: "getting-started-gray-back" }),
+        React.createElement(View, null,
+            React.createElement(Header, { helpFunction: () => {
+                    launchTutorialLink("SDD-01-Welcome");
+                } }, "Smart Desktop Designer"),
+            React.createElement(Content, null,
+                React.createElement("p", null, "Design a smart desktop. Add, remove, and manage apps; arrange your workspaces. Customize the look to follow your branding. When you're done, publish your desktop to share with others or package it for further development."),
+                React.createElement("div", { className: "hero" },
+                    React.createElement("img", { src: "/build/assets/img/finsemble-display.png", width: "436px", height: "354px", alt: "" }))))));
+};
+//# sourceMappingURL=GettingStarted.js.map

package/react/components/sdd/GettingStarted.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GettingStarted.js","sourceRoot":"","sources":["../../../src/components/sdd/GettingStarted.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAE1C,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAI7D,OAAO,2BAA2B,CAAC;AAInC,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IAClC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAE/B,OAAO,CACN;QACC,6BAAK,SAAS,EAAC,2BAA2B,GAAG;QAC7C,oBAAC,IAAI;YACJ,oBAAC,MAAM,IACN,YAAY,EAAE,GAAG,EAAE;oBAClB,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;gBACtC,CAAC,6BAGO;YAET,oBAAC,OAAO;gBACP,+PAII;gBAEJ,6BAAK,SAAS,EAAC,MAAM;oBACpB,6BAAK,GAAG,EAAC,yCAAyC,EAAC,KAAK,EAAC,OAAO,EAAC,MAAM,EAAC,OAAO,EAAC,GAAG,EAAC,EAAE,GAAG,CACpF,CACG,CACJ,CACL,CACH,CAAC;AACH,CAAC,CAAC","sourcesContent":["/*!\n * Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React from \"react\";\nimport { useDispatch } from \"../../store\";\nimport { Header } from \"../common/Header\";\nimport { ButtonTile } from \"../common/ButtonTile\";\nimport { View } from \"./View\";\nimport { Content } from \"./Content\";\nimport { launchTutorialLink } from \"./common/fsbl_functions\";\n\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\n\nimport \"./css/getting-started.css\";\n\nexport type GettingStartedProps = {};\n\nexport const GettingStarted = () => {\n\tconst dispatch = useDispatch();\n\n\treturn (\n\t\t<>\n\t\t\t<div className=\"getting-started-gray-back\" />\n\t\t\t<View>\n\t\t\t\t<Header\n\t\t\t\t\thelpFunction={() => {\n\t\t\t\t\t\tlaunchTutorialLink(\"SDD-01-Welcome\");\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\tSmart Desktop Designer\n\t\t\t\t</Header>\n\n\t\t\t\t<Content>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tDesign a smart desktop. Add, remove, and manage apps; arrange your workspaces. Customize the look to follow\n\t\t\t\t\t\tyour branding. When you&apos;re done, publish your desktop to share with others or package it for further\n\t\t\t\t\t\tdevelopment.\n\t\t\t\t\t</p>\n\n\t\t\t\t\t<div className=\"hero\">\n\t\t\t\t\t\t<img src=\"/build/assets/img/finsemble-display.png\" width=\"436px\" height=\"354px\" alt=\"\" />\n\t\t\t\t\t</div>\n\t\t\t\t</Content>\n\t\t\t</View>\n\t\t</>\n\t);\n};\n"]}

package/react/components/sdd/ItemList.d.ts

@@ -0,0 +1,17 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+import { ReactNode } from "react";
+import "../common/css/application-list.css";
+export declare type ItemListProps = {
+    items: any[];
+    getItemId?: (item: any) => string;
+    getItemDisplayName?: (item: any) => string;
+    clickItem: (s: string) => void;
+    deleteItem: (s: string) => void;
+    editItem?: (s: string) => void;
+    emptyListMessage?: ReactNode;
+    className?: string;
+};
+export declare const ItemList: ({ items, clickItem, deleteItem, editItem, getItemId, getItemDisplayName, emptyListMessage, className, }: ItemListProps) => JSX.Element;

package/react/components/sdd/ItemList.js

@@ -0,0 +1,58 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+import React from "react";
+import { ButtonIcon } from "../common/ButtonIcon";
+import "../common/css/application-list.css";
+export const ItemList = ({ items, clickItem, deleteItem, editItem, getItemId = (item) => item.appId, getItemDisplayName = (item) => { var _a, _b; return ((_b = (_a = item.manifest) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.displayName) || item.name || item.appId; }, emptyListMessage = (React.createElement(React.Fragment, null,
+    "There\u2019s nothing here!",
+    React.createElement("br", null),
+    "Click the Add button to add apps.")), className = "", }) => (React.createElement(React.Fragment, null, items.length < 1 ? (React.createElement("div", { className: `app-list-empty ${className}` }, emptyListMessage)) : (React.createElement("div", { className: `app-list-table ${className}`, role: "list" }, items
+    .sort((a, b) => {
+    if (getItemDisplayName(a) > getItemDisplayName(b)) {
+        return 1;
+    }
+    else if (getItemDisplayName(b) > getItemDisplayName(a)) {
+        return -1;
+    }
+    return 0;
+})
+    .map((item) => {
+    const appID = getItemId(item);
+    const openItemEventHandler = (e) => {
+        clickItem(appID);
+        e.preventDefault();
+    };
+    const editItemEventHandler = (e) => {
+        e.stopPropagation();
+        editItem === null || editItem === void 0 ? void 0 : editItem(appID);
+        e.preventDefault();
+    };
+    const deleteItemEventHandler = (e) => {
+        e.stopPropagation();
+        deleteItem(appID);
+    };
+    const keyDownHandler = (e) => {
+        switch (e.key) {
+            case "Enter":
+            case " ": {
+                openItemEventHandler(e);
+                break;
+            }
+            case "Delete": {
+                deleteItemEventHandler(e);
+                break;
+            }
+            default: {
+            }
+        }
+    };
+    const displayName = getItemDisplayName(item);
+    return (React.createElement("div", { key: appID, id: `app-list-row-${appID}`, className: "app-list-row", role: "listitem", tabIndex: 0, onClick: openItemEventHandler, onKeyDown: keyDownHandler },
+        React.createElement("span", { className: "app-name" }, displayName),
+        React.createElement("div", { className: "icon-bar" },
+            editItem && (React.createElement(ButtonIcon, { className: "icon-edit", icon: "pencil", text: "Edit", onClick: editItemEventHandler })),
+            React.createElement(ButtonIcon, { tabIndex: -1, className: "icon-delete", icon: "trash", text: "Delete", onClick: deleteItemEventHandler }))));
+})))));
+//# sourceMappingURL=ItemList.js.map

package/react/components/sdd/ItemList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ItemList.js","sourceRoot":"","sources":["../../../src/components/sdd/ItemList.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,oCAAoC,CAAC;AAa5C,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EACxB,KAAK,EACL,SAAS,EACT,UAAU,EACV,QAAQ,EACR,SAAS,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,KAAK,EAChC,kBAAkB,GAAG,CAAC,IAAI,EAAE,EAAE,eAAC,OAAA,CAAA,MAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,SAAS,0CAAE,WAAW,KAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,KAAK,CAAA,EAAA,EAC/F,gBAAgB,GAAG,CAClB;;IAEC,+BAAM;wCAEJ,CACH,EACD,SAAS,GAAG,EAAE,GACC,EAAE,EAAE,CAAC,CACpB,0CACE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACnB,6BAAK,SAAS,EAAE,kBAAkB,SAAS,EAAE,IAAG,gBAAgB,CAAO,CACvE,CAAC,CAAC,CAAC,CACH,6BAAK,SAAS,EAAE,kBAAkB,SAAS,EAAE,EAAE,IAAI,EAAC,MAAM,IACxD,KAAK;KACJ,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;IACd,IAAI,kBAAkB,CAAC,CAAC,CAAC,GAAG,kBAAkB,CAAC,CAAC,CAAC,EAAE;QAClD,OAAO,CAAC,CAAC;KACT;SAAM,IAAI,kBAAkB,CAAC,CAAC,CAAC,GAAG,kBAAkB,CAAC,CAAC,CAAC,EAAE;QACzD,OAAO,CAAC,CAAC,CAAC;KACV;IAED,OAAO,CAAC,CAAC;AACV,CAAC,CAAC;KACD,GAAG,CAAC,CAAC,IAAS,EAAE,EAAE;IAClB,MAAM,KAAK,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC;IAE9B,MAAM,oBAAoB,GAAG,CAAC,CAA2D,EAAE,EAAE;QAC5F,SAAS,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC,CAAC,cAAc,EAAE,CAAC;IACpB,CAAC,CAAC;IACF,MAAM,oBAAoB,GAAG,CAAC,CAA2D,EAAE,EAAE;QAC5F,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,KAAK,CAAC,CAAC;QAClB,CAAC,CAAC,cAAc,EAAE,CAAC;IACpB,CAAC,CAAC;IACF,MAAM,sBAAsB,GAAG,CAAC,CAA2D,EAAE,EAAE;QAC9F,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,UAAU,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC,CAAC;IACF,MAAM,cAAc,GAAG,CAAC,CAAsC,EAAE,EAAE;QACjE,QAAQ,CAAC,CAAC,GAAG,EAAE;YACd,KAAK,OAAO,CAAC;YACb,KAAK,GAAG,CAAC,CAAC;gBACT,oBAAoB,CAAC,CAAC,CAAC,CAAC;gBACxB,MAAM;aACN;YACD,KAAK,QAAQ,CAAC,CAAC;gBACd,sBAAsB,CAAC,CAAC,CAAC,CAAC;gBAC1B,MAAM;aACN;YACD,OAAO,CAAC,CAAC;aACR;SACD;IACF,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAE7C,OAAO,CACN,6BACC,GAAG,EAAE,KAAK,EACV,EAAE,EAAE,gBAAgB,KAAK,EAAE,EAC3B,SAAS,EAAC,cAAc,EACxB,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,CAAC,EACX,OAAO,EAAE,oBAAoB,EAC7B,SAAS,EAAE,cAAc;QAEzB,8BAAM,SAAS,EAAC,UAAU,IAAE,WAAW,CAAQ;QAC/C,6BAAK,SAAS,EAAC,UAAU;YACvB,QAAQ,IAAI,CACZ,oBAAC,UAAU,IAAC,SAAS,EAAC,WAAW,EAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,MAAM,EAAC,OAAO,EAAE,oBAAoB,GAAI,CAC7F;YACD,oBAAC,UAAU,IACV,QAAQ,EAAE,CAAC,CAAC,EACZ,SAAS,EAAC,aAAa,EACvB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,sBAAsB,GAC9B,CACG,CACD,CACN,CAAC;AACH,CAAC,CAAC,CACE,CACN,CACC,CACH,CAAC","sourcesContent":["/*!\n * Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React, { ReactNode } from \"react\";\nimport { ButtonIcon } from \"../common/ButtonIcon\";\nimport \"../common/css/application-list.css\";\n\nexport type ItemListProps = {\n\titems: any[];\n\tgetItemId?: (item: any) => string;\n\tgetItemDisplayName?: (item: any) => string;\n\tclickItem: (s: string) => void;\n\tdeleteItem: (s: string) => void;\n\teditItem?: (s: string) => void;\n\temptyListMessage?: ReactNode;\n\tclassName?: string;\n};\n\nexport const ItemList = ({\n\titems,\n\tclickItem,\n\tdeleteItem,\n\teditItem,\n\tgetItemId = (item) => item.appId,\n\tgetItemDisplayName = (item) => item.manifest?.component?.displayName || item.name || item.appId,\n\temptyListMessage = (\n\t\t<>\n\t\t\tThere’s nothing here!\n\t\t\t<br />\n\t\t\tClick the Add button to add apps.\n\t\t</>\n\t),\n\tclassName = \"\",\n}: ItemListProps) => (\n\t<>\n\t\t{items.length < 1 ? (\n\t\t\t<div className={`app-list-empty ${className}`}>{emptyListMessage}</div>\n\t\t) : (\n\t\t\t<div className={`app-list-table ${className}`} role=\"list\">\n\t\t\t\t{items\n\t\t\t\t\t.sort((a, b) => {\n\t\t\t\t\t\tif (getItemDisplayName(a) > getItemDisplayName(b)) {\n\t\t\t\t\t\t\treturn 1;\n\t\t\t\t\t\t} else if (getItemDisplayName(b) > getItemDisplayName(a)) {\n\t\t\t\t\t\t\treturn -1;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn 0;\n\t\t\t\t\t})\n\t\t\t\t\t.map((item: any) => {\n\t\t\t\t\t\tconst appID = getItemId(item);\n\n\t\t\t\t\t\tconst openItemEventHandler = (e: React.MouseEvent<Element> | React.KeyboardEvent<Element>) => {\n\t\t\t\t\t\t\tclickItem(appID);\n\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t};\n\t\t\t\t\t\tconst editItemEventHandler = (e: React.MouseEvent<Element> | React.KeyboardEvent<Element>) => {\n\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\teditItem?.(appID);\n\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t};\n\t\t\t\t\t\tconst deleteItemEventHandler = (e: React.MouseEvent<Element> | React.KeyboardEvent<Element>) => {\n\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\tdeleteItem(appID);\n\t\t\t\t\t\t};\n\t\t\t\t\t\tconst keyDownHandler = (e: React.KeyboardEvent<HTMLDivElement>) => {\n\t\t\t\t\t\t\tswitch (e.key) {\n\t\t\t\t\t\t\t\tcase \"Enter\":\n\t\t\t\t\t\t\t\tcase \" \": {\n\t\t\t\t\t\t\t\t\topenItemEventHandler(e);\n\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tcase \"Delete\": {\n\t\t\t\t\t\t\t\t\tdeleteItemEventHandler(e);\n\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdefault: {\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\tconst displayName = getItemDisplayName(item);\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tkey={appID}\n\t\t\t\t\t\t\t\tid={`app-list-row-${appID}`}\n\t\t\t\t\t\t\t\tclassName=\"app-list-row\"\n\t\t\t\t\t\t\t\trole=\"listitem\"\n\t\t\t\t\t\t\t\ttabIndex={0}\n\t\t\t\t\t\t\t\tonClick={openItemEventHandler}\n\t\t\t\t\t\t\t\tonKeyDown={keyDownHandler}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<span className=\"app-name\">{displayName}</span>\n\t\t\t\t\t\t\t\t<div className=\"icon-bar\">\n\t\t\t\t\t\t\t\t\t{editItem && (\n\t\t\t\t\t\t\t\t\t\t<ButtonIcon className=\"icon-edit\" icon=\"pencil\" text=\"Edit\" onClick={editItemEventHandler} />\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t<ButtonIcon\n\t\t\t\t\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\t\t\t\t\tclassName=\"icon-delete\"\n\t\t\t\t\t\t\t\t\t\ticon=\"trash\"\n\t\t\t\t\t\t\t\t\t\ttext=\"Delete\"\n\t\t\t\t\t\t\t\t\t\tonClick={deleteItemEventHandler}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t);\n\t\t\t\t\t})}\n\t\t\t</div>\n\t\t)}\n\t</>\n);\n"]}

package/react/components/sdd/Navigation.d.ts

@@ -0,0 +1,11 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+/// <reference types="react" />
+import { ViewSectionInfo } from "../../types/smartDesktopDesignerTypes";
+import "./css/nav.css";
+export declare type NavigationProps = {
+    views: ViewSectionInfo[];
+};
+export declare const Navigation: (props: NavigationProps) => JSX.Element;

package/react/components/sdd/Navigation.js

@@ -0,0 +1,61 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+import React, { useRef } from "react";
+import { useSelector, useDispatch } from "../../store";
+import { SmartDesktopDesignerActions } from "../../actions/smartDesktopDesignerActions";
+import "./css/nav.css";
+import { FinsembleIcon } from "../common/FinsembleIcon";
+import { Tooltip } from "../common/Tooltip";
+export const Navigation = (props) => {
+    const dispatch = useDispatch();
+    const tabList = useRef(null);
+    const { views } = props;
+    const currentViewId = useSelector((state) => state.smartDesktopDesigner.currentViewId);
+    const errors = useSelector((state) => state.smartDesktopDesigner.errors);
+    const isReviewingErrors = useSelector((state) => state.smartDesktopDesigner.isReviewingErrors);
+    if (currentViewId === null) {
+        dispatch(SmartDesktopDesignerActions.change_view(views[0].views[0].id));
+    }
+    const changeTab = (viewId, direction) => {
+        var _a, _b;
+        const tabReferences = (_a = tabList.current) === null || _a === void 0 ? void 0 : _a.querySelectorAll("[role='tab']");
+        if (tabReferences === undefined) {
+            return;
+        }
+        const currentIndex = Array.from(tabReferences).findIndex((elem) => elem.id.includes(viewId));
+        if (currentIndex === tabReferences.length) {
+            return;
+        }
+        (_b = tabReferences[currentIndex + direction]) === null || _b === void 0 ? void 0 : _b.focus();
+    };
+    return (React.createElement("div", { role: "tablist", ref: tabList }, views.map((section, i) => (React.createElement("div", { key: `nav-section-${i}`, className: "nav-section" },
+        section.showLabel && React.createElement("div", { className: "nav-label" }, section.label),
+        React.createElement("ul", { className: "nav" }, section.views.map((view) => (React.createElement("div", { key: view.name, "aria-selected": view.id === currentViewId, className: "nav-item" },
+            React.createElement("div", { key: view.name, id: `${view.id}-nav-link`, tabIndex: view.id === currentViewId ? 0 : -1, role: "tab", onKeyDown: (e) => {
+                    if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
+                        changeTab(view.id, -1);
+                    }
+                    else if (e.key === "ArrowRight" || e.key === "ArrowDown") {
+                        changeTab(view.id, 1);
+                    }
+                    else if (e.key === "Enter" || e.key === " ") {
+                        e.preventDefault();
+                        dispatch(SmartDesktopDesignerActions.change_view(view.id));
+                    }
+                }, onClick: (e) => {
+                    e.preventDefault();
+                    dispatch(SmartDesktopDesignerActions.change_view(view.id));
+                } },
+                isReviewingErrors &&
+                    view.id !== "export" &&
+                    errors
+                        .filter((error) => error.viewId === view.id)
+                        .map((error, index) => (React.createElement("div", { key: index, className: "nav-error-icon" },
+                        React.createElement(Tooltip, { type: "warn" }, error.message)))),
+                React.createElement(FinsembleIcon, { className: "nav-icon", icon: view.icon }),
+                React.createElement("div", { className: ["nav-icon", view.icon].join(" ") }),
+                view.name))))))))));
+};
+//# sourceMappingURL=Navigation.js.map

package/react/components/sdd/Navigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Navigation.js","sourceRoot":"","sources":["../../../src/components/sdd/Navigation.tsx"],"names":[],"mappings":"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","sourcesContent":["/*!\n * Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React, { useRef } from \"react\";\nimport { useSelector, useDispatch } from \"../../store\";\n\nimport { ViewSectionInfo } from \"../../types/smartDesktopDesignerTypes\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport \"./css/nav.css\";\nimport { FinsembleIcon } from \"../common/FinsembleIcon\";\nimport { Tooltip } from \"../common/Tooltip\";\n\nexport type NavigationProps = {\n\tviews: ViewSectionInfo[];\n};\n\nexport const Navigation = (props: NavigationProps) => {\n\tconst dispatch = useDispatch();\n\tconst tabList = useRef<HTMLDivElement>(null);\n\n\tconst { views } = props;\n\n\tconst currentViewId = useSelector((state: RootState) => state.smartDesktopDesigner.currentViewId);\n\tconst errors = useSelector((state: RootState) => state.smartDesktopDesigner.errors);\n\tconst isReviewingErrors = useSelector((state: RootState) => state.smartDesktopDesigner.isReviewingErrors);\n\n\tif (currentViewId === null) {\n\t\tdispatch(SmartDesktopDesignerActions.change_view(views[0].views[0].id));\n\t}\n\n\tconst changeTab = (viewId: string, direction: 1 | -1) => {\n\t\tconst tabReferences = tabList.current?.querySelectorAll(\"[role='tab']\") as NodeListOf<HTMLElement> | undefined;\n\t\tif (tabReferences === undefined) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst currentIndex = Array.from(tabReferences).findIndex((elem) => elem.id.includes(viewId));\n\n\t\tif (currentIndex === tabReferences.length) {\n\t\t\treturn;\n\t\t}\n\n\t\ttabReferences[currentIndex + direction]?.focus();\n\t};\n\n\treturn (\n\t\t<div role=\"tablist\" ref={tabList}>\n\t\t\t{views.map((section, i) => (\n\t\t\t\t<div key={`nav-section-${i}`} className=\"nav-section\">\n\t\t\t\t\t{section.showLabel && <div className=\"nav-label\">{section.label}</div>}\n\t\t\t\t\t<ul className=\"nav\">\n\t\t\t\t\t\t{section.views.map((view) => (\n\t\t\t\t\t\t\t<div key={view.name} aria-selected={view.id === currentViewId} className=\"nav-item\">\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tkey={view.name}\n\t\t\t\t\t\t\t\t\tid={`${view.id}-nav-link`}\n\t\t\t\t\t\t\t\t\ttabIndex={view.id === currentViewId ? 0 : -1}\n\t\t\t\t\t\t\t\t\trole=\"tab\"\n\t\t\t\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\t\t\t\tif (e.key === \"ArrowLeft\" || e.key === \"ArrowUp\") {\n\t\t\t\t\t\t\t\t\t\t\tchangeTab(view.id, -1);\n\t\t\t\t\t\t\t\t\t\t} else if (e.key === \"ArrowRight\" || e.key === \"ArrowDown\") {\n\t\t\t\t\t\t\t\t\t\t\tchangeTab(view.id, 1);\n\t\t\t\t\t\t\t\t\t\t} else if (e.key === \"Enter\" || e.key === \" \") {\n\t\t\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.change_view(view.id));\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.change_view(view.id));\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{isReviewingErrors &&\n\t\t\t\t\t\t\t\t\t\tview.id !== \"export\" &&\n\t\t\t\t\t\t\t\t\t\terrors\n\t\t\t\t\t\t\t\t\t\t\t.filter((error) => error.viewId === view.id)\n\t\t\t\t\t\t\t\t\t\t\t.map((error, index) => (\n\t\t\t\t\t\t\t\t\t\t\t\t<div key={index} className=\"nav-error-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<Tooltip type=\"warn\">{error.message}</Tooltip>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t\t<FinsembleIcon className=\"nav-icon\" icon={view.icon}></FinsembleIcon>\n\t\t\t\t\t\t\t\t\t<div className={[\"nav-icon\", view.icon].join(\" \")}></div>\n\t\t\t\t\t\t\t\t\t{view.name}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</ul>\n\t\t\t\t</div>\n\t\t\t))}\n\t\t</div>\n\t);\n};\n"]}

package/react/components/sdd/OptionalSettingsView.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { SmartDesktopClient } from "./smartDesktopClient";
+export declare type OptionalSettingsViewProps = {
+    getApps: typeof SmartDesktopClient.getApps;
+    updateApp: typeof SmartDesktopClient.updateApp;
+    getPreloads: typeof SmartDesktopClient.getPreloads;
+    savePreload: typeof SmartDesktopClient.savePreload;
+    deletePreload: typeof SmartDesktopClient.deletePreload;
+};
+export declare const OptionalSettingsView: React.FunctionComponent<OptionalSettingsViewProps>;

package/react/components/sdd/OptionalSettingsView.js

@@ -0,0 +1,48 @@
+import React, { useEffect, useState } from "react";
+import { Header } from "../common/Header";
+import { View } from "./View";
+import { Content } from "./Content";
+import { Tab } from "../common/Tab";
+import { launchTutorialLink } from "./common/fsbl_functions";
+import { Preloads } from "./Preloads";
+import { EditPreload } from "./EditPreload";
+import { useDispatch } from "../../store";
+import { SmartDesktopDesignerActions } from "../../actions/smartDesktopDesignerActions";
+import { FinsembleLink } from "../common/FinsembleLink";
+export const OptionalSettingsView = (props) => {
+    const dispatch = useDispatch();
+    const [currentPreloadAlias, setCurrentPreloadAlias] = useState(null);
+    const refreshPreloadList = async () => {
+        const { data } = await props.getPreloads();
+        dispatch(SmartDesktopDesignerActions.update_preloads(data));
+    };
+    useEffect(() => {
+        refreshPreloadList();
+    }, []);
+    return (React.createElement(View, null,
+        React.createElement(Header, { helpFunction: () => {
+                launchTutorialLink("SDD-06-Preloads");
+            } }, "Extensions"),
+        React.createElement(Content, null,
+            React.createElement(Tab, null,
+                React.createElement("div", { "data-label": "Preloads" },
+                    React.createElement("div", { className: "frontmatter" },
+                        "A preload is a script that is loaded into a window before the actual content of that window is loaded. Preloads provide added flexibility because they allows you to run additional code in the window without changing code for the app that the window belongs to. ",
+                        React.createElement("br", null),
+                        React.createElement(FinsembleLink, { url: "https://documentation.finsemble.com/tutorial-Preloads.html", text: "Learn more about preloads" }),
+                        "."),
+                    currentPreloadAlias === null ? (React.createElement(Preloads, { setCurrentPreloadAlias: setCurrentPreloadAlias, deletePreload: async (alias) => {
+                            await props.deletePreload(alias);
+                            refreshPreloadList();
+                        } })) : (React.createElement(EditPreload, { alias: currentPreloadAlias, getApps: props.getApps, updateApp: props.updateApp, cancel: () => {
+                            setCurrentPreloadAlias(null);
+                        }, submit: async (oldAlias, newAlias, detail) => {
+                            await props.savePreload(oldAlias, newAlias, detail);
+                            refreshPreloadList();
+                        }, deletePreload: async (alias) => {
+                            const result = await props.deletePreload(alias);
+                            refreshPreloadList();
+                            return result;
+                        } })))))));
+};
+//# sourceMappingURL=OptionalSettingsView.js.map

package/react/components/sdd/OptionalSettingsView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OptionalSettingsView.js","sourceRoot":"","sources":["../../../src/components/sdd/OptionalSettingsView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AACpC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,OAAO,EAAE,2BAA2B,EAAE,MAAM,2CAA2C,CAAC;AACxF,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAWxD,MAAM,CAAC,MAAM,oBAAoB,GAAuD,CAAC,KAAK,EAAE,EAAE;IACjG,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAEpF,MAAM,kBAAkB,GAAG,KAAK,IAAI,EAAE;QACrC,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,KAAK,CAAC,WAAW,EAAE,CAAC;QAC3C,QAAQ,CAAC,2BAA2B,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC;IAC7D,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACd,kBAAkB,EAAE,CAAC;IACtB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACN,oBAAC,IAAI;QACJ,oBAAC,MAAM,IACN,YAAY,EAAE,GAAG,EAAE;gBAClB,kBAAkB,CAAC,iBAAiB,CAAC,CAAC;YACvC,CAAC,iBAGO;QAET,oBAAC,OAAO;YACP,oBAAC,GAAG;gBACH,2CAAgB,UAAU;oBACzB,6BAAK,SAAS,EAAC,aAAa;;wBAG2B,+BAAM;wBAC5D,oBAAC,aAAa,IACb,GAAG,EAAC,4DAA4D,EAChE,IAAI,EAAC,2BAA2B,GAC/B;4BAEG;oBACL,mBAAmB,KAAK,IAAI,CAAC,CAAC,CAAC,CAC/B,oBAAC,QAAQ,IACR,sBAAsB,EAAE,sBAAsB,EAC9C,aAAa,EAAE,KAAK,EAAE,KAAa,EAAE,EAAE;4BACtC,MAAM,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;4BACjC,kBAAkB,EAAE,CAAC;wBACtB,CAAC,GACA,CACF,CAAC,CAAC,CAAC,CACH,oBAAC,WAAW,IACX,KAAK,EAAE,mBAAmB,EAC1B,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,MAAM,EAAE,GAAG,EAAE;4BACZ,sBAAsB,CAAC,IAAI,CAAC,CAAC;wBAC9B,CAAC,EACD,MAAM,EAAE,KAAK,EAAE,QAAuB,EAAE,QAAgB,EAAE,MAAqB,EAAE,EAAE;4BAClF,MAAM,KAAK,CAAC,WAAW,CAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC;4BACpD,kBAAkB,EAAE,CAAC;wBACtB,CAAC,EACD,aAAa,EAAE,KAAK,EAAE,KAAa,EAAE,EAAE;4BACtC,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;4BAChD,kBAAkB,EAAE,CAAC;4BACrB,OAAO,MAAM,CAAC;wBACf,CAAC,GACA,CACF,CACI,CACD,CACG,CACJ,CACP,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { Header } from \"../common/Header\";\nimport { View } from \"./View\";\nimport { Content } from \"./Content\";\nimport { Tab } from \"../common/Tab\";\nimport { launchTutorialLink } from \"./common/fsbl_functions\";\nimport { Preloads } from \"./Preloads\";\nimport { EditPreload } from \"./EditPreload\";\nimport { useDispatch } from \"../../store\";\nimport { PreloadDetail } from \"../../types/smartDesktopDesignerTypes\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\nimport { FinsembleLink } from \"../common/FinsembleLink\";\nimport { SmartDesktopClient } from \"./smartDesktopClient\";\n\nexport type OptionalSettingsViewProps = {\n\tgetApps: typeof SmartDesktopClient.getApps;\n\tupdateApp: typeof SmartDesktopClient.updateApp;\n\tgetPreloads: typeof SmartDesktopClient.getPreloads;\n\tsavePreload: typeof SmartDesktopClient.savePreload;\n\tdeletePreload: typeof SmartDesktopClient.deletePreload;\n};\n\nexport const OptionalSettingsView: React.FunctionComponent<OptionalSettingsViewProps> = (props) => {\n\tconst dispatch = useDispatch();\n\tconst [currentPreloadAlias, setCurrentPreloadAlias] = useState<string | null>(null);\n\n\tconst refreshPreloadList = async () => {\n\t\tconst { data } = await props.getPreloads();\n\t\tdispatch(SmartDesktopDesignerActions.update_preloads(data));\n\t};\n\n\tuseEffect(() => {\n\t\trefreshPreloadList();\n\t}, []);\n\n\treturn (\n\t\t<View>\n\t\t\t<Header\n\t\t\t\thelpFunction={() => {\n\t\t\t\t\tlaunchTutorialLink(\"SDD-06-Preloads\");\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\tExtensions\n\t\t\t</Header>\n\n\t\t\t<Content>\n\t\t\t\t<Tab>\n\t\t\t\t\t<div data-label=\"Preloads\">\n\t\t\t\t\t\t<div className=\"frontmatter\">\n\t\t\t\t\t\t\tA preload is a script that is loaded into a window before the actual content of that window is loaded.\n\t\t\t\t\t\t\tPreloads provide added flexibility because they allows you to run additional code in the window without\n\t\t\t\t\t\t\tchanging code for the app that the window belongs to. <br />\n\t\t\t\t\t\t\t<FinsembleLink\n\t\t\t\t\t\t\t\turl=\"https://documentation.finsemble.com/tutorial-Preloads.html\"\n\t\t\t\t\t\t\t\ttext=\"Learn more about preloads\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t.\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{currentPreloadAlias === null ? (\n\t\t\t\t\t\t\t<Preloads\n\t\t\t\t\t\t\t\tsetCurrentPreloadAlias={setCurrentPreloadAlias}\n\t\t\t\t\t\t\t\tdeletePreload={async (alias: string) => {\n\t\t\t\t\t\t\t\t\tawait props.deletePreload(alias);\n\t\t\t\t\t\t\t\t\trefreshPreloadList();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<EditPreload\n\t\t\t\t\t\t\t\talias={currentPreloadAlias}\n\t\t\t\t\t\t\t\tgetApps={props.getApps}\n\t\t\t\t\t\t\t\tupdateApp={props.updateApp}\n\t\t\t\t\t\t\t\tcancel={() => {\n\t\t\t\t\t\t\t\t\tsetCurrentPreloadAlias(null);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tsubmit={async (oldAlias: string | null, newAlias: string, detail: PreloadDetail) => {\n\t\t\t\t\t\t\t\t\tawait props.savePreload(oldAlias, newAlias, detail);\n\t\t\t\t\t\t\t\t\trefreshPreloadList();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tdeletePreload={async (alias: string) => {\n\t\t\t\t\t\t\t\t\tconst result = await props.deletePreload(alias);\n\t\t\t\t\t\t\t\t\trefreshPreloadList();\n\t\t\t\t\t\t\t\t\treturn result;\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</Tab>\n\t\t\t</Content>\n\t\t</View>\n\t);\n};\n"]}

package/react/components/sdd/Preloads.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+export interface PreloadListProps {
+    setCurrentPreloadAlias: (newAlias: string) => void;
+    deletePreload: (alias: string) => void;
+}
+export declare const Preloads: React.FunctionComponent<PreloadListProps>;

package/react/components/sdd/Preloads.js

@@ -0,0 +1,24 @@
+import React from "react";
+import { Button } from "../common/Button";
+import { ItemList } from "./ItemList";
+import { useSelector } from "../../store";
+const preloadMap2Array = (preloadMap) => Object.entries(preloadMap).map(([alias, details]) => { var _a; return [alias, (_a = details.url) !== null && _a !== void 0 ? _a : ""]; });
+const getAlias = (item) => item[0];
+export const Preloads = (props) => {
+    const preloads = useSelector((state) => state.smartDesktopDesigner.preloads);
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", null,
+            React.createElement(Button, { fashion: "primary", iconBefore: "plus", text: "Add", onClick: () => {
+                    props.setCurrentPreloadAlias("");
+                } })),
+        React.createElement("div", null,
+            React.createElement(ItemList, { items: preloadMap2Array(preloads), getItemId: getAlias, getItemDisplayName: getAlias, clickItem: (alias) => {
+                    props.setCurrentPreloadAlias(alias);
+                }, deleteItem: (alias) => {
+                    props.deletePreload(alias);
+                }, emptyListMessage: React.createElement(React.Fragment, null,
+                    "There\u2019s nothing here!",
+                    React.createElement("br", null),
+                    "Click the Add button to add preloads."), className: "no-dropzone" }))));
+};
+//# sourceMappingURL=Preloads.js.map

package/react/components/sdd/Preloads.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Preloads.js","sourceRoot":"","sources":["../../../src/components/sdd/Preloads.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAQ1C,MAAM,gBAAgB,GAAG,CAAC,UAAsB,EAAE,EAAE,CACnD,MAAM,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAAE,OAAO,CAAC,EAAE,EAAE,WAAC,OAAA,CAAC,KAAK,EAAE,MAAA,OAAO,CAAC,GAAG,mCAAI,EAAE,CAAC,CAAA,EAAA,CAAC,CAAC;AAClF,MAAM,QAAQ,GAAG,CAAC,IAAc,EAAE,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AAE7C,MAAM,CAAC,MAAM,QAAQ,GAA8C,CAAC,KAAK,EAAE,EAAE;IAC5E,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,QAAQ,CAAC,CAAC;IAExF,OAAO,CACN;QACC;YACC,oBAAC,MAAM,IACN,OAAO,EAAC,SAAS,EACjB,UAAU,EAAC,MAAM,EACjB,IAAI,EAAC,KAAK,EACV,OAAO,EAAE,GAAG,EAAE;oBACb,KAAK,CAAC,sBAAsB,CAAC,EAAE,CAAC,CAAC;gBAClC,CAAC,GACA,CACG;QACN;YACC,oBAAC,QAAQ,IACR,KAAK,EAAE,gBAAgB,CAAC,QAAQ,CAAC,EACjC,SAAS,EAAE,QAAQ,EACnB,kBAAkB,EAAE,QAAQ,EAC5B,SAAS,EAAE,CAAC,KAAa,EAAE,EAAE;oBAC5B,KAAK,CAAC,sBAAsB,CAAC,KAAK,CAAC,CAAC;gBACrC,CAAC,EACD,UAAU,EAAE,CAAC,KAAa,EAAE,EAAE;oBAC7B,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;gBAC5B,CAAC,EACD,gBAAgB,EACf;;oBAEC,+BAAM;4DAEJ,EAEJ,SAAS,EAAC,aAAa,GACtB,CACG,CACJ,CACH,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React from \"react\";\nimport { Button } from \"../common/Button\";\nimport { ItemList } from \"./ItemList\";\nimport { PreloadMap } from \"../../types/smartDesktopDesignerTypes\";\nimport { useSelector } from \"../../store\";\nimport { RootState } from \"../../reducers/rootReducer\";\n\nexport interface PreloadListProps {\n\tsetCurrentPreloadAlias: (newAlias: string) => void;\n\tdeletePreload: (alias: string) => void;\n}\n\nconst preloadMap2Array = (preloadMap: PreloadMap) =>\n\tObject.entries(preloadMap).map(([alias, details]) => [alias, details.url ?? \"\"]);\nconst getAlias = (item: string[]) => item[0];\n\nexport const Preloads: React.FunctionComponent<PreloadListProps> = (props) => {\n\tconst preloads = useSelector((state: RootState) => state.smartDesktopDesigner.preloads);\n\n\treturn (\n\t\t<>\n\t\t\t<div>\n\t\t\t\t<Button\n\t\t\t\t\tfashion=\"primary\"\n\t\t\t\t\ticonBefore=\"plus\"\n\t\t\t\t\ttext=\"Add\"\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tprops.setCurrentPreloadAlias(\"\");\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t<div>\n\t\t\t\t<ItemList\n\t\t\t\t\titems={preloadMap2Array(preloads)}\n\t\t\t\t\tgetItemId={getAlias}\n\t\t\t\t\tgetItemDisplayName={getAlias}\n\t\t\t\t\tclickItem={(alias: string) => {\n\t\t\t\t\t\tprops.setCurrentPreloadAlias(alias);\n\t\t\t\t\t}}\n\t\t\t\t\tdeleteItem={(alias: string) => {\n\t\t\t\t\t\tprops.deletePreload(alias);\n\t\t\t\t\t}}\n\t\t\t\t\temptyListMessage={\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\tThere’s nothing here!\n\t\t\t\t\t\t\t<br />\n\t\t\t\t\t\t\tClick the Add button to add preloads.\n\t\t\t\t\t\t</>\n\t\t\t\t\t}\n\t\t\t\t\tclassName=\"no-dropzone\"\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</>\n\t);\n};\n"]}

package/react/components/sdd/ProjectErrors.d.ts

@@ -0,0 +1,11 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+/// <reference types="react" />
+import { ProjectError } from "../../types/smartDesktopDesignerTypes";
+import "./css/project-errors.css";
+export declare type ProjectErrorsProps = {
+    errors: ProjectError[];
+};
+export declare const ProjectErrors: (props: ProjectErrorsProps) => JSX.Element;

package/react/components/sdd/ProjectErrors.js

@@ -0,0 +1,25 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+import React, { useEffect } from "react";
+import { SmartDesktopDesignerActions } from "../../actions/smartDesktopDesignerActions";
+import { useDispatch, useSelector } from "../../store";
+import { FinsembleIcon } from "../common/FinsembleIcon";
+import "./css/project-errors.css";
+export const ProjectErrors = (props) => {
+    const dispatch = useDispatch();
+    const { errors } = props;
+    const isReviewingErrors = useSelector((state) => state.smartDesktopDesigner.isReviewingErrors);
+    useEffect(() => {
+        if (!isReviewingErrors) {
+            dispatch(SmartDesktopDesignerActions.set_reviewing_project_errors(true));
+        }
+    }, []);
+    return (React.createElement("div", { className: "project-errors-container" }, errors.map((error, index) => (React.createElement("div", { key: index, className: "project-error", onClick: () => {
+            dispatch(SmartDesktopDesignerActions.change_view(error.viewId));
+        } },
+        React.createElement(FinsembleIcon, { className: "project-error-icon", icon: "exclamation-circle", label: "Error" }),
+        error.message)))));
+};
+//# sourceMappingURL=ProjectErrors.js.map

package/react/components/sdd/ProjectErrors.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProjectErrors.js","sourceRoot":"","sources":["../../../src/components/sdd/ProjectErrors.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,2BAA2B,EAAE,MAAM,2CAA2C,CAAC;AAExF,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAEvD,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAExD,OAAO,0BAA0B,CAAC;AAMlC,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAyB,EAAE,EAAE;IAC1D,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAEzB,MAAM,iBAAiB,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;IAE1G,SAAS,CAAC,GAAG,EAAE;QACd,IAAI,CAAC,iBAAiB,EAAE;YACvB,QAAQ,CAAC,2BAA2B,CAAC,4BAA4B,CAAC,IAAI,CAAC,CAAC,CAAC;SACzE;IACF,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACN,6BAAK,SAAS,EAAC,0BAA0B,IACvC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,CAC7B,6BACC,GAAG,EAAE,KAAK,EACV,SAAS,EAAC,eAAe,EACzB,OAAO,EAAE,GAAG,EAAE;YACb,QAAQ,CAAC,2BAA2B,CAAC,WAAW,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;QACjE,CAAC;QAED,oBAAC,aAAa,IAAC,SAAS,EAAC,oBAAoB,EAAC,IAAI,EAAC,oBAAoB,EAAC,KAAK,EAAC,OAAO,GAAiB;QACrG,KAAK,CAAC,OAAO,CACT,CACN,CAAC,CACG,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["/*!\n * Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React, { useEffect } from \"react\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport { useDispatch, useSelector } from \"../../store\";\nimport { ProjectError } from \"../../types/smartDesktopDesignerTypes\";\nimport { FinsembleIcon } from \"../common/FinsembleIcon\";\n\nimport \"./css/project-errors.css\";\n\nexport type ProjectErrorsProps = {\n\terrors: ProjectError[];\n};\n\nexport const ProjectErrors = (props: ProjectErrorsProps) => {\n\tconst dispatch = useDispatch();\n\tconst { errors } = props;\n\n\tconst isReviewingErrors = useSelector((state: RootState) => state.smartDesktopDesigner.isReviewingErrors);\n\n\tuseEffect(() => {\n\t\tif (!isReviewingErrors) {\n\t\t\tdispatch(SmartDesktopDesignerActions.set_reviewing_project_errors(true));\n\t\t}\n\t}, []);\n\n\treturn (\n\t\t<div className=\"project-errors-container\">\n\t\t\t{errors.map((error, index) => (\n\t\t\t\t<div\n\t\t\t\t\tkey={index}\n\t\t\t\t\tclassName=\"project-error\"\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.change_view(error.viewId));\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<FinsembleIcon className=\"project-error-icon\" icon=\"exclamation-circle\" label=\"Error\"></FinsembleIcon>\n\t\t\t\t\t{error.message}\n\t\t\t\t</div>\n\t\t\t))}\n\t\t</div>\n\t);\n};\n"]}

package/react/components/sdd/Publish.d.ts

@@ -0,0 +1,8 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+/// <reference types="react" />
+import { ExportProps } from "./Export";
+export declare type PublishProps = ExportProps;
+export declare const Publish: (props: PublishProps) => JSX.Element;