@ms-cloudpack/overlay 0.4.0 → 0.5.0

package/CHANGELOG.json

@@ -2,7 +2,22 @@
   "name": "@ms-cloudpack/overlay",
   "entries": [
     {
-      "date": "Wed, 05 Oct 2022 19:39:05 GMT",
+      "date": "Tue, 11 Oct 2022 08:16:31 GMT",
+      "tag": "@ms-cloudpack/overlay_v0.5.0",
+      "version": "0.5.0",
+      "comments": {
+        "minor": [
+          {
+            "author": "dake.3601@gmail.com",
+            "package": "@ms-cloudpack/overlay",
+            "commit": "90e5f71f8a0171b6e22e957ab38db1b1c736f6e2",
+            "comment": "Implemented an Error Status that pops up when an unsupported path is found."
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 05 Oct 2022 19:39:20 GMT",
       "tag": "@ms-cloudpack/overlay_v0.4.0",
       "version": "0.4.0",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,20 @@
 # Change Log - @ms-cloudpack/overlay
 
-This log was last generated on Wed, 05 Oct 2022 19:39:05 GMT and should not be manually modified.
+This log was last generated on Tue, 11 Oct 2022 08:16:31 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## 0.5.0
+
+Tue, 11 Oct 2022 08:16:31 GMT
+
+### Minor changes
+
+- Implemented an Error Status that pops up when an unsupported path is found. (dake.3601@gmail.com)
+
 ## 0.4.0
 
-Wed, 05 Oct 2022 19:39:05 GMT
+Wed, 05 Oct 2022 19:39:20 GMT
 
 ### Minor changes
 

package/dist/lib/index.js

@@ -1,5 +1,5 @@
 // src/index.tsx
-import React10 from "react";
+import React13 from "react";
 import ReactDOM from "react-dom";
 
 // src/components/CloudpackProvider/CloudpackProvider.tsx
@@ -128,7 +128,7 @@ function CloudpackProvider({ children }) {
 var useCloudpack = () => useContext(CloudpackContext);
 
 // src/components/StatusOverlay/StatusOverlay.tsx
-import React8, { useCallback, useState as useState5, useRef as useRef3 } from "react";
+import React11, { useCallback, useState as useState6, useRef as useRef3 } from "react";
 
 // src/components/StatusBadge/StatusBadge.tsx
 import React2, { useRef } from "react";
@@ -406,110 +406,7 @@ function getStatsString(status) {
 }
 
 // src/components/StatusDialog/StatusDialog.tsx
-import { default as React7, useRef as useRef2 } from "react";
-
-// src/components/StatusDialog/StatusDialog.module.css
-var compiledModule2 = `.LpVwawaxeg-StatusDialogmodulecssoverlay {
-  background: rgba(0, 0, 0, 0.1);
-  border: 1px solid black;
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 999;
-}
-
-@keyframes fade-in {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-
-.LpVwawaxeg-StatusDialogmodulecsscommands {
-  display: flex;
-  flex-direction: row;
-  gap: 8px;
-  align-items: center;
-  flex-shrink: 0;
-  height: 40px;
-  padding: 0 20px;
-}
-
-.LpVwawaxeg-StatusDialogmodulecssdialog {
-  animation: fade-in 0.1s ease-in-out;
-  width: 80vw;
-  align-self: stretch;
-  margin: 20px 0;
-  background: white;
-  color: #000;
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: column;
-  border-top: 4px solid rgb(0, 120, 212);
-  border-radius: 3px;
-  box-shadow: rgb(0 0 0 / 22%) 0px 25.6px 57.6px 0px, rgb(0 0 0 / 18%) 0px 4.8px 14.4px 0px;
-  position: relative;
-  outline: transparent solid 3px;
-}
-
-.LpVwawaxeg-StatusDialogmodulecsstitleArea {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  padding: 8px 8px 8px 20px;
-  gap: 8px;
-}
-
-.LpVwawaxeg-StatusDialogmodulecsscloseButton {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 32px;
-  height: 32px;
-  margin: 0;
-  padding: 0;
-  background: transparent;
-  border: none;
-  border-radius: 4px;
-}
-
-.LpVwawaxeg-StatusDialogmodulecsscloseButton:hover {
-  background: rgba(0, 0, 0, 0.1);
-}
-
-.LpVwawaxeg-StatusDialogmodulecsscloseButton:active {
-  background: rgba(0, 0, 0, 0.2);
-}
-
-.LpVwawaxeg-StatusDialogmodulecsstitle {
-  flex-grow: 1;
-  font-size: 20px;
-  font-weight: 600;
-  color: rgb(0, 120, 212);
-  cursor: move;
-}
-`;
-var s2 = document.createElement("style");
-s2.setAttribute("data-sourceFile", "src/components/StatusDialog/StatusDialog.module.css");
-s2.appendChild(document.createTextNode(compiledModule2));
-document.head.appendChild(s2);
-var closeButton = "LpVwawaxeg-StatusDialogmodulecsscloseButton";
-var commands = "LpVwawaxeg-StatusDialogmodulecsscommands";
-var dialog = "LpVwawaxeg-StatusDialogmodulecssdialog";
-var overlay = "LpVwawaxeg-StatusDialogmodulecssoverlay";
-var title = "LpVwawaxeg-StatusDialogmodulecsstitle";
-var titleArea = "LpVwawaxeg-StatusDialogmodulecsstitleArea";
-var StatusDialog_module_default = { closeButton, commands, dialog, overlay, title, titleArea };
-
-// src/images/dismiss-16-filled.inline.svg
-var dismiss_16_filled_inline_default = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIuMzk3MDUgMi41NTM3OUwyLjQ2OTY3IDIuNDY5NjdDMi43MzU5NCAyLjIwMzQgMy4xNTI2IDIuMTc5MiAzLjQ0NjIxIDIuMzk3MDVMMy41MzAzMyAyLjQ2OTY3TDggNi45MzlMMTIuNDY5NyAyLjQ2OTY3QzEyLjc2MjYgMi4xNzY3OCAxMy4yMzc0IDIuMTc2NzggMTMuNTMwMyAyLjQ2OTY3QzEzLjgyMzIgMi43NjI1NiAxMy44MjMyIDMuMjM3NDQgMTMuNTMwMyAzLjUzMDMzTDkuMDYxIDhMMTMuNTMwMyAxMi40Njk3QzEzLjc5NjYgMTIuNzM1OSAxMy44MjA4IDEzLjE1MjYgMTMuNjAyOSAxMy40NDYyTDEzLjUzMDMgMTMuNTMwM0MxMy4yNjQxIDEzLjc5NjYgMTIuODQ3NCAxMy44MjA4IDEyLjU1MzggMTMuNjAyOUwxMi40Njk3IDEzLjUzMDNMOCA5LjA2MUwzLjUzMDMzIDEzLjUzMDNDMy4yMzc0NCAxMy44MjMyIDIuNzYyNTYgMTMuODIzMiAyLjQ2OTY3IDEzLjUzMDNDMi4xNzY3OCAxMy4yMzc0IDIuMTc2NzggMTIuNzYyNiAyLjQ2OTY3IDEyLjQ2OTdMNi45MzkgOEwyLjQ2OTY3IDMuNTMwMzNDMi4yMDM0IDMuMjY0MDYgMi4xNzkyIDIuODQ3NCAyLjM5NzA1IDIuNTUzNzlMMi40Njk2NyAyLjQ2OTY3TDIuMzk3MDUgMi41NTM3OVoiIGZpbGw9IiMyMTIxMjEiLz4KPC9zdmc+Cg==";
+import React8 from "react";
 
 // src/components/StatusDialog/TaskList.tsx
 import React5 from "react";
@@ -521,7 +418,7 @@ import React4 from "react";
 import React3 from "react";
 
 // src/components/StatusDialog/TaskResultItem.module.css
-var compiledModule3 = `.mGnoEIJOyo-TaskResultItemmodulecssroot {
+var compiledModule2 = `.mGnoEIJOyo-TaskResultItemmodulecssroot {
   display: flex;
   background: #f5f5f5;
 }
@@ -582,18 +479,18 @@ var compiledModule3 = `.mGnoEIJOyo-TaskResultItemmodulecssroot {
   color: #333;
 }
 `;
-var s3 = document.createElement("style");
-s3.setAttribute("data-sourceFile", "src/components/StatusDialog/TaskResultItem.module.css");
-s3.appendChild(document.createTextNode(compiledModule3));
-document.head.appendChild(s3);
+var s2 = document.createElement("style");
+s2.setAttribute("data-sourceFile", "src/components/StatusDialog/TaskResultItem.module.css");
+s2.appendChild(document.createTextNode(compiledModule2));
+document.head.appendChild(s2);
 var actionArea = "mGnoEIJOyo-TaskResultItemmodulecssactionArea";
 var content = "mGnoEIJOyo-TaskResultItemmodulecsscontent";
 var file = "mGnoEIJOyo-TaskResultItemmodulecssfile";
 var root = "mGnoEIJOyo-TaskResultItemmodulecssroot";
 var statusBar = "mGnoEIJOyo-TaskResultItemmodulecssstatusBar";
 var text = "mGnoEIJOyo-TaskResultItemmodulecsstext";
-var titleArea2 = "mGnoEIJOyo-TaskResultItemmodulecsstitleArea";
-var TaskResultItem_module_default = { actionArea, content, file, root, statusBar, text, titleArea: titleArea2 };
+var titleArea = "mGnoEIJOyo-TaskResultItemmodulecsstitleArea";
+var TaskResultItem_module_default = { actionArea, content, file, root, statusBar, text, titleArea };
 
 // src/components/StatusDialog/TaskResultItem.tsx
 function TaskResultItem({ item, projectPath, index }) {
@@ -630,7 +527,7 @@ function TaskResultItem({ item, projectPath, index }) {
 }
 
 // src/components/StatusDialog/TaskStatus.module.css
-var compiledModule4 = `.vweafQQjU-TaskStatusmodulecssroot {
+var compiledModule3 = `.vweafQQjU-TaskStatusmodulecssroot {
   border: 1px solid #ccc;
   border-radius: 3px;
   box-shadow: 0 0 12px -6px rgba(0, 0, 0, 0.25);
@@ -730,7 +627,6 @@ var compiledModule4 = `.vweafQQjU-TaskStatusmodulecssroot {
   flex-direction: column;
   font-size: 14px;
   color: #333;
-  text-transform: capitalize;
 }
 
 .vweafQQjU-TaskStatusmodulecsslinkButton {
@@ -755,10 +651,10 @@ var compiledModule4 = `.vweafQQjU-TaskStatusmodulecssroot {
   text-decoration: underline;
 }
 `;
-var s4 = document.createElement("style");
-s4.setAttribute("data-sourceFile", "src/components/StatusDialog/TaskStatus.module.css");
-s4.appendChild(document.createTextNode(compiledModule4));
-document.head.appendChild(s4);
+var s3 = document.createElement("style");
+s3.setAttribute("data-sourceFile", "src/components/StatusDialog/TaskStatus.module.css");
+s3.appendChild(document.createTextNode(compiledModule3));
+document.head.appendChild(s3);
 var collapsed = "vweafQQjU-TaskStatusmodulecsscollapsed";
 var content2 = "vweafQQjU-TaskStatusmodulecsscontent";
 var error2 = "vweafQQjU-TaskStatusmodulecsserror";
@@ -772,10 +668,10 @@ var resultItems = "vweafQQjU-TaskStatusmodulecssresultItems";
 var root2 = "vweafQQjU-TaskStatusmodulecssroot";
 var subTitle = "vweafQQjU-TaskStatusmodulecsssubTitle";
 var success2 = "vweafQQjU-TaskStatusmodulecsssuccess";
-var title2 = "vweafQQjU-TaskStatusmodulecsstitle";
+var title = "vweafQQjU-TaskStatusmodulecsstitle";
 var value2 = "vweafQQjU-TaskStatusmodulecssvalue";
 var warning2 = "vweafQQjU-TaskStatusmodulecsswarning";
-var TaskStatus_module_default = { collapsed, content: content2, error: error2, expandButton, expandIcon, farArea, header, linkButton, name, resultItems, root: root2, subTitle, success: success2, title: title2, value: value2, warning: warning2 };
+var TaskStatus_module_default = { collapsed, content: content2, error: error2, expandButton, expandIcon, farArea, header, linkButton, name, resultItems, root: root2, subTitle, success: success2, title, value: value2, warning: warning2 };
 
 // src/components/StatusDialog/TaskStatus.tsx
 import { default as cx2 } from "classnames";
@@ -902,7 +798,7 @@ var useStatusDetails = () => {
 };
 
 // src/components/StatusDialog/TaskList.module.css
-var compiledModule5 = `.lTlVbGXBQHs-TaskListmodulecssroot {
+var compiledModule4 = `.lTlVbGXBQHs-TaskListmodulecssroot {
   flex-grow: 1;
   overflow: auto;
   border-top: 1px solid #ccc;
@@ -913,10 +809,10 @@ var compiledModule5 = `.lTlVbGXBQHs-TaskListmodulecssroot {
   gap: 8px;
 }
 `;
-var s5 = document.createElement("style");
-s5.setAttribute("data-sourceFile", "src/components/StatusDialog/TaskList.module.css");
-s5.appendChild(document.createTextNode(compiledModule5));
-document.head.appendChild(s5);
+var s4 = document.createElement("style");
+s4.setAttribute("data-sourceFile", "src/components/StatusDialog/TaskList.module.css");
+s4.appendChild(document.createTextNode(compiledModule4));
+document.head.appendChild(s4);
 var root3 = "lTlVbGXBQHs-TaskListmodulecssroot";
 var TaskList_module_default = { root: root3 };
 
@@ -949,7 +845,7 @@ function sortTasks(a, b) {
 import React6 from "react";
 
 // src/components/Button/Button.module.css
-var compiledModule6 = `.CCnBgacfaMc-ButtonmodulecssstandardButton {
+var compiledModule5 = `.CCnBgacfaMc-ButtonmodulecssstandardButton {
   outline: transparent;
   position: relative;
   font-family: inherit;
@@ -1013,10 +909,10 @@ var compiledModule6 = `.CCnBgacfaMc-ButtonmodulecssstandardButton {
   color: rgb(255, 255, 255);
 }
 `;
-var s6 = document.createElement("style");
-s6.setAttribute("data-sourceFile", "src/components/Button/Button.module.css");
-s6.appendChild(document.createTextNode(compiledModule6));
-document.head.appendChild(s6);
+var s5 = document.createElement("style");
+s5.setAttribute("data-sourceFile", "src/components/Button/Button.module.css");
+s5.appendChild(document.createTextNode(compiledModule5));
+document.head.appendChild(s5);
 var primaryButton = "CCnBgacfaMc-ButtonmodulecssprimaryButton";
 var standardButton = "CCnBgacfaMc-ButtonmodulecssstandardButton";
 var Button_module_default = { primaryButton, standardButton };
@@ -1032,47 +928,255 @@ function Button(props) {
   });
 }
 
-// src/components/StatusDialog/StatusDialog.tsx
-function StatusDialogUnmemoized({ onClose }) {
+// src/components/Dialog/Dialog.tsx
+import { default as React7, useRef as useRef2 } from "react";
+
+// src/components/Dialog/Dialog.module.css
+var compiledModule6 = `.ggUoTSSSfk-Dialogmodulecssoverlay {
+  background: rgba(0, 0, 0, 0.1);
+  border: 1px solid black;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 999;
+}
+
+@keyframes fade-in {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+.ggUoTSSSfk-Dialogmodulecsscommands {
+  display: flex;
+  flex-direction: row;
+  gap: 8px;
+  align-items: center;
+  flex-shrink: 0;
+  height: 40px;
+  padding: 0 20px;
+}
+
+.ggUoTSSSfk-Dialogmodulecssdialog {
+  animation: fade-in 0.1s ease-in-out;
+  width: 80vw;
+  align-self: stretch;
+  margin: 20px 0;
+  background: white;
+  color: #000;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  border-top: 4px solid rgb(0, 120, 212);
+  border-radius: 3px;
+  box-shadow: rgb(0 0 0 / 22%) 0px 25.6px 57.6px 0px, rgb(0 0 0 / 18%) 0px 4.8px 14.4px 0px;
+  position: relative;
+  outline: transparent solid 3px;
+}
+
+.ggUoTSSSfk-DialogmodulecsstitleArea {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  padding: 8px 8px 8px 20px;
+  gap: 8px;
+}
+
+.ggUoTSSSfk-DialogmodulecsscloseButton {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  margin: 0;
+  padding: 0;
+  background: transparent;
+  border: none;
+  border-radius: 4px;
+}
+
+.ggUoTSSSfk-DialogmodulecsscloseButton:hover {
+  background: rgba(0, 0, 0, 0.1);
+}
+
+.ggUoTSSSfk-DialogmodulecsscloseButton:active {
+  background: rgba(0, 0, 0, 0.2);
+}
+
+.ggUoTSSSfk-Dialogmodulecsstitle {
+  flex-grow: 1;
+  font-size: 20px;
+  font-weight: 600;
+  color: rgb(0, 120, 212);
+}
+`;
+var s6 = document.createElement("style");
+s6.setAttribute("data-sourceFile", "src/components/Dialog/Dialog.module.css");
+s6.appendChild(document.createTextNode(compiledModule6));
+document.head.appendChild(s6);
+var closeButton = "ggUoTSSSfk-DialogmodulecsscloseButton";
+var commands = "ggUoTSSSfk-Dialogmodulecsscommands";
+var dialog = "ggUoTSSSfk-Dialogmodulecssdialog";
+var overlay = "ggUoTSSSfk-Dialogmodulecssoverlay";
+var title2 = "ggUoTSSSfk-Dialogmodulecsstitle";
+var titleArea2 = "ggUoTSSSfk-DialogmodulecsstitleArea";
+var Dialog_module_default = { closeButton, commands, dialog, overlay, title: title2, titleArea: titleArea2 };
+
+// src/images/dismiss-16-filled.inline.svg
+var dismiss_16_filled_inline_default = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIuMzk3MDUgMi41NTM3OUwyLjQ2OTY3IDIuNDY5NjdDMi43MzU5NCAyLjIwMzQgMy4xNTI2IDIuMTc5MiAzLjQ0NjIxIDIuMzk3MDVMMy41MzAzMyAyLjQ2OTY3TDggNi45MzlMMTIuNDY5NyAyLjQ2OTY3QzEyLjc2MjYgMi4xNzY3OCAxMy4yMzc0IDIuMTc2NzggMTMuNTMwMyAyLjQ2OTY3QzEzLjgyMzIgMi43NjI1NiAxMy44MjMyIDMuMjM3NDQgMTMuNTMwMyAzLjUzMDMzTDkuMDYxIDhMMTMuNTMwMyAxMi40Njk3QzEzLjc5NjYgMTIuNzM1OSAxMy44MjA4IDEzLjE1MjYgMTMuNjAyOSAxMy40NDYyTDEzLjUzMDMgMTMuNTMwM0MxMy4yNjQxIDEzLjc5NjYgMTIuODQ3NCAxMy44MjA4IDEyLjU1MzggMTMuNjAyOUwxMi40Njk3IDEzLjUzMDNMOCA5LjA2MUwzLjUzMDMzIDEzLjUzMDNDMy4yMzc0NCAxMy44MjMyIDIuNzYyNTYgMTMuODIzMiAyLjQ2OTY3IDEzLjUzMDNDMi4xNzY3OCAxMy4yMzc0IDIuMTc2NzggMTIuNzYyNiAyLjQ2OTY3IDEyLjQ2OTdMNi45MzkgOEwyLjQ2OTY3IDMuNTMwMzNDMi4yMDM0IDMuMjY0MDYgMi4xNzkyIDIuODQ3NCAyLjM5NzA1IDIuNTUzNzlMMi40Njk2NyAyLjQ2OTY3TDIuMzk3MDUgMi41NTM3OVoiIGZpbGw9IiMyMTIxMjEiLz4KPC9zdmc+Cg==";
+
+// src/components/Dialog/Dialog.tsx
+function Dialog({ title: title3, style, draggable, onClose, commands: commands2, children }) {
   const draggableRef = useRef2(null);
   const draggableTargetRef = useRef2(null);
-  const cloudpack = useCloudpack();
-  useDraggable(draggableRef, draggableTargetRef);
-  const restartTasks = () => {
-    cloudpack.restartTasks();
-  };
+  const colorAccent = style === "error" ? "rgb(164, 38, 44)" : void 0;
+  const cursorDraggable = draggable ? "move" : void 0;
+  useDraggable(draggable ? draggableRef : void 0, draggable ? draggableTargetRef : void 0);
   return /* @__PURE__ */ React7.createElement("div", {
-    className: StatusDialog_module_default.overlay
+    className: Dialog_module_default.overlay
   }, /* @__PURE__ */ React7.createElement("div", {
     ref: draggableRef,
-    className: StatusDialog_module_default.dialog
+    className: Dialog_module_default.dialog,
+    style: { borderTopColor: colorAccent }
   }, /* @__PURE__ */ React7.createElement("div", {
-    className: StatusDialog_module_default.titleArea
+    className: Dialog_module_default.titleArea
   }, /* @__PURE__ */ React7.createElement("div", {
     ref: draggableTargetRef,
-    className: StatusDialog_module_default.title
-  }, "Task results"), /* @__PURE__ */ React7.createElement("button", {
-    className: StatusDialog_module_default.closeButton,
+    className: Dialog_module_default.title,
+    style: { color: colorAccent, cursor: cursorDraggable }
+  }, title3), !!onClose && /* @__PURE__ */ React7.createElement("button", {
+    className: Dialog_module_default.closeButton,
     onClick: onClose
   }, /* @__PURE__ */ React7.createElement("img", {
     src: dismiss_16_filled_inline_default,
     alt: ""
-  }))), /* @__PURE__ */ React7.createElement("div", {
-    className: StatusDialog_module_default.commands
-  }, /* @__PURE__ */ React7.createElement(Button, {
-    primary: true,
-    onClick: restartTasks
-  }, "Restart all tasks")), /* @__PURE__ */ React7.createElement(TaskList, null)));
+  }))), !!commands2 && /* @__PURE__ */ React7.createElement("div", {
+    className: Dialog_module_default.commands
+  }, commands2), children));
+}
+
+// src/components/StatusDialog/StatusDialog.tsx
+function StatusDialog({ onClose }) {
+  const cloudpack = useCloudpack();
+  const restartTasks = () => {
+    cloudpack.restartTasks();
+  };
+  return /* @__PURE__ */ React8.createElement(Dialog, {
+    title: "Task results",
+    draggable: true,
+    onClose,
+    commands: /* @__PURE__ */ React8.createElement(Button, {
+      primary: true,
+      onClick: restartTasks
+    }, "Restart all tasks")
+  }, /* @__PURE__ */ React8.createElement(TaskList, null));
+}
+
+// src/components/ErrorDialog/ErrorDialog.tsx
+import { default as React10 } from "react";
+
+// src/components/ErrorDialog/PathError.tsx
+import React9 from "react";
+import { default as cx3 } from "classnames";
+function PathError(props) {
+  const [showContent, setshowContent] = React9.useState(false);
+  const { packageName, path } = props;
+  return /* @__PURE__ */ React9.createElement("div", {
+    className: TaskStatus_module_default.root
+  }, /* @__PURE__ */ React9.createElement("div", {
+    className: cx3(TaskStatus_module_default.header, TaskStatus_module_default.error)
+  }, /* @__PURE__ */ React9.createElement("button", {
+    className: TaskStatus_module_default.expandButton,
+    onClick: () => setshowContent(!showContent)
+  }, /* @__PURE__ */ React9.createElement("img", {
+    className: cx3(TaskStatus_module_default.expandIcon, !showContent && TaskStatus_module_default.collapsed),
+    src: chevrondown_20_inline_default,
+    alt: ""
+  })), /* @__PURE__ */ React9.createElement("img", {
+    className: TaskStatus_module_default.errorIcon,
+    src: error_24_inline_default,
+    alt: ""
+  }), /* @__PURE__ */ React9.createElement("div", {
+    className: TaskStatus_module_default.title
+  }, `${packageName}/${path}`)), showContent && /* @__PURE__ */ React9.createElement("div", {
+    className: TaskStatus_module_default.content
+  }, /* @__PURE__ */ React9.createElement("div", {
+    className: TaskStatus_module_default.title
+  }, "Details"), /* @__PURE__ */ React9.createElement("div", {
+    className: TaskStatus_module_default.nameValueArea
+  }, /* @__PURE__ */ React9.createElement("div", {
+    className: TaskStatus_module_default.name
+  }, "Problem"), /* @__PURE__ */ React9.createElement("div", {
+    className: TaskStatus_module_default.value
+  }, `A deep import "${packageName}" was imported, but was unrecognized as an exported entry path.`)), /* @__PURE__ */ React9.createElement("div", {
+    className: TaskStatus_module_default.nameValueArea
+  }, /* @__PURE__ */ React9.createElement("div", {
+    className: TaskStatus_module_default.name
+  }, "Solution"), /* @__PURE__ */ React9.createElement("div", {
+    className: TaskStatus_module_default.value
+  }, `Remove the path from the import in your source. (Import from "${packageName}" rather than "${packageName}/${path}")`))));
 }
-var StatusDialog = React7.memo(StatusDialogUnmemoized, (prev, next) => {
-  return prev.onClose === next.onClose;
-});
+
+// src/components/ErrorDialog/ErrorDialog.tsx
+function ErrorDialog({ unsupported }) {
+  const cloudpack = useCloudpack();
+  const reload = () => {
+    cloudpack.restartTasks();
+  };
+  return /* @__PURE__ */ React10.createElement(Dialog, {
+    title: "Found unsupported paths in your project",
+    style: "error",
+    commands: /* @__PURE__ */ React10.createElement(Button, {
+      primary: true,
+      onClick: reload
+    }, "Reload")
+  }, /* @__PURE__ */ React10.createElement("div", {
+    className: TaskList_module_default.root
+  }, unsupported.map((data, index) => /* @__PURE__ */ React10.createElement(PathError, {
+    ...data,
+    key: index
+  }))));
+}
+
+// src/components/ErrorDialog/useErrorEvents.ts
+import { useEffect as useEffect4, useState as useState5 } from "react";
+var useErrorEvents = () => {
+  const [events, setEvents] = useState5({ unsupported: [] });
+  useEffect4(() => {
+    const handleError = (event) => {
+      const regex = /[Mm]odule specifier,? ['"](.*?)\/(.*?)['"]/;
+      const match = event.message.match(regex);
+      if (match && match.length === 3) {
+        setEvents((prevEvents) => ({
+          ...prevEvents,
+          unsupported: [...prevEvents.unsupported, { packageName: match[1], path: match[2] }]
+        }));
+      }
+    };
+    window.uncaughtErrors = window.uncaughtErrors || { errors: [], unregister: () => void 0 };
+    window.uncaughtErrors.unregister();
+    window.addEventListener("error", handleError);
+    for (const error3 of window.uncaughtErrors.errors) {
+      handleError(error3);
+    }
+  }, []);
+  return events;
+};
 
 // src/components/StatusOverlay/StatusOverlay.tsx
 function StatusOverlay() {
-  const [isExpanded, setIsExpanded] = useState5(false);
+  const [isExpanded, setIsExpanded] = useState6(false);
   const status = useStatus();
   const internal = useRef3();
+  const { unsupported } = useErrorEvents();
   if (isExpanded === false && internal.current?.status !== "idle" && status.status === "idle" && internal.current?.totalErrors != status.totalErrors) {
     setIsExpanded(true);
   }
@@ -1081,15 +1185,17 @@ function StatusOverlay() {
     console.log(`Toggling minimized state to ${!isExpanded}`);
     setIsExpanded(!isExpanded);
   }, [isExpanded, setIsExpanded]);
-  return /* @__PURE__ */ React8.createElement("div", null, !isExpanded && /* @__PURE__ */ React8.createElement(StatusBadge, {
+  return /* @__PURE__ */ React11.createElement("div", null, !!unsupported.length && /* @__PURE__ */ React11.createElement(ErrorDialog, {
+    unsupported
+  }), !unsupported.length && !isExpanded && /* @__PURE__ */ React11.createElement(StatusBadge, {
     onExpand: toggleMinimized
-  }), isExpanded && /* @__PURE__ */ React8.createElement(StatusDialog, {
+  }), !unsupported.length && isExpanded && /* @__PURE__ */ React11.createElement(StatusDialog, {
     onClose: toggleMinimized
   }));
 }
 
 // src/components/ThemeProvider/ThemeProvider.tsx
-import React9 from "react";
+import React12 from "react";
 
 // src/components/ThemeProvider/ThemeProvider.module.css
 var compiledModule7 = `.xwrpHYTQE-ThemeProvidermodulecssroot {
@@ -1106,7 +1212,7 @@ var ThemeProvider_module_default = { root: root4 };
 
 // src/components/ThemeProvider/ThemeProvider.tsx
 function ThemeProvider({ children }) {
-  return /* @__PURE__ */ React9.createElement("div", {
+  return /* @__PURE__ */ React12.createElement("div", {
     className: ThemeProvider_module_default.root
   }, children);
 }
@@ -1114,7 +1220,7 @@ function ThemeProvider({ children }) {
 // src/index.tsx
 var rootDiv = document.createElement("div");
 ReactDOM.render(
-  /* @__PURE__ */ React10.createElement(ThemeProvider, null, /* @__PURE__ */ React10.createElement(CloudpackProvider, null, /* @__PURE__ */ React10.createElement(StatusOverlay, null))),
+  /* @__PURE__ */ React13.createElement(ThemeProvider, null, /* @__PURE__ */ React13.createElement(CloudpackProvider, null, /* @__PURE__ */ React13.createElement(StatusOverlay, null))),
   rootDiv
 );
 document.body.appendChild(rootDiv);

package/dist/ori-output.json

@@ -1,6 +1,6 @@
 {
   "type": "buildStatus",
-  "buildId": "55e0c497-aac9-4534-84c2-2af0c3328d62",
+  "buildId": "cc1a4d0c-a726-4192-853d-c99634d24523",
   "buildStatus": "complete",
   "internalError": null,
   "warnings": [],
@@ -8,5 +8,5 @@
   "outputFilePaths": [
     "/home/runner/work/cloudpack/cloudpack/packages/overlay/dist/lib/index.js"
   ],
-  "metafile": "{\n  \"inputs\": {\n    \"src/components/CloudpackProvider/getCookies.ts\": {\n      \"bytes\": 452,\n      \"imports\": []\n    },\n    \"src/components/CloudpackProvider/createCloudpackClient.ts\": {\n      \"bytes\": 3807,\n      \"imports\": [\n        {\n          \"path\": \"src/components/CloudpackProvider/getCookies.ts\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/CloudpackProvider/CloudpackProvider.tsx\": {\n      \"bytes\": 552,\n      \"imports\": [\n        {\n          \"path\": \"src/components/CloudpackProvider/createCloudpackClient.ts\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/hooks/useDraggable.ts\": {\n      \"bytes\": 2050,\n      \"imports\": []\n    },\n    \"src/components/StatusBadge/StatusBadge.module.css\": {\n      \"bytes\": 3405,\n      \"imports\": []\n    },\n    \"src/components/CloudpackProvider/useStatus.ts\": {\n      \"bytes\": 866,\n      \"imports\": [\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/images/open-16-filled.inline.svg\": {\n      \"bytes\": 852,\n      \"imports\": []\n    },\n    \"src/components/StatusBadge/StatusBadge.tsx\": {\n      \"bytes\": 2867,\n      \"imports\": [\n        {\n          \"path\": \"src/hooks/useDraggable.ts\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusBadge/StatusBadge.module.css\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/CloudpackProvider/useStatus.ts\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/images/open-16-filled.inline.svg\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/StatusDialog/StatusDialog.module.css\": {\n      \"bytes\": 2579,\n      \"imports\": []\n    },\n    \"src/images/dismiss-16-filled.inline.svg\": {\n      \"bytes\": 718,\n      \"imports\": []\n    },\n    \"src/components/StatusDialog/TaskResultItem.module.css\": {\n      \"bytes\": 2067,\n      \"imports\": []\n    },\n    \"src/components/StatusDialog/TaskResultItem.tsx\": {\n      \"bytes\": 1433,\n      \"imports\": [\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusDialog/TaskResultItem.module.css\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/StatusDialog/TaskStatus.module.css\": {\n      \"bytes\": 3953,\n      \"imports\": []\n    },\n    \"src/images/error-24.inline.svg\": {\n      \"bytes\": 1024,\n      \"imports\": []\n    },\n    \"src/images/success-24.inline.svg\": {\n      \"bytes\": 562,\n      \"imports\": []\n    },\n    \"src/images/chevrondown-20.inline.svg\": {\n      \"bytes\": 450,\n      \"imports\": []\n    },\n    \"src/components/StatusDialog/TaskStatus.tsx\": {\n      \"bytes\": 4225,\n      \"imports\": [\n        {\n          \"path\": \"src/components/StatusDialog/TaskResultItem.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusDialog/TaskStatus.module.css\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/images/error-24.inline.svg\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/images/success-24.inline.svg\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/images/chevrondown-20.inline.svg\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/CloudpackProvider/useStatusDetails.ts\": {\n      \"bytes\": 844,\n      \"imports\": [\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/StatusDialog/TaskList.module.css\": {\n      \"bytes\": 615,\n      \"imports\": []\n    },\n    \"src/components/StatusDialog/TaskList.tsx\": {\n      \"bytes\": 1015,\n      \"imports\": [\n        {\n          \"path\": \"src/components/StatusDialog/TaskStatus.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/CloudpackProvider/useStatusDetails.ts\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusDialog/TaskList.module.css\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/Button/Button.module.css\": {\n      \"bytes\": 2080,\n      \"imports\": []\n    },\n    \"src/components/Button/Button.tsx\": {\n      \"bytes\": 360,\n      \"imports\": [\n        {\n          \"path\": \"src/components/Button/Button.module.css\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/StatusDialog/StatusDialog.tsx\": {\n      \"bytes\": 1489,\n      \"imports\": [\n        {\n          \"path\": \"src/components/StatusDialog/StatusDialog.module.css\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/hooks/useDraggable.ts\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/images/dismiss-16-filled.inline.svg\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusDialog/TaskList.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/Button/Button.tsx\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/StatusOverlay/StatusOverlay.tsx\": {\n      \"bytes\": 1145,\n      \"imports\": [\n        {\n          \"path\": \"src/components/StatusBadge/StatusBadge.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusDialog/StatusDialog.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/CloudpackProvider/useStatus.ts\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/ThemeProvider/ThemeProvider.module.css\": {\n      \"bytes\": 630,\n      \"imports\": []\n    },\n    \"src/components/ThemeProvider/ThemeProvider.tsx\": {\n      \"bytes\": 210,\n      \"imports\": [\n        {\n          \"path\": \"src/components/ThemeProvider/ThemeProvider.module.css\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/index.tsx\": {\n      \"bytes\": 532,\n      \"imports\": [\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusOverlay/StatusOverlay.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/ThemeProvider/ThemeProvider.tsx\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    }\n  },\n  \"outputs\": {\n    \"dist/lib/index.js\": {\n      \"imports\": [],\n      \"exports\": [],\n      \"entryPoint\": \"src/index.tsx\",\n      \"inputs\": {\n        \"src/index.tsx\": {\n          \"bytesInOutput\": 360\n        },\n        \"src/components/CloudpackProvider/CloudpackProvider.tsx\": {\n          \"bytesInOutput\": 372\n        },\n        \"src/components/CloudpackProvider/getCookies.ts\": {\n          \"bytesInOutput\": 317\n        },\n        \"src/components/CloudpackProvider/createCloudpackClient.ts\": {\n          \"bytesInOutput\": 2507\n        },\n        \"src/components/StatusOverlay/StatusOverlay.tsx\": {\n          \"bytesInOutput\": 883\n        },\n        \"src/components/StatusBadge/StatusBadge.tsx\": {\n          \"bytesInOutput\": 3035\n        },\n        \"src/hooks/useDraggable.ts\": {\n          \"bytesInOutput\": 1937\n        },\n        \"src/components/StatusBadge/StatusBadge.module.css\": {\n          \"bytesInOutput\": 3118\n        },\n        \"src/components/CloudpackProvider/useStatus.ts\": {\n          \"bytesInOutput\": 448\n        },\n        \"src/images/open-16-filled.inline.svg\": {\n          \"bytesInOutput\": 1202\n        },\n        \"src/components/StatusDialog/StatusDialog.tsx\": {\n          \"bytesInOutput\": 1466\n        },\n        \"src/components/StatusDialog/StatusDialog.module.css\": {\n          \"bytesInOutput\": 2376\n        },\n        \"src/images/dismiss-16-filled.inline.svg\": {\n          \"bytesInOutput\": 1029\n        },\n        \"src/components/StatusDialog/TaskList.tsx\": {\n          \"bytesInOutput\": 750\n        },\n        \"src/components/StatusDialog/TaskStatus.tsx\": {\n          \"bytesInOutput\": 4697\n        },\n        \"src/components/StatusDialog/TaskResultItem.tsx\": {\n          \"bytesInOutput\": 1421\n        },\n        \"src/components/StatusDialog/TaskResultItem.module.css\": {\n          \"bytesInOutput\": 1894\n        },\n        \"src/components/StatusDialog/TaskStatus.module.css\": {\n          \"bytesInOutput\": 3690\n        },\n        \"src/images/error-24.inline.svg\": {\n          \"bytesInOutput\": 1428\n        },\n        \"src/images/success-24.inline.svg\": {\n          \"bytesInOutput\": 814\n        },\n        \"src/images/chevrondown-20.inline.svg\": {\n          \"bytesInOutput\": 666\n        },\n        \"src/components/CloudpackProvider/useStatusDetails.ts\": {\n          \"bytesInOutput\": 299\n        },\n        \"src/components/StatusDialog/TaskList.module.css\": {\n          \"bytesInOutput\": 541\n        },\n        \"src/components/Button/Button.tsx\": {\n          \"bytesInOutput\": 312\n        },\n        \"src/components/Button/Button.module.css\": {\n          \"bytesInOutput\": 1942\n        },\n        \"src/components/ThemeProvider/ThemeProvider.tsx\": {\n          \"bytesInOutput\": 189\n        },\n        \"src/components/ThemeProvider/ThemeProvider.module.css\": {\n          \"bytesInOutput\": 561\n        }\n      },\n      \"bytes\": 40081\n    }\n  }\n}\n"
+  "metafile": "{\n  \"inputs\": {\n    \"src/components/CloudpackProvider/getCookies.ts\": {\n      \"bytes\": 452,\n      \"imports\": []\n    },\n    \"src/components/CloudpackProvider/createCloudpackClient.ts\": {\n      \"bytes\": 3807,\n      \"imports\": [\n        {\n          \"path\": \"src/components/CloudpackProvider/getCookies.ts\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/CloudpackProvider/CloudpackProvider.tsx\": {\n      \"bytes\": 552,\n      \"imports\": [\n        {\n          \"path\": \"src/components/CloudpackProvider/createCloudpackClient.ts\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/hooks/useDraggable.ts\": {\n      \"bytes\": 2050,\n      \"imports\": []\n    },\n    \"src/components/StatusBadge/StatusBadge.module.css\": {\n      \"bytes\": 3405,\n      \"imports\": []\n    },\n    \"src/components/CloudpackProvider/useStatus.ts\": {\n      \"bytes\": 866,\n      \"imports\": [\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/images/open-16-filled.inline.svg\": {\n      \"bytes\": 852,\n      \"imports\": []\n    },\n    \"src/components/StatusBadge/StatusBadge.tsx\": {\n      \"bytes\": 2867,\n      \"imports\": [\n        {\n          \"path\": \"src/hooks/useDraggable.ts\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusBadge/StatusBadge.module.css\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/CloudpackProvider/useStatus.ts\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/images/open-16-filled.inline.svg\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/StatusDialog/TaskResultItem.module.css\": {\n      \"bytes\": 2067,\n      \"imports\": []\n    },\n    \"src/components/StatusDialog/TaskResultItem.tsx\": {\n      \"bytes\": 1433,\n      \"imports\": [\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusDialog/TaskResultItem.module.css\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/StatusDialog/TaskStatus.module.css\": {\n      \"bytes\": 3922,\n      \"imports\": []\n    },\n    \"src/images/error-24.inline.svg\": {\n      \"bytes\": 1024,\n      \"imports\": []\n    },\n    \"src/images/success-24.inline.svg\": {\n      \"bytes\": 562,\n      \"imports\": []\n    },\n    \"src/images/chevrondown-20.inline.svg\": {\n      \"bytes\": 450,\n      \"imports\": []\n    },\n    \"src/components/StatusDialog/TaskStatus.tsx\": {\n      \"bytes\": 4225,\n      \"imports\": [\n        {\n          \"path\": \"src/components/StatusDialog/TaskResultItem.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusDialog/TaskStatus.module.css\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/images/error-24.inline.svg\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/images/success-24.inline.svg\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/images/chevrondown-20.inline.svg\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/CloudpackProvider/useStatusDetails.ts\": {\n      \"bytes\": 844,\n      \"imports\": [\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/StatusDialog/TaskList.module.css\": {\n      \"bytes\": 615,\n      \"imports\": []\n    },\n    \"src/components/StatusDialog/TaskList.tsx\": {\n      \"bytes\": 1015,\n      \"imports\": [\n        {\n          \"path\": \"src/components/StatusDialog/TaskStatus.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/CloudpackProvider/useStatusDetails.ts\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusDialog/TaskList.module.css\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/Button/Button.module.css\": {\n      \"bytes\": 2080,\n      \"imports\": []\n    },\n    \"src/components/Button/Button.tsx\": {\n      \"bytes\": 360,\n      \"imports\": [\n        {\n          \"path\": \"src/components/Button/Button.module.css\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/Dialog/Dialog.module.css\": {\n      \"bytes\": 2454,\n      \"imports\": []\n    },\n    \"src/images/dismiss-16-filled.inline.svg\": {\n      \"bytes\": 718,\n      \"imports\": []\n    },\n    \"src/components/Dialog/Dialog.tsx\": {\n      \"bytes\": 1525,\n      \"imports\": [\n        {\n          \"path\": \"src/components/Dialog/Dialog.module.css\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/hooks/useDraggable.ts\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/images/dismiss-16-filled.inline.svg\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/StatusDialog/StatusDialog.tsx\": {\n      \"bytes\": 721,\n      \"imports\": [\n        {\n          \"path\": \"src/components/StatusDialog/TaskList.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/Button/Button.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/Dialog/Dialog.tsx\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/ErrorDialog/PathError.tsx\": {\n      \"bytes\": 1750,\n      \"imports\": [\n        {\n          \"path\": \"src/components/StatusDialog/TaskStatus.module.css\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/images/error-24.inline.svg\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/images/chevrondown-20.inline.svg\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/ErrorDialog/ErrorDialog.tsx\": {\n      \"bytes\": 996,\n      \"imports\": [\n        {\n          \"path\": \"src/components/Button/Button.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/ErrorDialog/PathError.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusDialog/TaskList.module.css\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/Dialog/Dialog.tsx\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/ErrorDialog/useErrorEvents.ts\": {\n      \"bytes\": 1265,\n      \"imports\": []\n    },\n    \"src/components/StatusOverlay/StatusOverlay.tsx\": {\n      \"bytes\": 1437,\n      \"imports\": [\n        {\n          \"path\": \"src/components/StatusBadge/StatusBadge.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusDialog/StatusDialog.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/CloudpackProvider/useStatus.ts\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/ErrorDialog/ErrorDialog.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/ErrorDialog/useErrorEvents.ts\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/components/ThemeProvider/ThemeProvider.module.css\": {\n      \"bytes\": 630,\n      \"imports\": []\n    },\n    \"src/components/ThemeProvider/ThemeProvider.tsx\": {\n      \"bytes\": 210,\n      \"imports\": [\n        {\n          \"path\": \"src/components/ThemeProvider/ThemeProvider.module.css\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    },\n    \"src/index.tsx\": {\n      \"bytes\": 532,\n      \"imports\": [\n        {\n          \"path\": \"src/components/CloudpackProvider/CloudpackProvider.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/StatusOverlay/StatusOverlay.tsx\",\n          \"kind\": \"import-statement\"\n        },\n        {\n          \"path\": \"src/components/ThemeProvider/ThemeProvider.tsx\",\n          \"kind\": \"import-statement\"\n        }\n      ]\n    }\n  },\n  \"outputs\": {\n    \"dist/lib/index.js\": {\n      \"imports\": [],\n      \"exports\": [],\n      \"entryPoint\": \"src/index.tsx\",\n      \"inputs\": {\n        \"src/index.tsx\": {\n          \"bytesInOutput\": 360\n        },\n        \"src/components/CloudpackProvider/CloudpackProvider.tsx\": {\n          \"bytesInOutput\": 372\n        },\n        \"src/components/CloudpackProvider/getCookies.ts\": {\n          \"bytesInOutput\": 317\n        },\n        \"src/components/CloudpackProvider/createCloudpackClient.ts\": {\n          \"bytesInOutput\": 2507\n        },\n        \"src/components/StatusOverlay/StatusOverlay.tsx\": {\n          \"bytesInOutput\": 1076\n        },\n        \"src/components/StatusBadge/StatusBadge.tsx\": {\n          \"bytesInOutput\": 3035\n        },\n        \"src/hooks/useDraggable.ts\": {\n          \"bytesInOutput\": 1937\n        },\n        \"src/components/StatusBadge/StatusBadge.module.css\": {\n          \"bytesInOutput\": 3118\n        },\n        \"src/components/CloudpackProvider/useStatus.ts\": {\n          \"bytesInOutput\": 448\n        },\n        \"src/images/open-16-filled.inline.svg\": {\n          \"bytesInOutput\": 1202\n        },\n        \"src/components/StatusDialog/StatusDialog.tsx\": {\n          \"bytesInOutput\": 484\n        },\n        \"src/components/StatusDialog/TaskList.tsx\": {\n          \"bytesInOutput\": 750\n        },\n        \"src/components/StatusDialog/TaskStatus.tsx\": {\n          \"bytesInOutput\": 4697\n        },\n        \"src/components/StatusDialog/TaskResultItem.tsx\": {\n          \"bytesInOutput\": 1421\n        },\n        \"src/components/StatusDialog/TaskResultItem.module.css\": {\n          \"bytesInOutput\": 1881\n        },\n        \"src/components/StatusDialog/TaskStatus.module.css\": {\n          \"bytesInOutput\": 3651\n        },\n        \"src/images/error-24.inline.svg\": {\n          \"bytesInOutput\": 1428\n        },\n        \"src/images/success-24.inline.svg\": {\n          \"bytesInOutput\": 814\n        },\n        \"src/images/chevrondown-20.inline.svg\": {\n          \"bytesInOutput\": 666\n        },\n        \"src/components/CloudpackProvider/useStatusDetails.ts\": {\n          \"bytesInOutput\": 299\n        },\n        \"src/components/StatusDialog/TaskList.module.css\": {\n          \"bytesInOutput\": 541\n        },\n        \"src/components/Button/Button.tsx\": {\n          \"bytesInOutput\": 312\n        },\n        \"src/components/Button/Button.module.css\": {\n          \"bytesInOutput\": 1942\n        },\n        \"src/components/Dialog/Dialog.tsx\": {\n          \"bytesInOutput\": 1399\n        },\n        \"src/components/Dialog/Dialog.module.css\": {\n          \"bytesInOutput\": 2280\n        },\n        \"src/images/dismiss-16-filled.inline.svg\": {\n          \"bytesInOutput\": 1029\n        },\n        \"src/components/ErrorDialog/ErrorDialog.tsx\": {\n          \"bytesInOutput\": 657\n        },\n        \"src/components/ErrorDialog/PathError.tsx\": {\n          \"bytesInOutput\": 2171\n        },\n        \"src/components/ErrorDialog/useErrorEvents.ts\": {\n          \"bytesInOutput\": 866\n        },\n        \"src/components/ThemeProvider/ThemeProvider.tsx\": {\n          \"bytesInOutput\": 191\n        },\n        \"src/components/ThemeProvider/ThemeProvider.module.css\": {\n          \"bytesInOutput\": 561\n        }\n      },\n      \"bytes\": 44489\n    }\n  }\n}\n"
 }

package/lib/components/Dialog/Dialog.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+export interface DialogProps {
+    title: string;
+    style?: 'default' | 'error';
+    draggable?: boolean;
+    onClose?: () => void;
+    commands?: React.ReactNode;
+    children: React.ReactNode;
+}
+export declare function Dialog({ title, style, draggable, onClose, commands, children }: DialogProps): JSX.Element;

package/lib/components/Dialog/Dialog.js

@@ -0,0 +1,20 @@
+import { default as React, useRef } from 'react';
+import styles from './Dialog.module.css';
+import { useDraggable } from '../../hooks/useDraggable.js';
+import CloseIcon from '../../images/dismiss-16-filled.inline.svg';
+export function Dialog({ title, style, draggable, onClose, commands, children }) {
+    const draggableRef = useRef(null);
+    const draggableTargetRef = useRef(null);
+    const colorAccent = style === 'error' ? 'rgb(164, 38, 44)' : undefined;
+    const cursorDraggable = draggable ? 'move' : undefined;
+    useDraggable(draggable ? draggableRef : undefined, draggable ? draggableTargetRef : undefined);
+    return (React.createElement("div", { className: styles.overlay },
+        React.createElement("div", { ref: draggableRef, className: styles.dialog, style: { borderTopColor: colorAccent } },
+            React.createElement("div", { className: styles.titleArea },
+                React.createElement("div", { ref: draggableTargetRef, className: styles.title, style: { color: colorAccent, cursor: cursorDraggable } }, title),
+                !!onClose && (React.createElement("button", { className: styles.closeButton, onClick: onClose },
+                    React.createElement("img", { src: CloseIcon, alt: "" })))),
+            !!commands && React.createElement("div", { className: styles.commands }, commands),
+            children)));
+}
+//# sourceMappingURL=Dialog.js.map

package/lib/components/Dialog/Dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,MAAM,MAAM,qBAAqB,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC3D,OAAO,SAAS,MAAM,2CAA2C,CAAC;AAWlE,MAAM,UAAU,MAAM,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAe;IAC1F,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAClC,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IACxC,MAAM,WAAW,GAAG,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,SAAS,CAAC;IACvE,MAAM,eAAe,GAAG,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC;IAEvD,YAAY,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAE/F,OAAO,CACL,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO;QAC5B,6BAAK,GAAG,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE;YACtF,6BAAK,SAAS,EAAE,MAAM,CAAC,SAAS;gBAC9B,6BACE,GAAG,EAAE,kBAAkB,EACvB,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,KAAK,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,eAAe,EAAE,IAErD,KAAK,CACF;gBACL,CAAC,CAAC,OAAO,IAAI,CACZ,gCAAQ,SAAS,EAAE,MAAM,CAAC,WAAW,EAAE,OAAO,EAAE,OAAO;oBACrD,6BAAK,GAAG,EAAE,SAAS,EAAE,GAAG,EAAC,EAAE,GAAG,CACvB,CACV,CACG;YACL,CAAC,CAAC,QAAQ,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,QAAQ,IAAG,QAAQ,CAAO;YAC/D,QAAQ,CACL,CACF,CACP,CAAC;AACJ,CAAC"}

package/lib/components/ErrorDialog/ErrorDialog.d.ts

@@ -0,0 +1,5 @@
+import type { UnsupportedErrorEvent } from './useErrorEvents.js';
+export interface ErrorDialogProps {
+    unsupported: UnsupportedErrorEvent[];
+}
+export declare function ErrorDialog({ unsupported }: ErrorDialogProps): JSX.Element;

package/lib/components/ErrorDialog/ErrorDialog.js

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+import { Button } from '../Button/Button.js';
+import { useCloudpack } from '../CloudpackProvider/CloudpackProvider.js';
+import { PathError } from './PathError.js';
+import styles from '../StatusDialog/TaskList.module.css';
+import { Dialog } from '../Dialog/Dialog.js';
+export function ErrorDialog({ unsupported }) {
+    const cloudpack = useCloudpack();
+    const reload = () => {
+        cloudpack.restartTasks();
+    };
+    return (React.createElement(Dialog, { title: "Found unsupported paths in your project", style: "error", commands: React.createElement(Button, { primary: true, onClick: reload }, "Reload") },
+        React.createElement("div", { className: styles.root }, unsupported.map((data, index) => (React.createElement(PathError, { ...data, key: index }))))));
+}
+//# sourceMappingURL=ErrorDialog.js.map

package/lib/components/ErrorDialog/ErrorDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorDialog.js","sourceRoot":"","sources":["../../../src/components/ErrorDialog/ErrorDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,2CAA2C,CAAC;AACzE,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,MAAM,MAAM,qCAAqC,CAAC;AAEzD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAM7C,MAAM,UAAU,WAAW,CAAC,EAAE,WAAW,EAAoB;IAC3D,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;IAEjC,MAAM,MAAM,GAAG,GAAG,EAAE;QAClB,SAAS,CAAC,YAAY,EAAE,CAAC;IAC3B,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,MAAM,IACL,KAAK,EAAC,yCAAyC,EAC/C,KAAK,EAAC,OAAO,EACb,QAAQ,EACN,oBAAC,MAAM,IAAC,OAAO,QAAC,OAAO,EAAE,MAAM,aAEtB;QAGX,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI,IACxB,WAAW,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAChC,oBAAC,SAAS,OAAK,IAAI,EAAE,GAAG,EAAE,KAAK,GAAI,CACpC,CAAC,CACE,CACC,CACV,CAAC;AACJ,CAAC"}

package/lib/components/ErrorDialog/PathError.d.ts

@@ -0,0 +1,2 @@
+import type { UnsupportedErrorEvent } from './useErrorEvents.js';
+export declare function PathError(props: UnsupportedErrorEvent): JSX.Element;

package/lib/components/ErrorDialog/PathError.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import styles from '../StatusDialog/TaskStatus.module.css';
+import ErrorIcon from '../../images/error-24.inline.svg';
+import { default as cx } from 'classnames';
+import ChevronDownIcon from '../../images/chevrondown-20.inline.svg';
+export function PathError(props) {
+    const [showContent, setshowContent] = React.useState(false);
+    const { packageName, path } = props;
+    return (React.createElement("div", { className: styles.root },
+        React.createElement("div", { className: cx(styles.header, styles.error) },
+            React.createElement("button", { className: styles.expandButton, onClick: () => setshowContent(!showContent) },
+                React.createElement("img", { className: cx(styles.expandIcon, !showContent && styles.collapsed), src: ChevronDownIcon, alt: "" })),
+            React.createElement("img", { className: styles.errorIcon, src: ErrorIcon, alt: "" }),
+            React.createElement("div", { className: styles.title }, `${packageName}/${path}`)),
+        showContent && (React.createElement("div", { className: styles.content },
+            React.createElement("div", { className: styles.title }, "Details"),
+            React.createElement("div", { className: styles.nameValueArea },
+                React.createElement("div", { className: styles.name }, "Problem"),
+                React.createElement("div", { className: styles.value }, `A deep import "${packageName}" was imported, but was unrecognized as an exported entry path.`)),
+            React.createElement("div", { className: styles.nameValueArea },
+                React.createElement("div", { className: styles.name }, "Solution"),
+                React.createElement("div", { className: styles.value }, `Remove the path from the import in your source. (Import from "${packageName}" rather than "${packageName}/${path}")`))))));
+}
+//# sourceMappingURL=PathError.js.map

package/lib/components/ErrorDialog/PathError.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PathError.js","sourceRoot":"","sources":["../../../src/components/ErrorDialog/PathError.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,uCAAuC,CAAC;AAC3D,OAAO,SAAS,MAAM,kCAAkC,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,EAAE,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,eAAe,MAAM,wCAAwC,CAAC;AAGrE,MAAM,UAAU,SAAS,CAAC,KAA4B;IACpD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAU,KAAK,CAAC,CAAC;IACrE,MAAM,EAAE,WAAW,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAEpC,OAAO,CACL,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI;QACzB,6BAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC;YAC7C,gCAAQ,SAAS,EAAE,MAAM,CAAC,YAAY,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,CAAC,WAAW,CAAC;gBACjF,6BAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,UAAU,EAAE,CAAC,WAAW,IAAI,MAAM,CAAC,SAAS,CAAC,EAAE,GAAG,EAAE,eAAe,EAAE,GAAG,EAAC,EAAE,GAAG,CACjG;YACT,6BAAK,SAAS,EAAE,MAAM,CAAC,SAAS,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,EAAC,EAAE,GAAG;YAC3D,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK,IAAG,GAAG,WAAW,IAAI,IAAI,EAAE,CAAO,CAC1D;QACL,WAAW,IAAI,CACd,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO;YAC5B,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK,cAAe;YAE3C,6BAAK,SAAS,EAAE,MAAM,CAAC,aAAa;gBAClC,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI,cAAe;gBAC1C,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK,IACzB,kBAAkB,WAAW,iEAAiE,CAC3F,CACF;YACN,6BAAK,SAAS,EAAE,MAAM,CAAC,aAAa;gBAClC,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI,eAAgB;gBAC3C,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK,IACzB,iEAAiE,WAAW,kBAAkB,WAAW,IAAI,IAAI,IAAI,CAClH,CACF,CACF,CACP,CACG,CACP,CAAC;AACJ,CAAC"}

package/lib/components/ErrorDialog/useErrorEvents.d.ts

@@ -0,0 +1,15 @@
+declare global {
+    interface Window {
+        uncaughtErrors: {
+            errors: ErrorEvent[];
+            unregister: () => void;
+        };
+    }
+}
+export declare type UnsupportedErrorEvent = {
+    packageName: string;
+    path: string;
+};
+export declare const useErrorEvents: () => {
+    unsupported: UnsupportedErrorEvent[];
+};

package/lib/components/ErrorDialog/useErrorEvents.js

@@ -0,0 +1,27 @@
+import { useEffect, useState } from 'react';
+export const useErrorEvents = () => {
+    const [events, setEvents] = useState({ unsupported: [] });
+    useEffect(() => {
+        // Append unsupported paths to the list.
+        const handleError = (event) => {
+            const regex = /[Mm]odule specifier,? ['"](.*?)\/(.*?)['"]/;
+            const match = event.message.match(regex);
+            if (match && match.length === 3) {
+                setEvents((prevEvents) => ({
+                    ...prevEvents,
+                    unsupported: [...prevEvents.unsupported, { packageName: match[1], path: match[2] }],
+                }));
+            }
+        };
+        window.uncaughtErrors = window.uncaughtErrors || { errors: [], unregister: () => undefined };
+        window.uncaughtErrors.unregister();
+        window.addEventListener('error', handleError);
+        // Handle errors caught before rendering.
+        for (const error of window.uncaughtErrors.errors) {
+            handleError(error);
+        }
+        // No dependencies. This effect should only run once.
+    }, []);
+    return events;
+};
+//# sourceMappingURL=useErrorEvents.js.map

package/lib/components/ErrorDialog/useErrorEvents.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useErrorEvents.js","sourceRoot":"","sources":["../../../src/components/ErrorDialog/useErrorEvents.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAa5C,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IACjC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAA2C,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,CAAC;IAEpG,SAAS,CAAC,GAAG,EAAE;QACb,wCAAwC;QACxC,MAAM,WAAW,GAAG,CAAC,KAAiB,EAAE,EAAE;YACxC,MAAM,KAAK,GAAG,4CAA4C,CAAC;YAC3D,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YACzC,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;gBAC/B,SAAS,CAAC,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;oBACzB,GAAG,UAAU;oBACb,WAAW,EAAE,CAAC,GAAG,UAAU,CAAC,WAAW,EAAE,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;iBACpF,CAAC,CAAC,CAAC;aACL;QACH,CAAC,CAAC;QAEF,MAAM,CAAC,cAAc,GAAG,MAAM,CAAC,cAAc,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,CAAC,SAAS,EAAE,CAAC;QAC7F,MAAM,CAAC,cAAc,CAAC,UAAU,EAAE,CAAC;QACnC,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QAE9C,yCAAyC;QACzC,KAAK,MAAM,KAAK,IAAI,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE;YAChD,WAAW,CAAC,KAAK,CAAC,CAAC;SACpB;QAED,qDAAqD;IACvD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC"}

package/lib/components/StatusDialog/StatusDialog.d.ts

@@ -1,7 +1,4 @@
-import { default as React } from 'react';
 export interface StatusDialogProps {
     onClose: () => void;
 }
-declare function StatusDialogUnmemoized({ onClose }: StatusDialogProps): JSX.Element;
-export declare const StatusDialog: React.MemoExoticComponent<typeof StatusDialogUnmemoized>;
-export {};
+export declare function StatusDialog({ onClose }: StatusDialogProps): JSX.Element;

package/lib/components/StatusDialog/StatusDialog.js

@@ -1,29 +1,14 @@
-import { default as React, useRef } from 'react';
-import styles from './StatusDialog.module.css';
-import { useDraggable } from '../../hooks/useDraggable.js';
-import CloseIcon from '../../images/dismiss-16-filled.inline.svg';
+import React from 'react';
 import { TaskList } from './TaskList.js';
 import { useCloudpack } from '../CloudpackProvider/CloudpackProvider.js';
 import { Button } from '../Button/Button.js';
-function StatusDialogUnmemoized({ onClose }) {
-    const draggableRef = useRef(null);
-    const draggableTargetRef = useRef(null);
+import { Dialog } from '../Dialog/Dialog.js';
+export function StatusDialog({ onClose }) {
     const cloudpack = useCloudpack();
-    useDraggable(draggableRef, draggableTargetRef);
     const restartTasks = () => {
         cloudpack.restartTasks();
     };
-    return (React.createElement("div", { className: styles.overlay },
-        React.createElement("div", { ref: draggableRef, className: styles.dialog },
-            React.createElement("div", { className: styles.titleArea },
-                React.createElement("div", { ref: draggableTargetRef, className: styles.title }, "Task results"),
-                React.createElement("button", { className: styles.closeButton, onClick: onClose },
-                    React.createElement("img", { src: CloseIcon, alt: "" }))),
-            React.createElement("div", { className: styles.commands },
-                React.createElement(Button, { primary: true, onClick: restartTasks }, "Restart all tasks")),
-            React.createElement(TaskList, null))));
+    return (React.createElement(Dialog, { title: "Task results", draggable: true, onClose: onClose, commands: React.createElement(Button, { primary: true, onClick: restartTasks }, "Restart all tasks") },
+        React.createElement(TaskList, null)));
 }
-export const StatusDialog = React.memo(StatusDialogUnmemoized, (prev, next) => {
-    return prev.onClose === next.onClose;
-});
 //# sourceMappingURL=StatusDialog.js.map

package/lib/components/StatusDialog/StatusDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusDialog.js","sourceRoot":"","sources":["../../../src/components/StatusDialog/StatusDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,MAAM,MAAM,2BAA2B,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC3D,OAAO,SAAS,MAAM,2CAA2C,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,2CAA2C,CAAC;AACzE,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAM7C,SAAS,sBAAsB,CAAC,EAAE,OAAO,EAAqB;IAC5D,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAClC,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IACxC,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;IAEjC,YAAY,CAAC,YAAY,EAAE,kBAAkB,CAAC,CAAC;IAE/C,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,SAAS,CAAC,YAAY,EAAE,CAAC;IAC3B,CAAC,CAAC;IAEF,OAAO,CACL,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO;QAC5B,6BAAK,GAAG,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,CAAC,MAAM;YAC9C,6BAAK,SAAS,EAAE,MAAM,CAAC,SAAS;gBAC9B,6BAAK,GAAG,EAAE,kBAAkB,EAAE,SAAS,EAAE,MAAM,CAAC,KAAK,mBAE/C;gBACN,gCAAQ,SAAS,EAAE,MAAM,CAAC,WAAW,EAAE,OAAO,EAAE,OAAO;oBACrD,6BAAK,GAAG,EAAE,SAAS,EAAE,GAAG,EAAC,EAAE,GAAG,CACvB,CACL;YACN,6BAAK,SAAS,EAAE,MAAM,CAAC,QAAQ;gBAC7B,oBAAC,MAAM,IAAC,OAAO,QAAC,OAAO,EAAE,YAAY,wBAE5B,CACL;YACN,oBAAC,QAAQ,OAAG,CACR,CACF,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,sBAAsB,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE;IAC5E,OAAO,IAAI,CAAC,OAAO,KAAK,IAAI,CAAC,OAAO,CAAC;AACvC,CAAC,CAAC,CAAC"}
+{"version":3,"file":"StatusDialog.js","sourceRoot":"","sources":["../../../src/components/StatusDialog/StatusDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,2CAA2C,CAAC;AACzE,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAM7C,MAAM,UAAU,YAAY,CAAC,EAAE,OAAO,EAAqB;IACzD,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;IAEjC,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,SAAS,CAAC,YAAY,EAAE,CAAC;IAC3B,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,MAAM,IACL,KAAK,EAAC,cAAc,EACpB,SAAS,QACT,OAAO,EAAE,OAAO,EAChB,QAAQ,EACN,oBAAC,MAAM,IAAC,OAAO,QAAC,OAAO,EAAE,YAAY,wBAE5B;QAGX,oBAAC,QAAQ,OAAG,CACL,CACV,CAAC;AACJ,CAAC"}

package/lib/components/StatusOverlay/StatusOverlay.js

@@ -2,10 +2,13 @@ import React, { useCallback, useState, useRef } from 'react';
 import { StatusBadge } from '../StatusBadge/StatusBadge.js';
 import { StatusDialog } from '../StatusDialog/StatusDialog.js';
 import { useStatus } from '../CloudpackProvider/useStatus.js';
+import { ErrorDialog } from '../ErrorDialog/ErrorDialog.js';
+import { useErrorEvents } from '../ErrorDialog/useErrorEvents.js';
 export function StatusOverlay() {
     const [isExpanded, setIsExpanded] = useState(false);
     const status = useStatus();
     const internal = useRef();
+    const { unsupported } = useErrorEvents();
     // If we haven't set a specific state and we become idle,
     // pop open the details if there are errors.
     if (isExpanded === false &&
@@ -20,7 +23,8 @@ export function StatusOverlay() {
         setIsExpanded(!isExpanded);
     }, [isExpanded, setIsExpanded]);
     return (React.createElement("div", null,
-        !isExpanded && React.createElement(StatusBadge, { onExpand: toggleMinimized }),
-        isExpanded && React.createElement(StatusDialog, { onClose: toggleMinimized })));
+        !!unsupported.length && React.createElement(ErrorDialog, { unsupported: unsupported }),
+        !unsupported.length && !isExpanded && React.createElement(StatusBadge, { onExpand: toggleMinimized }),
+        !unsupported.length && isExpanded && React.createElement(StatusDialog, { onClose: toggleMinimized })));
 }
 //# sourceMappingURL=StatusOverlay.js.map

package/lib/components/StatusOverlay/StatusOverlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusOverlay.js","sourceRoot":"","sources":["../../../src/components/StatusOverlay/StatusOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAwB,MAAM,mCAAmC,CAAC;AAEpF,MAAM,UAAU,aAAa;IAC3B,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAC7D,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,QAAQ,GAAG,MAAM,EAA+B,CAAC;IAEvD,yDAAyD;IACzD,4CAA4C;IAC5C,IACE,UAAU,KAAK,KAAK;QACpB,QAAQ,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM;QACnC,MAAM,CAAC,MAAM,KAAK,MAAM;QACxB,QAAQ,CAAC,OAAO,EAAE,WAAW,IAAI,MAAM,CAAC,WAAW,EACnD;QACA,aAAa,CAAC,IAAI,CAAC,CAAC;KACrB;IACD,QAAQ,CAAC,OAAO,GAAG,MAAM,CAAC;IAE1B,MAAM,eAAe,GAAG,WAAW,CAAC,GAAG,EAAE;QACvC,OAAO,CAAC,GAAG,CAAC,+BAA+B,CAAC,UAAU,EAAE,CAAC,CAAC;QAC1D,aAAa,CAAC,CAAC,UAAU,CAAC,CAAC;IAC7B,CAAC,EAAE,CAAC,UAAU,EAAE,aAAa,CAAC,CAAC,CAAC;IAEhC,OAAO,CACL;QACG,CAAC,UAAU,IAAI,oBAAC,WAAW,IAAC,QAAQ,EAAE,eAAe,GAAI;QACzD,UAAU,IAAI,oBAAC,YAAY,IAAC,OAAO,EAAE,eAAe,GAAI,CACrD,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"StatusOverlay.js","sourceRoot":"","sources":["../../../src/components/StatusOverlay/StatusOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAwB,MAAM,mCAAmC,CAAC;AACpF,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAElE,MAAM,UAAU,aAAa;IAC3B,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAC7D,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,QAAQ,GAAG,MAAM,EAA+B,CAAC;IACvD,MAAM,EAAE,WAAW,EAAE,GAAG,cAAc,EAAE,CAAC;IAEzC,yDAAyD;IACzD,4CAA4C;IAC5C,IACE,UAAU,KAAK,KAAK;QACpB,QAAQ,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM;QACnC,MAAM,CAAC,MAAM,KAAK,MAAM;QACxB,QAAQ,CAAC,OAAO,EAAE,WAAW,IAAI,MAAM,CAAC,WAAW,EACnD;QACA,aAAa,CAAC,IAAI,CAAC,CAAC;KACrB;IACD,QAAQ,CAAC,OAAO,GAAG,MAAM,CAAC;IAE1B,MAAM,eAAe,GAAG,WAAW,CAAC,GAAG,EAAE;QACvC,OAAO,CAAC,GAAG,CAAC,+BAA+B,CAAC,UAAU,EAAE,CAAC,CAAC;QAC1D,aAAa,CAAC,CAAC,UAAU,CAAC,CAAC;IAC7B,CAAC,EAAE,CAAC,UAAU,EAAE,aAAa,CAAC,CAAC,CAAC;IAEhC,OAAO,CACL;QACG,CAAC,CAAC,WAAW,CAAC,MAAM,IAAI,oBAAC,WAAW,IAAC,WAAW,EAAE,WAAW,GAAI;QACjE,CAAC,WAAW,CAAC,MAAM,IAAI,CAAC,UAAU,IAAI,oBAAC,WAAW,IAAC,QAAQ,EAAE,eAAe,GAAI;QAChF,CAAC,WAAW,CAAC,MAAM,IAAI,UAAU,IAAI,oBAAC,YAAY,IAAC,OAAO,EAAE,eAAe,GAAI,CAC5E,CACP,CAAC;AACJ,CAAC"}

package/lib/tsdoc-metadata.json

@@ -5,7 +5,7 @@
   "toolPackages": [
     {
       "packageName": "@microsoft/api-extractor",
-      "packageVersion": "7.31.2"
+      "packageVersion": "7.32.0"
     }
   ]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ms-cloudpack/overlay",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "The Cloudpack overlay ux.",
   "license": "MIT",
   "types": "./lib/index.d.ts",