@ms-cloudpack/overlay 0.19.7 → 0.19.9

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

@@ -1 +1 @@
-{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAMnE,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,EAAE,iBAAiB,CAAC;CAC7B;AAED,eAAO,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,CA4BjD,CAAC"}
+{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,iBAAiB,EAAkB,MAAM,QAAQ,CAAC;AAanF,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,EAAE,iBAAiB,CAAC;CAC7B;AAED,eAAO,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,CA6CjD,CAAC"}

package/lib/components/Dialog/Dialog.js

@@ -1,19 +1,23 @@
 import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
 import cx from 'classnames';
 import { useRef } from 'preact/hooks';
+import { FocusOn as _FocusOn } from 'react-focus-on';
 import styles from './Dialog.module.css';
 import { useDraggable } from '../../hooks/useDraggable.js';
 import { Button } from '../Button/Button.js';
+import { elementIds } from '../../constants.js';
+// Re-type children for preact
+const FocusOn = _FocusOn;
 export const Dialog = (props) => {
     const { title, id, style, draggable, onClose, commands, children } = props;
-    const draggableRef = useRef(null);
-    const draggableTargetRef = useRef(null);
+    const dialogRootRef = useRef(null);
+    const titleRef = useRef(null);
     useDraggable({
         enabled: !!draggable,
-        containerElementRef: draggableRef,
-        dragElementRef: draggableTargetRef,
+        containerElementRef: dialogRootRef,
+        dragElementRef: titleRef,
     });
-    return (_jsx("div", { id: id, class: styles.overlay, children: _jsxs("div", { ref: draggableRef, class: cx(styles.dialog, style === 'error' && styles.error), children: [_jsxs("div", { class: styles.titleArea, children: [_jsx("h2", { ref: draggableTargetRef, class: cx(styles.title, draggable && styles.draggable), children: title }), onClose && (
+    return (_jsx(FocusOn, { className: styles.overlay, onClickOutside: onClose, onEscapeKey: onClose, onActivation: () => titleRef.current?.focus(), children: _jsxs("div", { id: id, ref: dialogRootRef, class: cx(styles.dialog, style === 'error' && styles.error), role: "dialog", "aria-modal": true, "aria-labelledby": elementIds.dialogTitle, children: [_jsxs("div", { class: styles.titleArea, children: [_jsx("h2", { ref: titleRef, id: elementIds.dialogTitle, class: cx(styles.title, draggable && styles.draggable), tabIndex: -1, children: title }), onClose && (
                         // a close icon is common/universal enough that it doesn't need hover text
                         _jsx(Button, { variant: "iconOnly", iconName: "close", onClick: onClose, "aria-label": "Close" }))] }), commands && _jsx("div", { class: styles.commands, children: commands }), children] }) }));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAE5B,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,MAAM,MAAM,qBAAqB,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC3D,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAY7C,MAAM,CAAC,MAAM,MAAM,GAAmC,CAAC,KAAK,EAAE,EAAE;IAC9D,MAAM,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC3E,MAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAClD,MAAM,kBAAkB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAExD,YAAY,CAAC;QACX,OAAO,EAAE,CAAC,CAAC,SAAS;QACpB,mBAAmB,EAAE,YAAY;QACjC,cAAc,EAAE,kBAAkB;KACnC,CAAC,CAAC;IAEH,OAAO,CACL,cAAK,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,CAAC,OAAO,YAChC,eAAK,GAAG,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,KAAK,KAAK,OAAO,IAAI,MAAM,CAAC,KAAK,CAAC,aACjF,eAAK,KAAK,EAAE,MAAM,CAAC,SAAS,aAC1B,aAAI,GAAG,EAAE,kBAAkB,EAAE,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,SAAS,IAAI,MAAM,CAAC,SAAS,CAAC,YAChF,KAAK,GACH,EACJ,OAAO,IAAI;wBACV,0EAA0E;wBAC1E,KAAC,MAAM,IAAC,OAAO,EAAC,UAAU,EAAC,QAAQ,EAAC,OAAO,EAAC,OAAO,EAAE,OAAO,gBAAa,OAAO,GAAG,CACpF,IACG,EACL,QAAQ,IAAI,cAAK,KAAK,EAAE,MAAM,CAAC,QAAQ,YAAG,QAAQ,GAAO,EACzD,QAAQ,IACL,GACF,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import cx from 'classnames';\nimport type { ComponentChildren, FunctionComponent } from 'preact';\nimport { useRef } from 'preact/hooks';\nimport styles from './Dialog.module.css';\nimport { useDraggable } from '../../hooks/useDraggable.js';\nimport { Button } from '../Button/Button.js';\n\nexport interface DialogProps {\n  title: string;\n  id: string;\n  style?: 'default' | 'error';\n  draggable?: boolean;\n  onClose?: () => void;\n  commands?: ComponentChildren;\n  children: ComponentChildren;\n}\n\nexport const Dialog: FunctionComponent<DialogProps> = (props) => {\n  const { title, id, style, draggable, onClose, commands, children } = props;\n  const draggableRef = useRef<HTMLDivElement>(null);\n  const draggableTargetRef = useRef<HTMLDivElement>(null);\n\n  useDraggable({\n    enabled: !!draggable,\n    containerElementRef: draggableRef,\n    dragElementRef: draggableTargetRef,\n  });\n\n  return (\n    <div id={id} class={styles.overlay}>\n      <div ref={draggableRef} class={cx(styles.dialog, style === 'error' && styles.error)}>\n        <div class={styles.titleArea}>\n          <h2 ref={draggableTargetRef} class={cx(styles.title, draggable && styles.draggable)}>\n            {title}\n          </h2>\n          {onClose && (\n            // a close icon is common/universal enough that it doesn't need hover text\n            <Button variant=\"iconOnly\" iconName=\"close\" onClick={onClose} aria-label=\"Close\" />\n          )}\n        </div>\n        {commands && <div class={styles.commands}>{commands}</div>}\n        {children}\n      </div>\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAE5B,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,MAAM,MAAM,qBAAqB,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC3D,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAEhD,8BAA8B;AAC9B,MAAM,OAAO,GAAG,QAEf,CAAC;AAYF,MAAM,CAAC,MAAM,MAAM,GAAmC,CAAC,KAAK,EAAE,EAAE;IAC9D,MAAM,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC3E,MAAM,aAAa,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACnD,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE9C,YAAY,CAAC;QACX,OAAO,EAAE,CAAC,CAAC,SAAS;QACpB,mBAAmB,EAAE,aAAa;QAClC,cAAc,EAAE,QAAQ;KACzB,CAAC,CAAC;IAEH,OAAO,CACL,KAAC,OAAO,IACN,SAAS,EAAE,MAAM,CAAC,OAAO,EACzB,cAAc,EAAE,OAAO,EACvB,WAAW,EAAE,OAAO,EACpB,YAAY,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,YAE7C,eACE,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,aAAa,EAClB,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,KAAK,KAAK,OAAO,IAAI,MAAM,CAAC,KAAK,CAAC,EAC3D,IAAI,EAAC,QAAQ,yCAEI,UAAU,CAAC,WAAW,aAEvC,eAAK,KAAK,EAAE,MAAM,CAAC,SAAS,aAC1B,aACE,GAAG,EAAE,QAAQ,EACb,EAAE,EAAE,UAAU,CAAC,WAAW,EAC1B,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,SAAS,IAAI,MAAM,CAAC,SAAS,CAAC,EACtD,QAAQ,EAAE,CAAC,CAAC,YAEX,KAAK,GACH,EACJ,OAAO,IAAI;wBACV,0EAA0E;wBAC1E,KAAC,MAAM,IAAC,OAAO,EAAC,UAAU,EAAC,QAAQ,EAAC,OAAO,EAAC,OAAO,EAAE,OAAO,gBAAa,OAAO,GAAG,CACpF,IACG,EACL,QAAQ,IAAI,cAAK,KAAK,EAAE,MAAM,CAAC,QAAQ,YAAG,QAAQ,GAAO,EACzD,QAAQ,IACL,GACE,CACX,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import cx from 'classnames';\nimport type { ComponentChildren, FunctionComponent, ComponentProps } from 'preact';\nimport { useRef } from 'preact/hooks';\nimport { FocusOn as _FocusOn } from 'react-focus-on';\nimport styles from './Dialog.module.css';\nimport { useDraggable } from '../../hooks/useDraggable.js';\nimport { Button } from '../Button/Button.js';\nimport { elementIds } from '../../constants.js';\n\n// Re-type children for preact\nconst FocusOn = _FocusOn as FunctionComponent<\n  Omit<ComponentProps<typeof _FocusOn>, 'children'> & { children: ComponentChildren }\n>;\n\nexport interface DialogProps {\n  title: string;\n  id: string;\n  style?: 'default' | 'error';\n  draggable?: boolean;\n  onClose?: () => void;\n  commands?: ComponentChildren;\n  children: ComponentChildren;\n}\n\nexport const Dialog: FunctionComponent<DialogProps> = (props) => {\n  const { title, id, style, draggable, onClose, commands, children } = props;\n  const dialogRootRef = useRef<HTMLDivElement>(null);\n  const titleRef = useRef<HTMLDivElement>(null);\n\n  useDraggable({\n    enabled: !!draggable,\n    containerElementRef: dialogRootRef,\n    dragElementRef: titleRef,\n  });\n\n  return (\n    <FocusOn\n      className={styles.overlay}\n      onClickOutside={onClose}\n      onEscapeKey={onClose}\n      onActivation={() => titleRef.current?.focus()}\n    >\n      <div\n        id={id}\n        ref={dialogRootRef}\n        class={cx(styles.dialog, style === 'error' && styles.error)}\n        role=\"dialog\"\n        aria-modal\n        aria-labelledby={elementIds.dialogTitle}\n      >\n        <div class={styles.titleArea}>\n          <h2\n            ref={titleRef}\n            id={elementIds.dialogTitle}\n            class={cx(styles.title, draggable && styles.draggable)}\n            tabIndex={-1}\n          >\n            {title}\n          </h2>\n          {onClose && (\n            // a close icon is common/universal enough that it doesn't need hover text\n            <Button variant=\"iconOnly\" iconName=\"close\" onClick={onClose} aria-label=\"Close\" />\n          )}\n        </div>\n        {commands && <div class={styles.commands}>{commands}</div>}\n        {children}\n      </div>\n    </FocusOn>\n  );\n};\n"]}

package/lib/components/Overlay/Overlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Overlay.d.ts","sourceRoot":"","sources":["../../../src/components/Overlay/Overlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAYhD,eAAO,MAAM,OAAO,EAAE,iBAmCrB,CAAC"}
+{"version":3,"file":"Overlay.d.ts","sourceRoot":"","sources":["../../../src/components/Overlay/Overlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAYhD,eAAO,MAAM,OAAO,EAAE,iBA+BrB,CAAC"}

package/lib/components/Overlay/Overlay.js

@@ -1,6 +1,6 @@
-import { jsx as _jsx } from "preact/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "preact/jsx-runtime";
 import { lazy, Suspense } from 'preact/compat';
-import { useCallback, useState, useRef, useEffect } from 'preact/hooks';
+import { useState, useRef, useEffect } from 'preact/hooks';
 import { StatusBadge } from '../StatusBadge/StatusBadge.js';
 import { useTaskStats } from '../CloudpackProvider/useTaskStats.js';
 import { useErrorEvents } from '../ErrorDialog/useErrorEvents.js';
@@ -9,26 +9,22 @@ const StatusDialog = lazy(() => import('../StatusDialog/StatusDialog.js'));
 const ErrorDialog = lazy(() => import('../ErrorDialog/ErrorDialog.js'));
 export const Overlay = () => {
     const pageLoadTimeReport = usePageLoadTimeReporter();
-    const [isExpanded, setIsExpanded] = useState(false);
+    const [isDialogOpen, setIsDialogOpen] = useState(false);
     const stats = useTaskStats();
     const prevStats = useRef();
     const { unsupported } = useErrorEvents();
     // If we haven't set a specific state and we become idle,
     // pop open the details if there are errors.
     useEffect(() => {
-        if (!isExpanded &&
+        if (!isDialogOpen &&
             prevStats.current?.status !== 'idle' &&
             stats.status === 'idle' &&
             (prevStats.current?.totalErrors || 0) !== (stats.totalErrors || 0)) {
-            setIsExpanded(true);
+            setIsDialogOpen(true);
         }
         prevStats.current = stats;
-    }, [stats, isExpanded]);
-    const toggleMinimized = useCallback(() => {
-        console.log(`Toggling minimized state to ${!isExpanded}`);
-        setIsExpanded(!isExpanded);
-    }, [isExpanded]);
-    const result = unsupported.length ? (_jsx(ErrorDialog, { unsupported: unsupported })) : isExpanded ? (_jsx(StatusDialog, { onClose: toggleMinimized })) : (_jsx(StatusBadge, { onExpand: toggleMinimized, pageLoadTimeReport: pageLoadTimeReport }));
+    }, [stats, isDialogOpen]);
+    const result = unsupported.length ? (_jsx(ErrorDialog, { unsupported: unsupported })) : (_jsxs(_Fragment, { children: [isDialogOpen && _jsx(StatusDialog, { onClose: () => setIsDialogOpen(false) }), _jsx(StatusBadge, { onOpenDialog: () => setIsDialogOpen(true), pageLoadTimeReport: pageLoadTimeReport })] }));
     return _jsx(Suspense, { fallback: null, children: result });
 };
 //# sourceMappingURL=Overlay.js.map

package/lib/components/Overlay/Overlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"Overlay.js","sourceRoot":"","sources":["../../../src/components/Overlay/Overlay.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACxE,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAClE,OAAO,EAAE,uBAAuB,EAAE,MAAM,wCAAwC,CAAC;AAGjF,MAAM,YAAY,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,iCAAiC,CAAC,CAAC,CAAC;AAC3E,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,+BAA+B,CAAC,CAAC,CAAC;AAExE,MAAM,CAAC,MAAM,OAAO,GAAsB,GAAG,EAAE;IAC7C,MAAM,kBAAkB,GAAG,uBAAuB,EAAE,CAAC;IACrD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAC7D,MAAM,KAAK,GAAG,YAAY,EAAE,CAAC;IAC7B,MAAM,SAAS,GAAG,MAAM,EAAyB,CAAC;IAClD,MAAM,EAAE,WAAW,EAAE,GAAG,cAAc,EAAE,CAAC;IAEzC,yDAAyD;IACzD,4CAA4C;IAC5C,SAAS,CAAC,GAAG,EAAE;QACb,IACE,CAAC,UAAU;YACX,SAAS,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM;YACpC,KAAK,CAAC,MAAM,KAAK,MAAM;YACvB,CAAC,SAAS,CAAC,OAAO,EAAE,WAAW,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,WAAW,IAAI,CAAC,CAAC,EAClE,CAAC;YACD,aAAa,CAAC,IAAI,CAAC,CAAC;QACtB,CAAC;QACD,SAAS,CAAC,OAAO,GAAG,KAAK,CAAC;IAC5B,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC;IAExB,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,CAAC,CAAC,CAAC;IAEjB,MAAM,MAAM,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,CAClC,KAAC,WAAW,IAAC,WAAW,EAAE,WAAW,GAAI,CAC1C,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CACf,KAAC,YAAY,IAAC,OAAO,EAAE,eAAe,GAAI,CAC3C,CAAC,CAAC,CAAC,CACF,KAAC,WAAW,IAAC,QAAQ,EAAE,eAAe,EAAE,kBAAkB,EAAE,kBAAkB,GAAI,CACnF,CAAC;IAEF,OAAO,KAAC,QAAQ,IAAC,QAAQ,EAAE,IAAI,YAAG,MAAM,GAAY,CAAC;AACvD,CAAC,CAAC","sourcesContent":["import type { FunctionComponent } from 'preact';\nimport { lazy, Suspense } from 'preact/compat';\nimport { useCallback, useState, useRef, useEffect } from 'preact/hooks';\nimport { StatusBadge } from '../StatusBadge/StatusBadge.js';\nimport { useTaskStats } from '../CloudpackProvider/useTaskStats.js';\nimport { useErrorEvents } from '../ErrorDialog/useErrorEvents.js';\nimport { usePageLoadTimeReporter } from '../../hooks/usePageLoadTimeReporter.js';\nimport type { TaskStats } from '@ms-cloudpack/api-server/browser';\n\nconst StatusDialog = lazy(() => import('../StatusDialog/StatusDialog.js'));\nconst ErrorDialog = lazy(() => import('../ErrorDialog/ErrorDialog.js'));\n\nexport const Overlay: FunctionComponent = () => {\n  const pageLoadTimeReport = usePageLoadTimeReporter();\n  const [isExpanded, setIsExpanded] = useState<boolean>(false);\n  const stats = useTaskStats();\n  const prevStats = useRef<TaskStats | undefined>();\n  const { unsupported } = useErrorEvents();\n\n  // If we haven't set a specific state and we become idle,\n  // pop open the details if there are errors.\n  useEffect(() => {\n    if (\n      !isExpanded &&\n      prevStats.current?.status !== 'idle' &&\n      stats.status === 'idle' &&\n      (prevStats.current?.totalErrors || 0) !== (stats.totalErrors || 0)\n    ) {\n      setIsExpanded(true);\n    }\n    prevStats.current = stats;\n  }, [stats, isExpanded]);\n\n  const toggleMinimized = useCallback(() => {\n    console.log(`Toggling minimized state to ${!isExpanded}`);\n    setIsExpanded(!isExpanded);\n  }, [isExpanded]);\n\n  const result = unsupported.length ? (\n    <ErrorDialog unsupported={unsupported} />\n  ) : isExpanded ? (\n    <StatusDialog onClose={toggleMinimized} />\n  ) : (\n    <StatusBadge onExpand={toggleMinimized} pageLoadTimeReport={pageLoadTimeReport} />\n  );\n\n  return <Suspense fallback={null}>{result}</Suspense>;\n};\n"]}
+{"version":3,"file":"Overlay.js","sourceRoot":"","sources":["../../../src/components/Overlay/Overlay.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAClE,OAAO,EAAE,uBAAuB,EAAE,MAAM,wCAAwC,CAAC;AAGjF,MAAM,YAAY,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,iCAAiC,CAAC,CAAC,CAAC;AAC3E,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,+BAA+B,CAAC,CAAC,CAAC;AAExE,MAAM,CAAC,MAAM,OAAO,GAAsB,GAAG,EAAE;IAC7C,MAAM,kBAAkB,GAAG,uBAAuB,EAAE,CAAC;IACrD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IACjE,MAAM,KAAK,GAAG,YAAY,EAAE,CAAC;IAC7B,MAAM,SAAS,GAAG,MAAM,EAAyB,CAAC;IAClD,MAAM,EAAE,WAAW,EAAE,GAAG,cAAc,EAAE,CAAC;IAEzC,yDAAyD;IACzD,4CAA4C;IAC5C,SAAS,CAAC,GAAG,EAAE;QACb,IACE,CAAC,YAAY;YACb,SAAS,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM;YACpC,KAAK,CAAC,MAAM,KAAK,MAAM;YACvB,CAAC,SAAS,CAAC,OAAO,EAAE,WAAW,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,WAAW,IAAI,CAAC,CAAC,EAClE,CAAC;YACD,eAAe,CAAC,IAAI,CAAC,CAAC;QACxB,CAAC;QACD,SAAS,CAAC,OAAO,GAAG,KAAK,CAAC;IAC5B,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;IAE1B,MAAM,MAAM,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,CAClC,KAAC,WAAW,IAAC,WAAW,EAAE,WAAW,GAAI,CAC1C,CAAC,CAAC,CAAC,CACF,8BACG,YAAY,IAAI,KAAC,YAAY,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,KAAK,CAAC,GAAI,EACxE,KAAC,WAAW,IAAC,YAAY,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,kBAAkB,EAAE,kBAAkB,GAAI,IACjG,CACJ,CAAC;IAEF,OAAO,KAAC,QAAQ,IAAC,QAAQ,EAAE,IAAI,YAAG,MAAM,GAAY,CAAC;AACvD,CAAC,CAAC","sourcesContent":["import type { FunctionComponent } from 'preact';\nimport { lazy, Suspense } from 'preact/compat';\nimport { useState, useRef, useEffect } from 'preact/hooks';\nimport { StatusBadge } from '../StatusBadge/StatusBadge.js';\nimport { useTaskStats } from '../CloudpackProvider/useTaskStats.js';\nimport { useErrorEvents } from '../ErrorDialog/useErrorEvents.js';\nimport { usePageLoadTimeReporter } from '../../hooks/usePageLoadTimeReporter.js';\nimport type { TaskStats } from '@ms-cloudpack/api-server/browser';\n\nconst StatusDialog = lazy(() => import('../StatusDialog/StatusDialog.js'));\nconst ErrorDialog = lazy(() => import('../ErrorDialog/ErrorDialog.js'));\n\nexport const Overlay: FunctionComponent = () => {\n  const pageLoadTimeReport = usePageLoadTimeReporter();\n  const [isDialogOpen, setIsDialogOpen] = useState<boolean>(false);\n  const stats = useTaskStats();\n  const prevStats = useRef<TaskStats | undefined>();\n  const { unsupported } = useErrorEvents();\n\n  // If we haven't set a specific state and we become idle,\n  // pop open the details if there are errors.\n  useEffect(() => {\n    if (\n      !isDialogOpen &&\n      prevStats.current?.status !== 'idle' &&\n      stats.status === 'idle' &&\n      (prevStats.current?.totalErrors || 0) !== (stats.totalErrors || 0)\n    ) {\n      setIsDialogOpen(true);\n    }\n    prevStats.current = stats;\n  }, [stats, isDialogOpen]);\n\n  const result = unsupported.length ? (\n    <ErrorDialog unsupported={unsupported} />\n  ) : (\n    <>\n      {isDialogOpen && <StatusDialog onClose={() => setIsDialogOpen(false)} />}\n      <StatusBadge onOpenDialog={() => setIsDialogOpen(true)} pageLoadTimeReport={pageLoadTimeReport} />\n    </>\n  );\n\n  return <Suspense fallback={null}>{result}</Suspense>;\n};\n"]}

package/lib/components/StatusBadge/StatusBadge.d.ts

@@ -1,7 +1,8 @@
 import type { FunctionComponent } from 'preact';
 import type { PageLoadTimeReport } from '../../hooks/usePageLoadTimeReporter.js';
 export interface StatusBadgeProps {
-    onExpand: () => void;
+    /** Callback when the dialog is opened */
+    onOpenDialog: () => void;
     pageLoadTimeReport: PageLoadTimeReport;
 }
 export declare const StatusBadge: FunctionComponent<StatusBadgeProps>;

package/lib/components/StatusBadge/StatusBadge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StatusBadge.d.ts","sourceRoot":"","sources":["../../../src/components/StatusBadge/StatusBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAQhD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAGjF,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,kBAAkB,EAAE,kBAAkB,CAAC;CACxC;AAQD,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,CAgE3D,CAAC"}
+{"version":3,"file":"StatusBadge.d.ts","sourceRoot":"","sources":["../../../src/components/StatusBadge/StatusBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAQhD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAGjF,MAAM,WAAW,gBAAgB;IAC/B,yCAAyC;IACzC,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,kBAAkB,EAAE,kBAAkB,CAAC;CACxC;AAQD,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,CAwE3D,CAAC"}

package/lib/components/StatusBadge/StatusBadge.js

@@ -11,23 +11,25 @@ const leftChevron = '\u00AB';
 const rightChevron = '\u00BB';
 const buttonHint = '(see details)';
 const buttonHelp = 'Show bundle result details';
-export const StatusBadge = ({ onExpand, pageLoadTimeReport }) => {
-    const rootElementRef = useRef(null);
-    const dragElementRef = useRef(null);
+export const StatusBadge = ({ onOpenDialog, pageLoadTimeReport }) => {
+    const badgeRootRef = useRef(null);
+    const gripRef = useRef(null);
     const stats = useTaskStats();
-    const [isCollapsed, setIsCollapsed] = useState(!!localStorage.getItem(badgeStatusKey));
+    const [isBadgeCollapsed, setIsBadgeCollapsed] = useState(!!localStorage.getItem(badgeStatusKey));
     const shouldRender = stats.status !== 'unknown';
-    const toggleBadgeVisibility = useCallback(() => {
-        const newCollapsedState = !isCollapsed;
-        setIsCollapsed(newCollapsedState);
-        localStorage.setItem(badgeStatusKey, newCollapsedState ? 'collapsed' : '');
-    }, [isCollapsed]);
+    const toggleBadgeCollapsed = useCallback(() => {
+        setIsBadgeCollapsed((prev) => {
+            const newCollapsedState = !prev;
+            localStorage.setItem(badgeStatusKey, newCollapsedState ? 'collapsed' : '');
+            return newCollapsedState;
+        });
+    }, []);
     useDraggable({
         // If we're not yet able to render, don't enable dragging yet.
         // Otherwise the event handlers won't be attached when the component renders.
         enabled: shouldRender,
-        containerElementRef: rootElementRef,
-        dragElementRef,
+        containerElementRef: badgeRootRef,
+        dragElementRef: gripRef,
     });
     if (!shouldRender) {
         return null;
@@ -37,8 +39,8 @@ export const StatusBadge = ({ onExpand, pageLoadTimeReport }) => {
     // apps/test-start-e2e/src/utilities/verifyOverlay.ts
     const buttonText = 'Cloudpack: ' + buttonStatusText;
     const buttonAriaLabel = `${buttonText.replace(buttonHint, '')}. ${buttonHelp}`;
-    const collapseButtonText = isCollapsed ? 'Expand Cloudpack badge' : 'Collapse';
-    const badge = (_jsxs("div", { id: elementIds.statusBadgeRoot, ref: rootElementRef, class: cx(styles.badge, isCollapsed && styles.collapsed, statusClass), children: [_jsxs("div", { ref: dragElementRef, class: styles.gripArea, "aria-hidden": true, children: [_jsx("div", { class: styles.grip }), _jsx("div", { class: styles.grip })] }), _jsx(Button, { variant: "custom", class: styles.button, onClick: onExpand, title: buttonHelp, "aria-label": buttonAriaLabel, children: _jsx("div", { class: styles.buttonText, children: buttonText }) }), _jsx("div", { children: statsText }), _jsx(Button, { variant: "custom", class: cx(styles.button, styles.chevron), onClick: toggleBadgeVisibility, title: collapseButtonText, "aria-label": collapseButtonText, children: isCollapsed ? leftChevron : rightChevron })] }));
+    const collapseButtonText = isBadgeCollapsed ? 'Expand Cloudpack badge' : 'Collapse';
+    const badge = (_jsxs("div", { id: elementIds.statusBadgeRoot, ref: badgeRootRef, class: cx(styles.badge, isBadgeCollapsed && styles.collapsed, statusClass), children: [_jsxs("div", { ref: gripRef, class: styles.gripArea, "aria-hidden": true, children: [_jsx("div", { class: styles.grip }), _jsx("div", { class: styles.grip })] }), _jsx(Button, { variant: "custom", class: styles.button, onClick: onOpenDialog, title: buttonHelp, "aria-label": buttonAriaLabel, children: _jsx("div", { class: styles.buttonText, children: buttonText }) }), _jsx("div", { children: statsText }), _jsx(Button, { variant: "custom", class: cx(styles.button, styles.chevron), onClick: toggleBadgeCollapsed, title: collapseButtonText, "aria-label": collapseButtonText, children: isBadgeCollapsed ? leftChevron : rightChevron })] }));
     return (_jsx("div", { class: styles.fixedOverlay, children: _jsx("div", { class: styles.contentSurface, children: badge }) }));
 };
 /**

package/lib/components/StatusBadge/StatusBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusBadge.js","sourceRoot":"","sources":["../../../src/components/StatusBadge/StatusBadge.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { FunctionComponent } from 'preact';\nimport { useCallback, useRef, useState } from 'preact/hooks';\nimport { useDraggable } from '../../hooks/useDraggable.js';\nimport styles from './StatusBadge.module.css';\nimport cx from 'classnames';\nimport { Button } from '../Button/Button.js';\nimport { useTaskStats } from '../CloudpackProvider/useTaskStats.js';\nimport { elementIds } from '../../constants.js';\nimport type { PageLoadTimeReport } from '../../hooks/usePageLoadTimeReporter.js';\nimport type { TaskStats } from '@ms-cloudpack/api-server/browser';\n\nexport interface StatusBadgeProps {\n  onExpand: () => void;\n  pageLoadTimeReport: PageLoadTimeReport;\n}\n\nconst badgeStatusKey = 'cloudpack.badgeStatus';\nconst leftChevron = '\\u00AB';\nconst rightChevron = '\\u00BB';\nconst buttonHint = '(see details)';\nconst buttonHelp = 'Show bundle result details';\n\nexport const StatusBadge: FunctionComponent<StatusBadgeProps> = ({ onExpand, pageLoadTimeReport }) => {\n  const rootElementRef = useRef<HTMLDivElement>(null);\n  const dragElementRef = useRef<HTMLDivElement>(null);\n  const stats = useTaskStats();\n  const [isCollapsed, setIsCollapsed] = useState<boolean>(!!localStorage.getItem(badgeStatusKey));\n\n  const shouldRender = stats.status !== 'unknown';\n\n  const toggleBadgeVisibility = useCallback(() => {\n    const newCollapsedState = !isCollapsed;\n    setIsCollapsed(newCollapsedState);\n    localStorage.setItem(badgeStatusKey, newCollapsedState ? 'collapsed' : '');\n  }, [isCollapsed]);\n\n  useDraggable({\n    // If we're not yet able to render, don't enable dragging yet.\n    // Otherwise the event handlers won't be attached when the component renders.\n    enabled: shouldRender,\n    containerElementRef: rootElementRef,\n    dragElementRef,\n  });\n\n  if (!shouldRender) {\n    return null;\n  }\n\n  const { buttonStatusText, statusClass, statsText } = processStats(stats, pageLoadTimeReport);\n  // WARNING: If you change this text, also update the `name` used to find the button in\n  // apps/test-start-e2e/src/utilities/verifyOverlay.ts\n  const buttonText = 'Cloudpack: ' + buttonStatusText;\n  const buttonAriaLabel = `${buttonText.replace(buttonHint, '')}. ${buttonHelp}`;\n  const collapseButtonText = isCollapsed ? 'Expand Cloudpack badge' : 'Collapse';\n\n  const badge = (\n    <div\n      id={elementIds.statusBadgeRoot}\n      ref={rootElementRef}\n      class={cx(styles.badge, isCollapsed && styles.collapsed, statusClass)}\n    >\n      <div ref={dragElementRef} class={styles.gripArea} aria-hidden>\n        <div class={styles.grip} />\n        <div class={styles.grip} />\n      </div>\n      <Button variant=\"custom\" class={styles.button} onClick={onExpand} title={buttonHelp} aria-label={buttonAriaLabel}>\n        <div class={styles.buttonText}>{buttonText}</div>\n      </Button>\n      <div>{statsText}</div>\n      <Button\n        variant=\"custom\"\n        class={cx(styles.button, styles.chevron)}\n        onClick={toggleBadgeVisibility}\n        title={collapseButtonText}\n        aria-label={collapseButtonText}\n      >\n        {isCollapsed ? leftChevron : rightChevron}\n      </Button>\n    </div>\n  );\n\n  return (\n    <div class={styles.fixedOverlay}>\n      <div class={styles.contentSurface}>{badge}</div>\n    </div>\n  );\n};\n\n/**\n * Based on the status, get the badge color, button text, and stats text.\n */\nfunction processStats(\n  stats: TaskStats,\n  pltReport: PageLoadTimeReport,\n): {\n  /** class (color) for the badge root */\n  statusClass: string | undefined;\n  /** short status text for the button to open the overlay */\n  buttonStatusText: string;\n  /** stats to display after the button, like \"50% completed, 2 errors, 3 warnings in 500ms\" */\n  statsText: string;\n} {\n  const { status, totalTasks, remainingTasks, totalErrors, totalWarnings } = stats;\n\n  let statusClass: string | undefined;\n  let buttonStatusText: string;\n  let statsText = '';\n\n  if (status === 'idle' && totalTasks) {\n    [statusClass, buttonStatusText] = totalErrors\n      ? [styles.error, `errors ${buttonHint}`]\n      : totalWarnings\n        ? [styles.warning, `warnings ${buttonHint}`]\n        : [styles.success, 'success'];\n  } else {\n    // no styling for this case\n    buttonStatusText = status === 'pending' ? 'bundling...' : 'idle';\n  }\n\n  if (totalTasks) {\n    // \"Number of tasks\" is likely not a meaningful metric for users (and doesn't strictly correspond to\n    // number of packages), so just show either estimated percentage or \"completed\" plus any issue counts.\n    const taskStats = [\n      remainingTasks === 0\n        ? 'completed'\n        : `${(((totalTasks - remainingTasks) / totalTasks) * 100).toFixed(1)}% completed`,\n      totalErrors && `${totalErrors} error${totalErrors > 1 ? 's' : ''}`,\n      totalWarnings && `${totalWarnings} warning${totalWarnings > 1 ? 's' : ''}`,\n    ]\n      .filter(Boolean)\n      .join(', ');\n\n    const pltStat = pltReport.status === 'success' ? ` in ${Math.round(pltReport.pageLoadTime) ?? '??'}ms` : '';\n\n    statsText = taskStats + pltStat;\n  }\n\n  return { statusClass, buttonStatusText, statsText };\n}\n"]}
+{"version":3,"file":"StatusBadge.js","sourceRoot":"","sources":["../../../src/components/StatusBadge/StatusBadge.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { FunctionComponent } from 'preact';\nimport { useCallback, useRef, useState } from 'preact/hooks';\nimport { useDraggable } from '../../hooks/useDraggable.js';\nimport styles from './StatusBadge.module.css';\nimport cx from 'classnames';\nimport { Button } from '../Button/Button.js';\nimport { useTaskStats } from '../CloudpackProvider/useTaskStats.js';\nimport { elementIds } from '../../constants.js';\nimport type { PageLoadTimeReport } from '../../hooks/usePageLoadTimeReporter.js';\nimport type { TaskStats } from '@ms-cloudpack/api-server/browser';\n\nexport interface StatusBadgeProps {\n  /** Callback when the dialog is opened */\n  onOpenDialog: () => void;\n  pageLoadTimeReport: PageLoadTimeReport;\n}\n\nconst badgeStatusKey = 'cloudpack.badgeStatus';\nconst leftChevron = '\\u00AB';\nconst rightChevron = '\\u00BB';\nconst buttonHint = '(see details)';\nconst buttonHelp = 'Show bundle result details';\n\nexport const StatusBadge: FunctionComponent<StatusBadgeProps> = ({ onOpenDialog, pageLoadTimeReport }) => {\n  const badgeRootRef = useRef<HTMLDivElement>(null);\n  const gripRef = useRef<HTMLDivElement>(null);\n  const stats = useTaskStats();\n  const [isBadgeCollapsed, setIsBadgeCollapsed] = useState<boolean>(!!localStorage.getItem(badgeStatusKey));\n\n  const shouldRender = stats.status !== 'unknown';\n\n  const toggleBadgeCollapsed = useCallback(() => {\n    setIsBadgeCollapsed((prev) => {\n      const newCollapsedState = !prev;\n      localStorage.setItem(badgeStatusKey, newCollapsedState ? 'collapsed' : '');\n      return newCollapsedState;\n    });\n  }, []);\n\n  useDraggable({\n    // If we're not yet able to render, don't enable dragging yet.\n    // Otherwise the event handlers won't be attached when the component renders.\n    enabled: shouldRender,\n    containerElementRef: badgeRootRef,\n    dragElementRef: gripRef,\n  });\n\n  if (!shouldRender) {\n    return null;\n  }\n\n  const { buttonStatusText, statusClass, statsText } = processStats(stats, pageLoadTimeReport);\n  // WARNING: If you change this text, also update the `name` used to find the button in\n  // apps/test-start-e2e/src/utilities/verifyOverlay.ts\n  const buttonText = 'Cloudpack: ' + buttonStatusText;\n  const buttonAriaLabel = `${buttonText.replace(buttonHint, '')}. ${buttonHelp}`;\n  const collapseButtonText = isBadgeCollapsed ? 'Expand Cloudpack badge' : 'Collapse';\n\n  const badge = (\n    <div\n      id={elementIds.statusBadgeRoot}\n      ref={badgeRootRef}\n      class={cx(styles.badge, isBadgeCollapsed && styles.collapsed, statusClass)}\n    >\n      <div ref={gripRef} class={styles.gripArea} aria-hidden>\n        <div class={styles.grip} />\n        <div class={styles.grip} />\n      </div>\n      <Button\n        variant=\"custom\"\n        class={styles.button}\n        onClick={onOpenDialog}\n        title={buttonHelp}\n        aria-label={buttonAriaLabel}\n      >\n        <div class={styles.buttonText}>{buttonText}</div>\n      </Button>\n      <div>{statsText}</div>\n      <Button\n        variant=\"custom\"\n        class={cx(styles.button, styles.chevron)}\n        onClick={toggleBadgeCollapsed}\n        title={collapseButtonText}\n        aria-label={collapseButtonText}\n      >\n        {isBadgeCollapsed ? leftChevron : rightChevron}\n      </Button>\n    </div>\n  );\n\n  return (\n    <div class={styles.fixedOverlay}>\n      <div class={styles.contentSurface}>{badge}</div>\n    </div>\n  );\n};\n\n/**\n * Based on the status, get the badge color, button text, and stats text.\n */\nfunction processStats(\n  stats: TaskStats,\n  pltReport: PageLoadTimeReport,\n): {\n  /** class (color) for the badge root */\n  statusClass: string | undefined;\n  /** short status text for the button to open the overlay */\n  buttonStatusText: string;\n  /** stats to display after the button, like \"50% completed, 2 errors, 3 warnings in 500ms\" */\n  statsText: string;\n} {\n  const { status, totalTasks, remainingTasks, totalErrors, totalWarnings } = stats;\n\n  let statusClass: string | undefined;\n  let buttonStatusText: string;\n  let statsText = '';\n\n  if (status === 'idle' && totalTasks) {\n    [statusClass, buttonStatusText] = totalErrors\n      ? [styles.error, `errors ${buttonHint}`]\n      : totalWarnings\n        ? [styles.warning, `warnings ${buttonHint}`]\n        : [styles.success, 'success'];\n  } else {\n    // no styling for this case\n    buttonStatusText = status === 'pending' ? 'bundling...' : 'idle';\n  }\n\n  if (totalTasks) {\n    // \"Number of tasks\" is likely not a meaningful metric for users (and doesn't strictly correspond to\n    // number of packages), so just show either estimated percentage or \"completed\" plus any issue counts.\n    const taskStats = [\n      remainingTasks === 0\n        ? 'completed'\n        : `${(((totalTasks - remainingTasks) / totalTasks) * 100).toFixed(1)}% completed`,\n      totalErrors && `${totalErrors} error${totalErrors > 1 ? 's' : ''}`,\n      totalWarnings && `${totalWarnings} warning${totalWarnings > 1 ? 's' : ''}`,\n    ]\n      .filter(Boolean)\n      .join(', ');\n\n    const pltStat = pltReport.status === 'success' ? ` in ${Math.round(pltReport.pageLoadTime) ?? '??'}ms` : '';\n\n    statsText = taskStats + pltStat;\n  }\n\n  return { statusClass, buttonStatusText, statsText };\n}\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"StatusDialog.d.ts","sourceRoot":"","sources":["../../../src/components/StatusDialog/StatusDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAShD,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CAkC7D,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"StatusDialog.d.ts","sourceRoot":"","sources":["../../../src/components/StatusDialog/StatusDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAShD,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CA0C7D,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/components/StatusDialog/StatusDialog.js

@@ -10,13 +10,17 @@ export const StatusDialog = ({ onClose }) => {
     const cloudpack = useCloudpack();
     const [searchFilter, setSearchFilter] = useState('');
     const [issuesOnly, setIssuesOnly] = useState(false);
+    const [isRestarting, setIsRestarting] = useState(false);
     const handleSearchChange = useCallback((event) => {
         event.preventDefault();
         setSearchFilter(event.target.value);
     }, []);
-    const restartAllTasks = () => void cloudpack.restartAllTasks.mutate();
+    const restartAllTasks = () => {
+        setIsRestarting(true);
+        void cloudpack.restartAllTasks.mutate();
+    };
     const toggleIssuesOnly = () => void setIssuesOnly((value) => !value);
-    return (_jsx(Dialog, { title: "Cloudpack bundle results", id: elementIds.statusDialogRoot, draggable: true, onClose: onClose, commands: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "primary", iconName: "refresh", onClick: restartAllTasks, children: "Re-bundle all packages" }), _jsx(Button, { onClick: toggleIssuesOnly, children: issuesOnly ? 'Show all packages' : 'Show packages with issues' }), _jsx(Searchbox, { value: searchFilter, onInput: handleSearchChange, style: { marginLeft: 'auto' } })] }), children: _jsx(TaskList, { searchFilter: searchFilter, issuesOnly: issuesOnly }) }));
+    return (_jsx(Dialog, { title: "Cloudpack bundle results", id: elementIds.statusDialogRoot, draggable: true, onClose: onClose, commands: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "primary", iconName: "refresh", onClick: restartAllTasks, disabled: isRestarting, children: "Re-bundle all packages" }), _jsx(Button, { onClick: toggleIssuesOnly, children: issuesOnly ? 'Show all packages' : 'Show packages with issues' }), _jsx(Searchbox, { value: searchFilter, onInput: handleSearchChange, style: { marginLeft: 'auto' } })] }), children: _jsx(TaskList, { searchFilter: searchFilter, issuesOnly: issuesOnly }) }));
 };
 export default StatusDialog;
 //# 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":";AACA,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACrD,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;AAC7C,OAAO,EAAE,SAAS,EAAuB,MAAM,gBAAgB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAMhD,MAAM,CAAC,MAAM,YAAY,GAAyC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;IAChF,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;IACjC,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACrD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpD,MAAM,kBAAkB,GAAG,WAAW,CAA4B,CAAC,KAAK,EAAE,EAAE;QAC1E,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,eAAe,CAAE,KAAK,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAC;IAC5D,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,eAAe,GAAG,GAAG,EAAE,CAAC,KAAK,SAAS,CAAC,eAAe,CAAC,MAAM,EAAE,CAAC;IAEtE,MAAM,gBAAgB,GAAG,GAAG,EAAE,CAAC,KAAK,aAAa,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC;IAErE,OAAO,CACL,KAAC,MAAM,IACL,KAAK,EAAC,0BAA0B,EAChC,EAAE,EAAE,UAAU,CAAC,gBAAgB,EAC/B,SAAS,QACT,OAAO,EAAE,OAAO,EAChB,QAAQ,EACN,8BACE,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,EAAC,QAAQ,EAAC,SAAS,EAAC,OAAO,EAAE,eAAe,uCAE5D,EACT,KAAC,MAAM,IAAC,OAAO,EAAE,gBAAgB,YAAG,UAAU,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,2BAA2B,GAAU,EAE5G,KAAC,SAAS,IAAC,KAAK,EAAE,YAAY,EAAE,OAAO,EAAE,kBAAkB,EAAE,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,GAAI,IAC7F,YAGL,KAAC,QAAQ,IAAC,YAAY,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,GAAI,GACzD,CACV,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import type { FunctionComponent } from 'preact';\nimport { useCallback, useState } from 'preact/hooks';\nimport { TaskList } from './TaskList.js';\nimport { useCloudpack } from '../CloudpackProvider/CloudpackProvider.js';\nimport { Button } from '../Button/Button.js';\nimport { Dialog } from '../Dialog/Dialog.js';\nimport { Searchbox, type SearchboxProps } from './Searchbox.js';\nimport { elementIds } from '../../constants.js';\n\nexport interface StatusDialogProps {\n  onClose: () => void;\n}\n\nexport const StatusDialog: FunctionComponent<StatusDialogProps> = ({ onClose }) => {\n  const cloudpack = useCloudpack();\n  const [searchFilter, setSearchFilter] = useState('');\n  const [issuesOnly, setIssuesOnly] = useState(false);\n\n  const handleSearchChange = useCallback<SearchboxProps['onInput']>((event) => {\n    event.preventDefault();\n    setSearchFilter((event.target as HTMLInputElement).value);\n  }, []);\n\n  const restartAllTasks = () => void cloudpack.restartAllTasks.mutate();\n\n  const toggleIssuesOnly = () => void setIssuesOnly((value) => !value);\n\n  return (\n    <Dialog\n      title=\"Cloudpack bundle results\"\n      id={elementIds.statusDialogRoot}\n      draggable\n      onClose={onClose}\n      commands={\n        <>\n          <Button variant=\"primary\" iconName=\"refresh\" onClick={restartAllTasks}>\n            Re-bundle all packages\n          </Button>\n          <Button onClick={toggleIssuesOnly}>{issuesOnly ? 'Show all packages' : 'Show packages with issues'}</Button>\n          {/* Align the search box to the right */}\n          <Searchbox value={searchFilter} onInput={handleSearchChange} style={{ marginLeft: 'auto' }} />\n        </>\n      }\n    >\n      <TaskList searchFilter={searchFilter} issuesOnly={issuesOnly} />\n    </Dialog>\n  );\n};\n\nexport default StatusDialog;\n"]}
+{"version":3,"file":"StatusDialog.js","sourceRoot":"","sources":["../../../src/components/StatusDialog/StatusDialog.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACrD,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;AAC7C,OAAO,EAAE,SAAS,EAAuB,MAAM,gBAAgB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAMhD,MAAM,CAAC,MAAM,YAAY,GAAyC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;IAChF,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;IACjC,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACrD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExD,MAAM,kBAAkB,GAAG,WAAW,CAA4B,CAAC,KAAK,EAAE,EAAE;QAC1E,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,eAAe,CAAE,KAAK,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAC;IAC5D,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,eAAe,CAAC,IAAI,CAAC,CAAC;QACtB,KAAK,SAAS,CAAC,eAAe,CAAC,MAAM,EAAE,CAAC;IAC1C,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,GAAG,EAAE,CAAC,KAAK,aAAa,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC;IAErE,OAAO,CACL,KAAC,MAAM,IACL,KAAK,EAAC,0BAA0B,EAChC,EAAE,EAAE,UAAU,CAAC,gBAAgB,EAC/B,SAAS,QACT,OAAO,EAAE,OAAO,EAChB,QAAQ,EACN,8BAKE,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,EAAC,QAAQ,EAAC,SAAS,EAAC,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,YAAY,uCAEpF,EACT,KAAC,MAAM,IAAC,OAAO,EAAE,gBAAgB,YAAG,UAAU,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,2BAA2B,GAAU,EAE5G,KAAC,SAAS,IAAC,KAAK,EAAE,YAAY,EAAE,OAAO,EAAE,kBAAkB,EAAE,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,GAAI,IAC7F,YAGL,KAAC,QAAQ,IAAC,YAAY,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,GAAI,GACzD,CACV,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import type { FunctionComponent } from 'preact';\nimport { useCallback, useState } from 'preact/hooks';\nimport { TaskList } from './TaskList.js';\nimport { useCloudpack } from '../CloudpackProvider/CloudpackProvider.js';\nimport { Button } from '../Button/Button.js';\nimport { Dialog } from '../Dialog/Dialog.js';\nimport { Searchbox, type SearchboxProps } from './Searchbox.js';\nimport { elementIds } from '../../constants.js';\n\nexport interface StatusDialogProps {\n  onClose: () => void;\n}\n\nexport const StatusDialog: FunctionComponent<StatusDialogProps> = ({ onClose }) => {\n  const cloudpack = useCloudpack();\n  const [searchFilter, setSearchFilter] = useState('');\n  const [issuesOnly, setIssuesOnly] = useState(false);\n  const [isRestarting, setIsRestarting] = useState(false);\n\n  const handleSearchChange = useCallback<SearchboxProps['onInput']>((event) => {\n    event.preventDefault();\n    setSearchFilter((event.target as HTMLInputElement).value);\n  }, []);\n\n  const restartAllTasks = () => {\n    setIsRestarting(true);\n    void cloudpack.restartAllTasks.mutate();\n  };\n\n  const toggleIssuesOnly = () => void setIssuesOnly((value) => !value);\n\n  return (\n    <Dialog\n      title=\"Cloudpack bundle results\"\n      id={elementIds.statusDialogRoot}\n      draggable\n      onClose={onClose}\n      commands={\n        <>\n          {/* Disable the button after it's clicked since the operation may take awhile, and the\n              page will refresh when finished.\n              TODO: ideally we'd have a spinner while restarting (this could probably be done by\n              animating the refresh icon) */}\n          <Button variant=\"primary\" iconName=\"refresh\" onClick={restartAllTasks} disabled={isRestarting}>\n            Re-bundle all packages\n          </Button>\n          <Button onClick={toggleIssuesOnly}>{issuesOnly ? 'Show all packages' : 'Show packages with issues'}</Button>\n          {/* Align the search box to the right */}\n          <Searchbox value={searchFilter} onInput={handleSearchChange} style={{ marginLeft: 'auto' }} />\n        </>\n      }\n    >\n      <TaskList searchFilter={searchFilter} issuesOnly={issuesOnly} />\n    </Dialog>\n  );\n};\n\nexport default StatusDialog;\n"]}

package/lib/constants.d.ts

@@ -11,6 +11,10 @@ export declare const elementIds: {
      * ID for the root element of the status dialog.
      */
     readonly statusDialogRoot: "cloudpack-overlay-status-dialog";
+    /**
+     * ID for the title element of any dialog.
+     */
+    readonly dialogTitle: "cloudpack-overlay-dialog-title";
     /**
      * ID for the root element of the status badge.
      */

package/lib/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,UAAU;IACrB;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;CAEK,CAAC"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,UAAU;IACrB;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;CAEK,CAAC"}

package/lib/constants.js

@@ -13,6 +13,10 @@ export const elementIds = {
      * ID for the root element of the status dialog.
      */
     statusDialogRoot: 'cloudpack-overlay-status-dialog',
+    /**
+     * ID for the title element of any dialog.
+     */
+    dialogTitle: 'cloudpack-overlay-dialog-title',
     /**
      * ID for the root element of the status badge.
      */

package/lib/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,iGAAiG;AACjG,oBAAoB;AAEpB,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB;;OAEG;IACH,IAAI,EAAE,wBAAwB;IAC9B;;OAEG;IACH,eAAe,EAAE,gCAAgC;IACjD;;OAEG;IACH,gBAAgB,EAAE,iCAAiC;IACnD;;OAEG;IACH,eAAe,EAAE,gCAAgC;CACzC,CAAC","sourcesContent":["// This file serves as a separate entry point which can be imported without rendering the overlay\n// as a side effect.\n\nexport const elementIds = {\n  /**\n   * ID for the root element of the overlay.\n   */\n  root: 'cloudpack-overlay-root',\n  /**\n   * ID for the root element of the error dialog.\n   */\n  errorDialogRoot: 'cloudpack-overlay-error-dialog',\n  /**\n   * ID for the root element of the status dialog.\n   */\n  statusDialogRoot: 'cloudpack-overlay-status-dialog',\n  /**\n   * ID for the root element of the status badge.\n   */\n  statusBadgeRoot: 'cloudpack-overlay-status-badge',\n} as const;\n"]}
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,iGAAiG;AACjG,oBAAoB;AAEpB,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB;;OAEG;IACH,IAAI,EAAE,wBAAwB;IAC9B;;OAEG;IACH,eAAe,EAAE,gCAAgC;IACjD;;OAEG;IACH,gBAAgB,EAAE,iCAAiC;IACnD;;OAEG;IACH,WAAW,EAAE,gCAAgC;IAC7C;;OAEG;IACH,eAAe,EAAE,gCAAgC;CACzC,CAAC","sourcesContent":["// This file serves as a separate entry point which can be imported without rendering the overlay\n// as a side effect.\n\nexport const elementIds = {\n  /**\n   * ID for the root element of the overlay.\n   */\n  root: 'cloudpack-overlay-root',\n  /**\n   * ID for the root element of the error dialog.\n   */\n  errorDialogRoot: 'cloudpack-overlay-error-dialog',\n  /**\n   * ID for the root element of the status dialog.\n   */\n  statusDialogRoot: 'cloudpack-overlay-status-dialog',\n  /**\n   * ID for the title element of any dialog.\n   */\n  dialogTitle: 'cloudpack-overlay-dialog-title',\n  /**\n   * ID for the root element of the status badge.\n   */\n  statusBadgeRoot: 'cloudpack-overlay-status-badge',\n} as const;\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ms-cloudpack/overlay",
-  "version": "0.19.7",
+  "version": "0.19.9",
   "description": "The Cloudpack overlay ux.",
   "license": "MIT",
   "types": "./lib/index.d.ts",
@@ -29,14 +29,16 @@
     "prepack": "cp .npmignore dist/.npmignore"
   },
   "devDependencies": {
-    "@ms-cloudpack/api-server": "^0.63.9",
+    "@ms-cloudpack/api-server": "^0.63.11",
     "@ms-cloudpack/common-types": "^0.24.20",
     "@ms-cloudpack/common-types-browser": "^0.6.1",
     "@ms-cloudpack/eslint-plugin-internal": "^0.0.1",
     "@ms-cloudpack/path-string-parsing": "^1.2.7",
     "@ms-cloudpack/scripts": "^0.0.1",
     "classnames": "^2.5.1",
-    "preact": "^10.26.8"
+    "preact": "^10.26.8",
+    "react": "npm:@preact/compat@^18.0.0",
+    "react-focus-on": "^3.10.0"
   },
   "files": [
     "lib/**/!(*.test.*)",

package/dist/browser-esm/598.chunk.js

@@ -1,2 +0,0 @@
-export const __webpack_id__=598;export const __webpack_ids__=[598];export const __webpack_modules__={64:(n,e,A)=>{A.d(e,{default:()=>o});var t=A(25),a=A.n(t),i=A(191),r=A.n(i)()(a());r.push([n.id,".XGfokeIdlhljyLrJoTUw {\n  border: 1px solid var(--cp-borderSubtle);\n  border-radius: 3px;\n  box-shadow: 0 0 12px -6px rgba(0, 0, 0, 0.25);\n}\n\n.wuGrO61h0mxJCT13pKKi {\n  /* offset the margin so this element's border overlaps the root's gray border */\n  margin: -1px;\n  /* this overlaps the parent border so there can be a hover border for the header only without jumping */\n  border: 1px solid var(--cp-borderSubtle);\n  border-radius: 3px;\n  background: var(--cp-neutralLighter);\n  padding: 0;\n  display: flex;\n  align-items: center;\n  line-height: 1;\n}\n.wuGrO61h0mxJCT13pKKi:hover {\n  border-color: black;\n}\n.wuGrO61h0mxJCT13pKKi.xUYhCGbIYOflP2MeZWAZ {\n  /* change the margin-bottom when expanded so the border still shows up */\n  margin-bottom: 0;\n}\n.wuGrO61h0mxJCT13pKKi.tYu_98mP3NNuncdgfx2e {\n  background: var(--cp-errorLight);\n}\n.wuGrO61h0mxJCT13pKKi.sn79vVqYMTENjCFDp9o2 {\n  background: var(--cp-successLight);\n}\n.wuGrO61h0mxJCT13pKKi.uBvWcRQWreqOQcQx11QC {\n  background: var(--cp-warningLight);\n}\n\nh3.kGHJtSdatcFi9k0NuFhK {\n  /* Ignore this element for flexbox layout purposes (children act as if they're directly under parent) */\n  display: contents;\n  margin: 0;\n  padding: 0;\n}\n\n/* Unfortunately the button can't use display: contents due to browser bugs that would make it\nnot accessible with the tab key */\nbutton.DPU_BgMDvX9c3bs_hgJf {\n  width: 100%;\n  margin: 0;\n  /* Set padding on the button so it's included in the click target */\n  padding: 8px 16px;\n  border: none;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n/* The chevron icon is 20x20. We want it to take up a 32x32 area. */\n.jZlxmg1VmtWr__jzMk1T {\n  width: 20px;\n  height: 20px;\n  padding: 6px;\n  transition: transform 0.1s ease-in-out;\n}\n\n.jZlxmg1VmtWr__jzMk1T.YFo31CeXA_PU_CMg_zld {\n  padding-top: 8px;\n  padding-bottom: 4px;\n  transform: rotate(-90deg);\n}\n\n.cUZadJUKd9B70qLziRSU {\n  /* this makes it right-aligned */\n  margin-left: auto;\n  font-size: 13px;\n  font-weight: 400;\n  text-align: end;\n}\n\n._LelyTIepA5pC2N_dHW2 {\n  margin-right: 16px;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  justify-content: end;\n}\n\n.ERmJeA26FxA8sETCCLQS {\n  font-size: 16px;\n  font-weight: 500;\n  color: var(--cp-neutralPrimary);\n  /* in case it's applied directly to a h* element */\n  margin: 0;\n  padding: 0;\n}\n\n.QUAuafbYFPvmVwOUOqYN {\n  display: none;\n}\n\n.xPBZFnKM72fLspTwq_5u {\n  background: var(--cp-neutralLighterAlt);\n  /* 24px optically aligns with the icons in the header */\n  padding: 16px 24px;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  /* Increase line-height so it's easier to read */\n  line-height: 1.2em;\n}\n.xPBZFnKM72fLspTwq_5u li {\n  margin: 3px 0;\n}\n.xPBZFnKM72fLspTwq_5u p {\n  margin: 0;\n}\n.xPBZFnKM72fLspTwq_5u p + p {\n  margin-top: 8px;\n}\n\n.MP8Xx_w4X_xqx1QcYVfk {\n  font-size: 12px;\n  font-weight: 600;\n  text-transform: uppercase;\n  padding-bottom: 2px;\n}\n\n.bS0g8MYKC82hwEKmB69Q {\n  font-size: 14px;\n}\n","",{version:3,sources:["webpack://./src/components/ResultsAccordion/ResultsAccordion.module.css"],names:[],mappings:"AAAA;EACE,wCAAwC;EACxC,kBAAkB;EAClB,6CAA6C;AAC/C;;AAEA;EACE,+EAA+E;EAC/E,YAAY;EACZ,uGAAuG;EACvG,wCAAwC;EACxC,kBAAkB;EAClB,oCAAoC;EACpC,UAAU;EACV,aAAa;EACb,mBAAmB;EACnB,cAAc;AAChB;AACA;EACE,mBAAmB;AACrB;AACA;EACE,wEAAwE;EACxE,gBAAgB;AAClB;AACA;EACE,gCAAgC;AAClC;AACA;EACE,kCAAkC;AACpC;AACA;EACE,kCAAkC;AACpC;;AAEA;EACE,uGAAuG;EACvG,iBAAiB;EACjB,SAAS;EACT,UAAU;AACZ;;AAEA;iCACiC;AACjC;EACE,WAAW;EACX,SAAS;EACT,mEAAmE;EACnE,iBAAiB;EACjB,YAAY;EACZ,aAAa;EACb,mBAAmB;EACnB,QAAQ;AACV;;AAEA,mEAAmE;AACnE;EACE,WAAW;EACX,YAAY;EACZ,YAAY;EACZ,sCAAsC;AACxC;;AAEA;EACE,gBAAgB;EAChB,mBAAmB;EACnB,yBAAyB;AAC3B;;AAEA;EACE,gCAAgC;EAChC,iBAAiB;EACjB,eAAe;EACf,gBAAgB;EAChB,eAAe;AACjB;;AAEA;EACE,kBAAkB;EAClB,aAAa;EACb,mBAAmB;EACnB,QAAQ;EACR,oBAAoB;AACtB;;AAEA;EACE,eAAe;EACf,gBAAgB;EAChB,+BAA+B;EAC/B,kDAAkD;EAClD,SAAS;EACT,UAAU;AACZ;;AAEA;EACE,aAAa;AACf;;AAEA;EACE,uCAAuC;EACvC,uDAAuD;EACvD,kBAAkB;EAClB,aAAa;EACb,sBAAsB;EACtB,SAAS;EACT,gDAAgD;EAChD,kBAAkB;AACpB;AACA;EACE,aAAa;AACf;AACA;EACE,SAAS;AACX;AACA;EACE,eAAe;AACjB;;AAEA;EACE,eAAe;EACf,gBAAgB;EAChB,yBAAyB;EACzB,mBAAmB;AACrB;;AAEA;EACE,eAAe;AACjB",sourcesContent:[".root {\n  border: 1px solid var(--cp-borderSubtle);\n  border-radius: 3px;\n  box-shadow: 0 0 12px -6px rgba(0, 0, 0, 0.25);\n}\n\n.header {\n  /* offset the margin so this element's border overlaps the root's gray border */\n  margin: -1px;\n  /* this overlaps the parent border so there can be a hover border for the header only without jumping */\n  border: 1px solid var(--cp-borderSubtle);\n  border-radius: 3px;\n  background: var(--cp-neutralLighter);\n  padding: 0;\n  display: flex;\n  align-items: center;\n  line-height: 1;\n}\n.header:hover {\n  border-color: black;\n}\n.header.expanded {\n  /* change the margin-bottom when expanded so the border still shows up */\n  margin-bottom: 0;\n}\n.header.error {\n  background: var(--cp-errorLight);\n}\n.header.success {\n  background: var(--cp-successLight);\n}\n.header.warning {\n  background: var(--cp-warningLight);\n}\n\nh3.headerButtonWrapper {\n  /* Ignore this element for flexbox layout purposes (children act as if they're directly under parent) */\n  display: contents;\n  margin: 0;\n  padding: 0;\n}\n\n/* Unfortunately the button can't use display: contents due to browser bugs that would make it\nnot accessible with the tab key */\nbutton.headerButton {\n  width: 100%;\n  margin: 0;\n  /* Set padding on the button so it's included in the click target */\n  padding: 8px 16px;\n  border: none;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n/* The chevron icon is 20x20. We want it to take up a 32x32 area. */\n.expandIcon {\n  width: 20px;\n  height: 20px;\n  padding: 6px;\n  transition: transform 0.1s ease-in-out;\n}\n\n.expandIcon.collapsed {\n  padding-top: 8px;\n  padding-bottom: 4px;\n  transform: rotate(-90deg);\n}\n\n.headerEnd {\n  /* this makes it right-aligned */\n  margin-left: auto;\n  font-size: 13px;\n  font-weight: 400;\n  text-align: end;\n}\n\n.headerCommands {\n  margin-right: 16px;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  justify-content: end;\n}\n\n.title {\n  font-size: 16px;\n  font-weight: 500;\n  color: var(--cp-neutralPrimary);\n  /* in case it's applied directly to a h* element */\n  margin: 0;\n  padding: 0;\n}\n\n.contentHidden {\n  display: none;\n}\n\n.content {\n  background: var(--cp-neutralLighterAlt);\n  /* 24px optically aligns with the icons in the header */\n  padding: 16px 24px;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  /* Increase line-height so it's easier to read */\n  line-height: 1.2em;\n}\n.content li {\n  margin: 3px 0;\n}\n.content p {\n  margin: 0;\n}\n.content p + p {\n  margin-top: 8px;\n}\n\n.itemName {\n  font-size: 12px;\n  font-weight: 600;\n  text-transform: uppercase;\n  padding-bottom: 2px;\n}\n\n.itemValue {\n  font-size: 14px;\n}\n"],sourceRoot:""}]),r.locals={root:"XGfokeIdlhljyLrJoTUw",header:"wuGrO61h0mxJCT13pKKi",expanded:"xUYhCGbIYOflP2MeZWAZ",error:"tYu_98mP3NNuncdgfx2e",success:"sn79vVqYMTENjCFDp9o2",warning:"uBvWcRQWreqOQcQx11QC",headerButtonWrapper:"kGHJtSdatcFi9k0NuFhK",headerButton:"DPU_BgMDvX9c3bs_hgJf",expandIcon:"jZlxmg1VmtWr__jzMk1T",collapsed:"YFo31CeXA_PU_CMg_zld",headerEnd:"cUZadJUKd9B70qLziRSU",headerCommands:"_LelyTIepA5pC2N_dHW2",title:"ERmJeA26FxA8sETCCLQS",contentHidden:"QUAuafbYFPvmVwOUOqYN",content:"xPBZFnKM72fLspTwq_5u",itemName:"MP8Xx_w4X_xqx1QcYVfk",itemValue:"bS0g8MYKC82hwEKmB69Q"};const o=r},475:(n,e,A)=>{A.d(e,{Dialog:()=>j});var t=A(821),a=A(104),i=A.n(a),r=A(790),o=A(606),s=A.n(o),d=A(607),g=A.n(d),l=A(437),c=A.n(l),C=A(750),p=A.n(C),x=A(994),M=A.n(x),E=A(415),u=A.n(E),h=A(564),m={};m.styleTagTransform=u(),m.setAttributes=p(),m.insert=c().bind(null,"head"),m.domAPI=g(),m.insertStyleElement=M(),s()(h.default,m);const D=h.default&&h.default.locals?h.default.locals:void 0;var N=A(658),I=A(91);const j=n=>{const{title:e,id:A,style:a,draggable:o,onClose:s,commands:d,children:g}=n,l=(0,r.useRef)(null),c=(0,r.useRef)(null);return(0,N.useDraggable)({enabled:!!o,containerElementRef:l,dragElementRef:c}),(0,t.jsx)("div",{id:A,class:D.overlay,children:(0,t.jsxs)("div",{ref:l,class:i()(D.dialog,"error"===a&&D.error),children:[(0,t.jsxs)("div",{class:D.titleArea,children:[(0,t.jsx)("h2",{ref:c,class:i()(D.title,o&&D.draggable),children:e}),s&&(0,t.jsx)(I.Button,{variant:"iconOnly",iconName:"close",onClick:s,"aria-label":"Close"})]}),d&&(0,t.jsx)("div",{class:D.commands,children:d}),g]})})}},527:(n,e,A)=>{A.d(e,{default:()=>o});var t=A(25),a=A.n(t),i=A(191),r=A.n(i)()(a());r.push([n.id,"/* NOTE: This is also used by ErrorDialog */\n.sQBBRBwDngEVzWzI6zAo {\n  flex-grow: 1;\n  overflow: auto;\n  border-top: 1px solid var(--cp-border);\n  box-sizing: border-box;\n  padding: 16px 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n","",{version:3,sources:["webpack://./src/components/StatusDialog/TaskList.module.css"],names:[],mappings:"AAAA,2CAA2C;AAC3C;EACE,YAAY;EACZ,cAAc;EACd,sCAAsC;EACtC,sBAAsB;EACtB,kBAAkB;EAClB,aAAa;EACb,sBAAsB;EACtB,QAAQ;AACV",sourcesContent:["/* NOTE: This is also used by ErrorDialog */\n.root {\n  flex-grow: 1;\n  overflow: auto;\n  border-top: 1px solid var(--cp-border);\n  box-sizing: border-box;\n  padding: 16px 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n"],sourceRoot:""}]),r.locals={root:"sQBBRBwDngEVzWzI6zAo"};const o=r},545:(n,e,A)=>{A.d(e,{ResultsAccordion:()=>j,ResultsAccordionContent:()=>b});var t=A(821),a=A(790),i=A(104),r=A.n(i),o=A(606),s=A.n(o),d=A(607),g=A.n(d),l=A(437),c=A.n(l),C=A(750),p=A.n(C),x=A(994),M=A.n(x),E=A(415),u=A.n(E),h=A(64),m={};m.styleTagTransform=u(),m.setAttributes=p(),m.insert=c().bind(null,"head"),m.domAPI=g(),m.insertStyleElement=M(),s()(h.default,m);const D=h.default&&h.default.locals?h.default.locals:void 0;var N=A(91);const I={error:(0,t.jsx)("img",{src:"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDJDMTcuNTIyOCAyIDIyIDYuNDc3MTUgMjIgMTJDMjIgMTcuNTIyOCAxNy41MjI4IDIyIDEyIDIyQzYuNDc3MTUgMjIgMiAxNy41MjI4IDIgMTJDMiA2LjQ3NzE1IDYuNDc3MTUgMiAxMiAyWk0xNS41MzAzIDguNDY5NjdMMTUuNDQ2MiA4LjM5NzA1QzE1LjE4NTIgOC4yMDM0IDE0LjgyNyA4LjIwMTAxIDE0LjU2MzYgOC4zODk4OEwxNC40Njk3IDguNDY5NjdMMTIgMTAuOTM5TDkuNTMwMzMgOC40Njk2N0w5LjQ0NjIxIDguMzk3MDVDOS4xODUyMiA4LjIwMzQgOC44MjcwMSA4LjIwMTAxIDguNTYzNjIgOC4zODk4OEw4LjQ2OTY3IDguNDY5NjdMOC4zOTcwNSA4LjU1Mzc5QzguMjAzNCA4LjgxNDc4IDguMjAxMDEgOS4xNzI5OSA4LjM4OTg4IDkuNDM2MzhMOC40Njk2NyA5LjUzMDMzTDEwLjkzOSAxMkw4LjQ2OTY3IDE0LjQ2OTdMOC4zOTcwNSAxNC41NTM4QzguMjAzNCAxNC44MTQ4IDguMjAxMDEgMTUuMTczIDguMzg5ODggMTUuNDM2NEw4LjQ2OTY3IDE1LjUzMDNMOC41NTM3OSAxNS42MDI5QzguODE0NzggMTUuNzk2NiA5LjE3Mjk5IDE1Ljc5OSA5LjQzNjM4IDE1LjYxMDFMOS41MzAzMyAxNS41MzAzTDEyIDEzLjA2MUwxNC40Njk3IDE1LjUzMDNMMTQuNTUzOCAxNS42MDI5QzE0LjgxNDggMTUuNzk2NiAxNS4xNzMgMTUuNzk5IDE1LjQzNjQgMTUuNjEwMUwxNS41MzAzIDE1LjUzMDNMMTUuNjAyOSAxNS40NDYyQzE1Ljc5NjYgMTUuMTg1MiAxNS43OTkgMTQuODI3IDE1LjYxMDEgMTQuNTYzNkwxNS41MzAzIDE0LjQ2OTdMMTMuMDYxIDEyTDE1LjUzMDMgOS41MzAzM0wxNS42MDI5IDkuNDQ2MjFDMTUuNzk2NiA5LjE4NTIyIDE1Ljc5OSA4LjgyNzAxIDE1LjYxMDEgOC41NjM2MkwxNS41MzAzIDguNDY5NjdMMTUuNDQ2MiA4LjM5NzA1TDE1LjUzMDMgOC40Njk2N1oiIGZpbGw9IiNhNDI2MmMiLz4KPC9zdmc+Cg==",alt:"Error"}),warning:(0,t.jsx)("img",{src:"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTAuMDMgMy42NmEyLjI1IDIuMjUgMCAwIDEgMy45NCAwbDcuNzQgMTRBMi4yNSAyLjI1IDAgMCAxIDE5Ljc0IDIxSDQuMjVhMi4yNSAyLjI1IDAgMCAxLTEuOTctMy4zNGw3Ljc1LTE0Wk0xMyAxN2ExIDEgMCAxIDAtMiAwIDEgMSAwIDAgMCAyIDBabS0uMjYtNy44NWEuNzUuNzUgMCAwIDAtMS41LjF2NC41bC4wMi4xYS43NS43NSAwIDAgMCAxLjQ5LS4xdi00LjVsLS4wMS0uMVoiIGZpbGw9IiNiODg3MDAiPjwvcGF0aD48L3N2Zz4K",alt:"Warning"}),success:(0,t.jsx)("img",{src:"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDJDMTcuNTIyOCAyIDIyIDYuNDc3MTUgMjIgMTJDMjIgMTcuNTIyOCAxNy41MjI4IDIyIDEyIDIyQzYuNDc3MTUgMjIgMiAxNy41MjI4IDIgMTJDMiA2LjQ3NzE1IDYuNDc3MTUgMiAxMiAyWk0xNS4yMTk3IDguOTY5NjdMMTAuNzUgMTMuNDM5M0w4Ljc4MDMzIDExLjQ2OTdDOC40ODc0NCAxMS4xNzY4IDguMDEyNTYgMTEuMTc2OCA3LjcxOTY3IDExLjQ2OTdDNy40MjY3OCAxMS43NjI2IDcuNDI2NzggMTIuMjM3NCA3LjcxOTY3IDEyLjUzMDNMMTAuMjE5NyAxNS4wMzAzQzEwLjUxMjYgMTUuMzIzMiAxMC45ODc0IDE1LjMyMzIgMTEuMjgwMyAxNS4wMzAzTDE2LjI4MDMgMTAuMDMwM0MxNi41NzMyIDkuNzM3NDQgMTYuNTczMiA5LjI2MjU2IDE2LjI4MDMgOC45Njk2N0MxNS45ODc0IDguNjc2NzggMTUuNTEyNiA4LjY3Njc4IDE1LjIxOTcgOC45Njk2N1oiIGZpbGw9IiMwMGFhMDAiLz4KPC9zdmc+Cg==",alt:"Success"})},j=n=>{const{name:e,result:A,headerEndContent:i,headerCommands:o,getContent:s,index:d}=n,[g,l]=(0,a.useState)(void 0),c=!0===g||void 0===g&&"error"===A,C=`results-accordion-button-${d}`,p=`results-accordion-content-${d}`;return(0,t.jsxs)("div",{class:D.root,children:[(0,t.jsxs)("div",{class:r()(D.header,D[A],c&&D.expanded),children:[(0,t.jsx)("h3",{class:D.headerButtonWrapper,children:(0,t.jsxs)(N.Button,{id:C,class:D.headerButton,variant:"custom","aria-expanded":c,"aria-controls":p,onClick:()=>l(!c),children:[(0,t.jsx)("img",{class:r()(D.expandIcon,!c&&D.collapsed),src:"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE1Ljc5NCA3LjczMjcxQzE2LjA3OTcgOC4wMzI2MyAxNi4wNjgxIDguNTA3MzcgMTUuNzY4MiA4Ljc5MzA2TDEwLjUxNzggMTMuNzk0NEMxMC4yMjgxIDE0LjA3MDMgOS43NzI4NSAxNC4wNzAzIDkuNDgzMTggMTMuNzk0NEw0LjIzMjcxIDguNzkzMDZDMy45MzI3OSA4LjUwNzM3IDMuOTIxMjUgOC4wMzI2MyA0LjIwNjk0IDcuNzMyNzFDNC40OTI2NCA3LjQzMjc5IDQuOTY3MzcgNy40MjEyNSA1LjI2NzI5IDcuNzA2OTRMMTAuMDAwNSAxMi4yMTU1TDE0LjczMzYgNy43MDY5NEMxNS4wMzM2IDcuNDIxMjUgMTUuNTA4MyA3LjQzMjc5IDE1Ljc5NCA3LjczMjcxWiIgZmlsbD0iIzIxMjEyMSIvPgo8L3N2Zz4K",alt:""}),I[A],(0,t.jsx)("div",{class:D.title,children:e}),i&&(0,t.jsx)("div",{class:D.headerEnd,children:i})]})}),o&&(0,t.jsx)("div",{class:D.headerCommands,children:o})]}),(0,t.jsx)("div",{id:p,class:c?D.content:D.contentHidden,children:c&&s()})]})},b=n=>{const{title:e,itemName:A,itemValue:a,children:i}=n;return i||a&&A?(0,t.jsxs)(t.Fragment,{children:[e&&(0,t.jsx)("h4",{class:D.title,children:e}),A&&a?(0,t.jsxs)("div",{children:[(0,t.jsx)("div",{class:D.itemName,children:A}),(0,t.jsx)("div",{class:D.itemValue,children:a})]}):null,i]}):null}},564:(n,e,A)=>{A.d(e,{default:()=>o});var t=A(25),a=A.n(t),i=A(191),r=A.n(i)()(a());r.push([n.id,".nFL23Zz8oxyuq_mozmYD {\n  background: rgba(0, 0, 0, 0.1);\n  border: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: var(--cp-zIndexDialog);\n}\n\n@keyframes RgoXtDCvXp_zLUEhFX0G {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.VZxKM817eSqGY6etKAYx {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n  flex-shrink: 0;\n  padding: 0 20px 8px;\n}\n\n.ZWJzr7wpZVh1FbHdy6Q2 {\n  /* used for the top border and title color */\n  --cp-dialogAccent: var(--cp-themePrimary);\n  animation: RgoXtDCvXp_zLUEhFX0G 0.1s ease-in-out;\n  width: 80vw;\n  align-self: stretch;\n  margin: 20px 0;\n  background: white;\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  border-top: 4px solid var(--cp-dialogAccent);\n  border-radius: 3px;\n  box-shadow:\n    rgb(0 0 0 / 22%) 0px 25.6px 57.6px 0px,\n    rgb(0 0 0 / 18%) 0px 4.8px 14.4px 0px;\n  position: relative;\n  outline: transparent solid 3px;\n}\n.ZWJzr7wpZVh1FbHdy6Q2.sqI0jdiToNIQgfQ6E95R {\n  --cp-dialogAccent: var(--cp-errorDark);\n}\n\n.J68SmatPFr3O_E5JYUtt {\n  cursor: move;\n}\n\n.Bq9plXsgb2IJ0KMqM0yK {\n  display: flex;\n  align-items: center;\n  padding: 12px 12px 2px 20px;\n}\n\n.LTsU7kHigVvD2yo102t7 {\n  margin: 0;\n  padding: 0;\n  flex-grow: 1;\n  font-size: 24px;\n  font-weight: 600;\n  color: var(--cp-dialogAccent);\n}\n","",{version:3,sources:["webpack://./src/components/Dialog/Dialog.module.css"],names:[],mappings:"AAAA;EACE,8BAA8B;EAC9B,YAAY;EACZ,eAAe;EACf,MAAM;EACN,OAAO;EACP,QAAQ;EACR,SAAS;EACT,aAAa;EACb,mBAAmB;EACnB,uBAAuB;EACvB,+BAA+B;AACjC;;AAEA;EACE;IACE,UAAU;EACZ;EACA;IACE,UAAU;EACZ;AACF;;AAEA;EACE,aAAa;EACb,QAAQ;EACR,mBAAmB;EACnB,cAAc;EACd,mBAAmB;AACrB;;AAEA;EACE,4CAA4C;EAC5C,yCAAyC;EACzC,gDAAmC;EACnC,WAAW;EACX,mBAAmB;EACnB,cAAc;EACd,iBAAiB;EACjB,sBAAsB;EACtB,aAAa;EACb,sBAAsB;EACtB,QAAQ;EACR,4CAA4C;EAC5C,kBAAkB;EAClB;;yCAEuC;EACvC,kBAAkB;EAClB,8BAA8B;AAChC;AACA;EACE,sCAAsC;AACxC;;AAEA;EACE,YAAY;AACd;;AAEA;EACE,aAAa;EACb,mBAAmB;EACnB,2BAA2B;AAC7B;;AAEA;EACE,SAAS;EACT,UAAU;EACV,YAAY;EACZ,eAAe;EACf,gBAAgB;EAChB,6BAA6B;AAC/B",sourcesContent:[".overlay {\n  background: rgba(0, 0, 0, 0.1);\n  border: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: var(--cp-zIndexDialog);\n}\n\n@keyframes fade-in {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.commands {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n  flex-shrink: 0;\n  padding: 0 20px 8px;\n}\n\n.dialog {\n  /* used for the top border and title color */\n  --cp-dialogAccent: var(--cp-themePrimary);\n  animation: fade-in 0.1s ease-in-out;\n  width: 80vw;\n  align-self: stretch;\n  margin: 20px 0;\n  background: white;\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  border-top: 4px solid var(--cp-dialogAccent);\n  border-radius: 3px;\n  box-shadow:\n    rgb(0 0 0 / 22%) 0px 25.6px 57.6px 0px,\n    rgb(0 0 0 / 18%) 0px 4.8px 14.4px 0px;\n  position: relative;\n  outline: transparent solid 3px;\n}\n.dialog.error {\n  --cp-dialogAccent: var(--cp-errorDark);\n}\n\n.draggable {\n  cursor: move;\n}\n\n.titleArea {\n  display: flex;\n  align-items: center;\n  padding: 12px 12px 2px 20px;\n}\n\n.title {\n  margin: 0;\n  padding: 0;\n  flex-grow: 1;\n  font-size: 24px;\n  font-weight: 600;\n  color: var(--cp-dialogAccent);\n}\n"],sourceRoot:""}]),r.locals={overlay:"nFL23Zz8oxyuq_mozmYD",commands:"VZxKM817eSqGY6etKAYx",dialog:"ZWJzr7wpZVh1FbHdy6Q2","fade-in":"RgoXtDCvXp_zLUEhFX0G",error:"sqI0jdiToNIQgfQ6E95R",draggable:"J68SmatPFr3O_E5JYUtt",titleArea:"Bq9plXsgb2IJ0KMqM0yK",title:"LTsU7kHigVvD2yo102t7"};const o=r},920:(n,e,A)=>{A.d(e,{default:()=>E});var t=A(606),a=A.n(t),i=A(607),r=A.n(i),o=A(437),s=A.n(o),d=A(750),g=A.n(d),l=A(994),c=A.n(l),C=A(415),p=A.n(C),x=A(527),M={};M.styleTagTransform=p(),M.setAttributes=g(),M.insert=s().bind(null,"head"),M.domAPI=r(),M.insertStyleElement=c(),a()(x.default,M);const E=x.default&&x.default.locals?x.default.locals:void 0}};
-//# sourceMappingURL=598.chunk.js.map

package/dist/browser-esm/598.chunk.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"598.chunk.js","mappings":"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","sources":["webpack://@ms-cloudpack/overlay/./src/components/ResultsAccordion/ResultsAccordion.module.css","webpack://@ms-cloudpack/overlay/./src/components/Dialog/Dialog.module.css?48ff","webpack://@ms-cloudpack/overlay/./src/components/Dialog/Dialog.tsx","webpack://@ms-cloudpack/overlay/./src/components/StatusDialog/TaskList.module.css","webpack://@ms-cloudpack/overlay/./src/components/ResultsAccordion/ResultsAccordion.module.css?cb7f","webpack://@ms-cloudpack/overlay/./src/components/ResultsAccordion/ResultsAccordion.tsx","webpack://@ms-cloudpack/overlay/./src/components/Dialog/Dialog.module.css","webpack://@ms-cloudpack/overlay/./src/components/StatusDialog/TaskList.module.css?76fc"],"sourcesContent":["// Imports\nimport ___CSS_LOADER_API_SOURCEMAP_IMPORT___ from \"../../../../../node_modules/.store/css-loader-virtual-bfb2cc7933/package/dist/runtime/sourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../../node_modules/.store/css-loader-virtual-bfb2cc7933/package/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `.XGfokeIdlhljyLrJoTUw {\n  border: 1px solid var(--cp-borderSubtle);\n  border-radius: 3px;\n  box-shadow: 0 0 12px -6px rgba(0, 0, 0, 0.25);\n}\n\n.wuGrO61h0mxJCT13pKKi {\n  /* offset the margin so this element's border overlaps the root's gray border */\n  margin: -1px;\n  /* this overlaps the parent border so there can be a hover border for the header only without jumping */\n  border: 1px solid var(--cp-borderSubtle);\n  border-radius: 3px;\n  background: var(--cp-neutralLighter);\n  padding: 0;\n  display: flex;\n  align-items: center;\n  line-height: 1;\n}\n.wuGrO61h0mxJCT13pKKi:hover {\n  border-color: black;\n}\n.wuGrO61h0mxJCT13pKKi.xUYhCGbIYOflP2MeZWAZ {\n  /* change the margin-bottom when expanded so the border still shows up */\n  margin-bottom: 0;\n}\n.wuGrO61h0mxJCT13pKKi.tYu_98mP3NNuncdgfx2e {\n  background: var(--cp-errorLight);\n}\n.wuGrO61h0mxJCT13pKKi.sn79vVqYMTENjCFDp9o2 {\n  background: var(--cp-successLight);\n}\n.wuGrO61h0mxJCT13pKKi.uBvWcRQWreqOQcQx11QC {\n  background: var(--cp-warningLight);\n}\n\nh3.kGHJtSdatcFi9k0NuFhK {\n  /* Ignore this element for flexbox layout purposes (children act as if they're directly under parent) */\n  display: contents;\n  margin: 0;\n  padding: 0;\n}\n\n/* Unfortunately the button can't use display: contents due to browser bugs that would make it\nnot accessible with the tab key */\nbutton.DPU_BgMDvX9c3bs_hgJf {\n  width: 100%;\n  margin: 0;\n  /* Set padding on the button so it's included in the click target */\n  padding: 8px 16px;\n  border: none;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n/* The chevron icon is 20x20. We want it to take up a 32x32 area. */\n.jZlxmg1VmtWr__jzMk1T {\n  width: 20px;\n  height: 20px;\n  padding: 6px;\n  transition: transform 0.1s ease-in-out;\n}\n\n.jZlxmg1VmtWr__jzMk1T.YFo31CeXA_PU_CMg_zld {\n  padding-top: 8px;\n  padding-bottom: 4px;\n  transform: rotate(-90deg);\n}\n\n.cUZadJUKd9B70qLziRSU {\n  /* this makes it right-aligned */\n  margin-left: auto;\n  font-size: 13px;\n  font-weight: 400;\n  text-align: end;\n}\n\n._LelyTIepA5pC2N_dHW2 {\n  margin-right: 16px;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  justify-content: end;\n}\n\n.ERmJeA26FxA8sETCCLQS {\n  font-size: 16px;\n  font-weight: 500;\n  color: var(--cp-neutralPrimary);\n  /* in case it's applied directly to a h* element */\n  margin: 0;\n  padding: 0;\n}\n\n.QUAuafbYFPvmVwOUOqYN {\n  display: none;\n}\n\n.xPBZFnKM72fLspTwq_5u {\n  background: var(--cp-neutralLighterAlt);\n  /* 24px optically aligns with the icons in the header */\n  padding: 16px 24px;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  /* Increase line-height so it's easier to read */\n  line-height: 1.2em;\n}\n.xPBZFnKM72fLspTwq_5u li {\n  margin: 3px 0;\n}\n.xPBZFnKM72fLspTwq_5u p {\n  margin: 0;\n}\n.xPBZFnKM72fLspTwq_5u p + p {\n  margin-top: 8px;\n}\n\n.MP8Xx_w4X_xqx1QcYVfk {\n  font-size: 12px;\n  font-weight: 600;\n  text-transform: uppercase;\n  padding-bottom: 2px;\n}\n\n.bS0g8MYKC82hwEKmB69Q {\n  font-size: 14px;\n}\n`, \"\",{\"version\":3,\"sources\":[\"webpack://./src/components/ResultsAccordion/ResultsAccordion.module.css\"],\"names\":[],\"mappings\":\"AAAA;EACE,wCAAwC;EACxC,kBAAkB;EAClB,6CAA6C;AAC/C;;AAEA;EACE,+EAA+E;EAC/E,YAAY;EACZ,uGAAuG;EACvG,wCAAwC;EACxC,kBAAkB;EAClB,oCAAoC;EACpC,UAAU;EACV,aAAa;EACb,mBAAmB;EACnB,cAAc;AAChB;AACA;EACE,mBAAmB;AACrB;AACA;EACE,wEAAwE;EACxE,gBAAgB;AAClB;AACA;EACE,gCAAgC;AAClC;AACA;EACE,kCAAkC;AACpC;AACA;EACE,kCAAkC;AACpC;;AAEA;EACE,uGAAuG;EACvG,iBAAiB;EACjB,SAAS;EACT,UAAU;AACZ;;AAEA;iCACiC;AACjC;EACE,WAAW;EACX,SAAS;EACT,mEAAmE;EACnE,iBAAiB;EACjB,YAAY;EACZ,aAAa;EACb,mBAAmB;EACnB,QAAQ;AACV;;AAEA,mEAAmE;AACnE;EACE,WAAW;EACX,YAAY;EACZ,YAAY;EACZ,sCAAsC;AACxC;;AAEA;EACE,gBAAgB;EAChB,mBAAmB;EACnB,yBAAyB;AAC3B;;AAEA;EACE,gCAAgC;EAChC,iBAAiB;EACjB,eAAe;EACf,gBAAgB;EAChB,eAAe;AACjB;;AAEA;EACE,kBAAkB;EAClB,aAAa;EACb,mBAAmB;EACnB,QAAQ;EACR,oBAAoB;AACtB;;AAEA;EACE,eAAe;EACf,gBAAgB;EAChB,+BAA+B;EAC/B,kDAAkD;EAClD,SAAS;EACT,UAAU;AACZ;;AAEA;EACE,aAAa;AACf;;AAEA;EACE,uCAAuC;EACvC,uDAAuD;EACvD,kBAAkB;EAClB,aAAa;EACb,sBAAsB;EACtB,SAAS;EACT,gDAAgD;EAChD,kBAAkB;AACpB;AACA;EACE,aAAa;AACf;AACA;EACE,SAAS;AACX;AACA;EACE,eAAe;AACjB;;AAEA;EACE,eAAe;EACf,gBAAgB;EAChB,yBAAyB;EACzB,mBAAmB;AACrB;;AAEA;EACE,eAAe;AACjB\",\"sourcesContent\":[\".root {\\n  border: 1px solid var(--cp-borderSubtle);\\n  border-radius: 3px;\\n  box-shadow: 0 0 12px -6px rgba(0, 0, 0, 0.25);\\n}\\n\\n.header {\\n  /* offset the margin so this element's border overlaps the root's gray border */\\n  margin: -1px;\\n  /* this overlaps the parent border so there can be a hover border for the header only without jumping */\\n  border: 1px solid var(--cp-borderSubtle);\\n  border-radius: 3px;\\n  background: var(--cp-neutralLighter);\\n  padding: 0;\\n  display: flex;\\n  align-items: center;\\n  line-height: 1;\\n}\\n.header:hover {\\n  border-color: black;\\n}\\n.header.expanded {\\n  /* change the margin-bottom when expanded so the border still shows up */\\n  margin-bottom: 0;\\n}\\n.header.error {\\n  background: var(--cp-errorLight);\\n}\\n.header.success {\\n  background: var(--cp-successLight);\\n}\\n.header.warning {\\n  background: var(--cp-warningLight);\\n}\\n\\nh3.headerButtonWrapper {\\n  /* Ignore this element for flexbox layout purposes (children act as if they're directly under parent) */\\n  display: contents;\\n  margin: 0;\\n  padding: 0;\\n}\\n\\n/* Unfortunately the button can't use display: contents due to browser bugs that would make it\\nnot accessible with the tab key */\\nbutton.headerButton {\\n  width: 100%;\\n  margin: 0;\\n  /* Set padding on the button so it's included in the click target */\\n  padding: 8px 16px;\\n  border: none;\\n  display: flex;\\n  align-items: center;\\n  gap: 8px;\\n}\\n\\n/* The chevron icon is 20x20. We want it to take up a 32x32 area. */\\n.expandIcon {\\n  width: 20px;\\n  height: 20px;\\n  padding: 6px;\\n  transition: transform 0.1s ease-in-out;\\n}\\n\\n.expandIcon.collapsed {\\n  padding-top: 8px;\\n  padding-bottom: 4px;\\n  transform: rotate(-90deg);\\n}\\n\\n.headerEnd {\\n  /* this makes it right-aligned */\\n  margin-left: auto;\\n  font-size: 13px;\\n  font-weight: 400;\\n  text-align: end;\\n}\\n\\n.headerCommands {\\n  margin-right: 16px;\\n  display: flex;\\n  align-items: center;\\n  gap: 8px;\\n  justify-content: end;\\n}\\n\\n.title {\\n  font-size: 16px;\\n  font-weight: 500;\\n  color: var(--cp-neutralPrimary);\\n  /* in case it's applied directly to a h* element */\\n  margin: 0;\\n  padding: 0;\\n}\\n\\n.contentHidden {\\n  display: none;\\n}\\n\\n.content {\\n  background: var(--cp-neutralLighterAlt);\\n  /* 24px optically aligns with the icons in the header */\\n  padding: 16px 24px;\\n  display: flex;\\n  flex-direction: column;\\n  gap: 16px;\\n  /* Increase line-height so it's easier to read */\\n  line-height: 1.2em;\\n}\\n.content li {\\n  margin: 3px 0;\\n}\\n.content p {\\n  margin: 0;\\n}\\n.content p + p {\\n  margin-top: 8px;\\n}\\n\\n.itemName {\\n  font-size: 12px;\\n  font-weight: 600;\\n  text-transform: uppercase;\\n  padding-bottom: 2px;\\n}\\n\\n.itemValue {\\n  font-size: 14px;\\n}\\n\"],\"sourceRoot\":\"\"}]);\n// Exports\n___CSS_LOADER_EXPORT___.locals = {\n\t\"root\": `XGfokeIdlhljyLrJoTUw`,\n\t\"header\": `wuGrO61h0mxJCT13pKKi`,\n\t\"expanded\": `xUYhCGbIYOflP2MeZWAZ`,\n\t\"error\": `tYu_98mP3NNuncdgfx2e`,\n\t\"success\": `sn79vVqYMTENjCFDp9o2`,\n\t\"warning\": `uBvWcRQWreqOQcQx11QC`,\n\t\"headerButtonWrapper\": `kGHJtSdatcFi9k0NuFhK`,\n\t\"headerButton\": `DPU_BgMDvX9c3bs_hgJf`,\n\t\"expandIcon\": `jZlxmg1VmtWr__jzMk1T`,\n\t\"collapsed\": `YFo31CeXA_PU_CMg_zld`,\n\t\"headerEnd\": `cUZadJUKd9B70qLziRSU`,\n\t\"headerCommands\": `_LelyTIepA5pC2N_dHW2`,\n\t\"title\": `ERmJeA26FxA8sETCCLQS`,\n\t\"contentHidden\": `QUAuafbYFPvmVwOUOqYN`,\n\t\"content\": `xPBZFnKM72fLspTwq_5u`,\n\t\"itemName\": `MP8Xx_w4X_xqx1QcYVfk`,\n\t\"itemValue\": `bS0g8MYKC82hwEKmB69Q`\n};\nexport default ___CSS_LOADER_EXPORT___;\n","\n      import API from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/injectStylesIntoStyleTag.js\";\n      import domAPI from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/styleDomAPI.js\";\n      import insertFn from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/insertBySelector.js\";\n      import setAttributes from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/setAttributesWithoutAttributes.js\";\n      import insertStyleElement from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/insertStyleElement.js\";\n      import styleTagTransformFn from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/styleTagTransform.js\";\n      import content, * as namedExport from \"!!../../../../../node_modules/.store/css-loader-virtual-bfb2cc7933/package/dist/cjs.js??ruleSet[1].rules[0].oneOf[1].use[1]!./Dialog.module.css\";\n      \n      \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\noptions.insert = insertFn.bind(null, \"head\");\noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../../node_modules/.store/css-loader-virtual-bfb2cc7933/package/dist/cjs.js??ruleSet[1].rules[0].oneOf[1].use[1]!./Dialog.module.css\";\n       export default content && content.locals ? content.locals : undefined;\n","import cx from 'classnames';\nimport type { ComponentChildren, FunctionComponent } from 'preact';\nimport { useRef } from 'preact/hooks';\nimport styles from './Dialog.module.css';\nimport { useDraggable } from '../../hooks/useDraggable.js';\nimport { Button } from '../Button/Button.js';\n\nexport interface DialogProps {\n  title: string;\n  id: string;\n  style?: 'default' | 'error';\n  draggable?: boolean;\n  onClose?: () => void;\n  commands?: ComponentChildren;\n  children: ComponentChildren;\n}\n\nexport const Dialog: FunctionComponent<DialogProps> = (props) => {\n  const { title, id, style, draggable, onClose, commands, children } = props;\n  const draggableRef = useRef<HTMLDivElement>(null);\n  const draggableTargetRef = useRef<HTMLDivElement>(null);\n\n  useDraggable({\n    enabled: !!draggable,\n    containerElementRef: draggableRef,\n    dragElementRef: draggableTargetRef,\n  });\n\n  return (\n    <div id={id} class={styles.overlay}>\n      <div ref={draggableRef} class={cx(styles.dialog, style === 'error' && styles.error)}>\n        <div class={styles.titleArea}>\n          <h2 ref={draggableTargetRef} class={cx(styles.title, draggable && styles.draggable)}>\n            {title}\n          </h2>\n          {onClose && (\n            // a close icon is common/universal enough that it doesn't need hover text\n            <Button variant=\"iconOnly\" iconName=\"close\" onClick={onClose} aria-label=\"Close\" />\n          )}\n        </div>\n        {commands && <div class={styles.commands}>{commands}</div>}\n        {children}\n      </div>\n    </div>\n  );\n};\n","// Imports\nimport ___CSS_LOADER_API_SOURCEMAP_IMPORT___ from \"../../../../../node_modules/.store/css-loader-virtual-bfb2cc7933/package/dist/runtime/sourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../../node_modules/.store/css-loader-virtual-bfb2cc7933/package/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `/* NOTE: This is also used by ErrorDialog */\n.sQBBRBwDngEVzWzI6zAo {\n  flex-grow: 1;\n  overflow: auto;\n  border-top: 1px solid var(--cp-border);\n  box-sizing: border-box;\n  padding: 16px 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n`, \"\",{\"version\":3,\"sources\":[\"webpack://./src/components/StatusDialog/TaskList.module.css\"],\"names\":[],\"mappings\":\"AAAA,2CAA2C;AAC3C;EACE,YAAY;EACZ,cAAc;EACd,sCAAsC;EACtC,sBAAsB;EACtB,kBAAkB;EAClB,aAAa;EACb,sBAAsB;EACtB,QAAQ;AACV\",\"sourcesContent\":[\"/* NOTE: This is also used by ErrorDialog */\\n.root {\\n  flex-grow: 1;\\n  overflow: auto;\\n  border-top: 1px solid var(--cp-border);\\n  box-sizing: border-box;\\n  padding: 16px 20px;\\n  display: flex;\\n  flex-direction: column;\\n  gap: 8px;\\n}\\n\"],\"sourceRoot\":\"\"}]);\n// Exports\n___CSS_LOADER_EXPORT___.locals = {\n\t\"root\": `sQBBRBwDngEVzWzI6zAo`\n};\nexport default ___CSS_LOADER_EXPORT___;\n","\n      import API from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/injectStylesIntoStyleTag.js\";\n      import domAPI from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/styleDomAPI.js\";\n      import insertFn from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/insertBySelector.js\";\n      import setAttributes from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/setAttributesWithoutAttributes.js\";\n      import insertStyleElement from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/insertStyleElement.js\";\n      import styleTagTransformFn from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/styleTagTransform.js\";\n      import content, * as namedExport from \"!!../../../../../node_modules/.store/css-loader-virtual-bfb2cc7933/package/dist/cjs.js??ruleSet[1].rules[0].oneOf[1].use[1]!./ResultsAccordion.module.css\";\n      \n      \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\noptions.insert = insertFn.bind(null, \"head\");\noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../../node_modules/.store/css-loader-virtual-bfb2cc7933/package/dist/cjs.js??ruleSet[1].rules[0].oneOf[1].use[1]!./ResultsAccordion.module.css\";\n       export default content && content.locals ? content.locals : undefined;\n","import type { ComponentChildren, FunctionComponent } from 'preact';\nimport { useState } from 'preact/hooks';\nimport cx from 'classnames';\nimport styles from './ResultsAccordion.module.css';\nimport ErrorIcon from '../../images/error-24.inline.svg';\nimport SuccessIcon from '../../images/success-24.inline.svg';\nimport WarningIcon from '../../images/warning-24.inline.svg';\nimport ChevronDownIcon from '../../images/chevrondown-20.inline.svg';\nimport { Button } from '../Button/Button.js';\n\nexport interface ResultsAccordionProps {\n  /** Name of the bundle task or other item (can have formatting, but should not have a header element) */\n  name: ComponentChildren;\n  /** Index used for generating accordion element IDs */\n  index: number;\n  result: 'success' | 'warning' | 'error';\n  /** Info that goes at the end of the header, inside the clickable area */\n  headerEndContent?: string;\n  /** Commands to go at the end of the header, outside the clickable area */\n  headerCommands?: ComponentChildren;\n  /**\n   * Get the content, only if the section is expanded.\n   * Use `CollapsibleResultsSubSection` for formatting (returning multiple sections if needed).\n   *\n   * This callback is to prevent rendering thousands of bundle result details unnecessarily.\n   */\n  getContent: () => ComponentChildren;\n}\n\nexport interface ResultsAccordionContentProps {\n  /** Will be at start of sub-section and styled slightly larger if provided */\n  title?: string;\n  /** Item name, such as \"Input path\". Ignored if `itemValue` is not provided. */\n  itemName?: string;\n  /** Value corresponding to `itemName`, such as the path to a package. Requires `itemName`. */\n  itemValue?: ComponentChildren;\n  /** Custom children */\n  children?: ComponentChildren;\n}\n\nconst resultIcons = {\n  error: <img src={ErrorIcon} alt=\"Error\" />,\n  warning: <img src={WarningIcon} alt=\"Warning\" />,\n  success: <img src={SuccessIcon} alt=\"Success\" />,\n};\n\n/**\n * Collapsible section for displaying results of a bundle task or other item.\n * This handles the header formatting and layout, expanding/collapsing, and displaying content.\n */\nexport const ResultsAccordion: FunctionComponent<ResultsAccordionProps> = (props) => {\n  const { name, result, headerEndContent, headerCommands, getContent, index } = props;\n  const [isOpen, setIsOpen] = useState<boolean | undefined>(undefined);\n  const showContent = isOpen === true || (isOpen === undefined && result === 'error');\n  const headerButtonId = `results-accordion-button-${index}`;\n  const contentId = `results-accordion-content-${index}`;\n\n  // Trying to follow the accordion pattern: https://www.w3.org/WAI/ARIA/apg/patterns/accordion/\n  // except the odd thing is we want to allow a separate click target for a refresh button at the end\n  return (\n    <div class={styles.root}>\n      <div class={cx(styles.header, styles[result], showContent && styles.expanded)}>\n        <h3 class={styles.headerButtonWrapper}>\n          <Button\n            id={headerButtonId}\n            class={styles.headerButton}\n            variant=\"custom\"\n            aria-expanded={showContent}\n            aria-controls={contentId}\n            onClick={() => setIsOpen(!showContent)}\n          >\n            <img\n              class={cx(styles.expandIcon, !showContent && styles.collapsed)}\n              src={ChevronDownIcon}\n              // With the wrapping button, the chevron is presentation-only\n              alt=\"\"\n            />\n            {resultIcons[result]}\n            <div class={styles.title}>{name}</div>\n            {headerEndContent && <div class={styles.headerEnd}>{headerEndContent}</div>}\n          </Button>\n        </h3>\n        {headerCommands && <div class={styles.headerCommands}>{headerCommands}</div>}\n      </div>\n      <div id={contentId} class={showContent ? styles.content : styles.contentHidden}>\n        {showContent && getContent()}\n      </div>\n    </div>\n  );\n};\n\n/**\n * Sub-section to return from `ResultsAccordionProps.getContent`.\n * If there are no children and no `itemValue`, the section will be ignored.\n */\nexport const ResultsAccordionContent: FunctionComponent<ResultsAccordionContentProps> = (props) => {\n  const { title, itemName, itemValue, children } = props;\n  if (!children && !(itemValue && itemName)) {\n    return null;\n  }\n\n  // Use a fragment so the sub-parts use the parent's flex styling\n  return (\n    <>\n      {title && <h4 class={styles.title}>{title}</h4>}\n      {itemName && itemValue ? (\n        <div>\n          <div class={styles.itemName}>{itemName}</div>\n          <div class={styles.itemValue}>{itemValue}</div>\n        </div>\n      ) : null}\n      {children}\n    </>\n  );\n};\n","// Imports\nimport ___CSS_LOADER_API_SOURCEMAP_IMPORT___ from \"../../../../../node_modules/.store/css-loader-virtual-bfb2cc7933/package/dist/runtime/sourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../../node_modules/.store/css-loader-virtual-bfb2cc7933/package/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `.nFL23Zz8oxyuq_mozmYD {\n  background: rgba(0, 0, 0, 0.1);\n  border: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: var(--cp-zIndexDialog);\n}\n\n@keyframes RgoXtDCvXp_zLUEhFX0G {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.VZxKM817eSqGY6etKAYx {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n  flex-shrink: 0;\n  padding: 0 20px 8px;\n}\n\n.ZWJzr7wpZVh1FbHdy6Q2 {\n  /* used for the top border and title color */\n  --cp-dialogAccent: var(--cp-themePrimary);\n  animation: RgoXtDCvXp_zLUEhFX0G 0.1s ease-in-out;\n  width: 80vw;\n  align-self: stretch;\n  margin: 20px 0;\n  background: white;\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  border-top: 4px solid var(--cp-dialogAccent);\n  border-radius: 3px;\n  box-shadow:\n    rgb(0 0 0 / 22%) 0px 25.6px 57.6px 0px,\n    rgb(0 0 0 / 18%) 0px 4.8px 14.4px 0px;\n  position: relative;\n  outline: transparent solid 3px;\n}\n.ZWJzr7wpZVh1FbHdy6Q2.sqI0jdiToNIQgfQ6E95R {\n  --cp-dialogAccent: var(--cp-errorDark);\n}\n\n.J68SmatPFr3O_E5JYUtt {\n  cursor: move;\n}\n\n.Bq9plXsgb2IJ0KMqM0yK {\n  display: flex;\n  align-items: center;\n  padding: 12px 12px 2px 20px;\n}\n\n.LTsU7kHigVvD2yo102t7 {\n  margin: 0;\n  padding: 0;\n  flex-grow: 1;\n  font-size: 24px;\n  font-weight: 600;\n  color: var(--cp-dialogAccent);\n}\n`, \"\",{\"version\":3,\"sources\":[\"webpack://./src/components/Dialog/Dialog.module.css\"],\"names\":[],\"mappings\":\"AAAA;EACE,8BAA8B;EAC9B,YAAY;EACZ,eAAe;EACf,MAAM;EACN,OAAO;EACP,QAAQ;EACR,SAAS;EACT,aAAa;EACb,mBAAmB;EACnB,uBAAuB;EACvB,+BAA+B;AACjC;;AAEA;EACE;IACE,UAAU;EACZ;EACA;IACE,UAAU;EACZ;AACF;;AAEA;EACE,aAAa;EACb,QAAQ;EACR,mBAAmB;EACnB,cAAc;EACd,mBAAmB;AACrB;;AAEA;EACE,4CAA4C;EAC5C,yCAAyC;EACzC,gDAAmC;EACnC,WAAW;EACX,mBAAmB;EACnB,cAAc;EACd,iBAAiB;EACjB,sBAAsB;EACtB,aAAa;EACb,sBAAsB;EACtB,QAAQ;EACR,4CAA4C;EAC5C,kBAAkB;EAClB;;yCAEuC;EACvC,kBAAkB;EAClB,8BAA8B;AAChC;AACA;EACE,sCAAsC;AACxC;;AAEA;EACE,YAAY;AACd;;AAEA;EACE,aAAa;EACb,mBAAmB;EACnB,2BAA2B;AAC7B;;AAEA;EACE,SAAS;EACT,UAAU;EACV,YAAY;EACZ,eAAe;EACf,gBAAgB;EAChB,6BAA6B;AAC/B\",\"sourcesContent\":[\".overlay {\\n  background: rgba(0, 0, 0, 0.1);\\n  border: none;\\n  position: fixed;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  z-index: var(--cp-zIndexDialog);\\n}\\n\\n@keyframes fade-in {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n\\n.commands {\\n  display: flex;\\n  gap: 8px;\\n  align-items: center;\\n  flex-shrink: 0;\\n  padding: 0 20px 8px;\\n}\\n\\n.dialog {\\n  /* used for the top border and title color */\\n  --cp-dialogAccent: var(--cp-themePrimary);\\n  animation: fade-in 0.1s ease-in-out;\\n  width: 80vw;\\n  align-self: stretch;\\n  margin: 20px 0;\\n  background: white;\\n  box-sizing: border-box;\\n  display: flex;\\n  flex-direction: column;\\n  gap: 8px;\\n  border-top: 4px solid var(--cp-dialogAccent);\\n  border-radius: 3px;\\n  box-shadow:\\n    rgb(0 0 0 / 22%) 0px 25.6px 57.6px 0px,\\n    rgb(0 0 0 / 18%) 0px 4.8px 14.4px 0px;\\n  position: relative;\\n  outline: transparent solid 3px;\\n}\\n.dialog.error {\\n  --cp-dialogAccent: var(--cp-errorDark);\\n}\\n\\n.draggable {\\n  cursor: move;\\n}\\n\\n.titleArea {\\n  display: flex;\\n  align-items: center;\\n  padding: 12px 12px 2px 20px;\\n}\\n\\n.title {\\n  margin: 0;\\n  padding: 0;\\n  flex-grow: 1;\\n  font-size: 24px;\\n  font-weight: 600;\\n  color: var(--cp-dialogAccent);\\n}\\n\"],\"sourceRoot\":\"\"}]);\n// Exports\n___CSS_LOADER_EXPORT___.locals = {\n\t\"overlay\": `nFL23Zz8oxyuq_mozmYD`,\n\t\"commands\": `VZxKM817eSqGY6etKAYx`,\n\t\"dialog\": `ZWJzr7wpZVh1FbHdy6Q2`,\n\t\"fade-in\": `RgoXtDCvXp_zLUEhFX0G`,\n\t\"error\": `sqI0jdiToNIQgfQ6E95R`,\n\t\"draggable\": `J68SmatPFr3O_E5JYUtt`,\n\t\"titleArea\": `Bq9plXsgb2IJ0KMqM0yK`,\n\t\"title\": `LTsU7kHigVvD2yo102t7`\n};\nexport default ___CSS_LOADER_EXPORT___;\n","\n      import API from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/injectStylesIntoStyleTag.js\";\n      import domAPI from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/styleDomAPI.js\";\n      import insertFn from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/insertBySelector.js\";\n      import setAttributes from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/setAttributesWithoutAttributes.js\";\n      import insertStyleElement from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/insertStyleElement.js\";\n      import styleTagTransformFn from \"!../../../../../node_modules/.store/style-loader-virtual-bd73274477/package/dist/runtime/styleTagTransform.js\";\n      import content, * as namedExport from \"!!../../../../../node_modules/.store/css-loader-virtual-bfb2cc7933/package/dist/cjs.js??ruleSet[1].rules[0].oneOf[1].use[1]!./TaskList.module.css\";\n      \n      \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\noptions.insert = insertFn.bind(null, \"head\");\noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../../node_modules/.store/css-loader-virtual-bfb2cc7933/package/dist/cjs.js??ruleSet[1].rules[0].oneOf[1].use[1]!./TaskList.module.css\";\n       export default content && content.locals ? content.locals : undefined;\n"],"names":["___CSS_LOADER_EXPORT___","push","module","id","locals","options","styleTagTransform","setAttributes","insert","domAPI","insertStyleElement","undefined","Dialog","props","title","style","draggable","onClose","commands","children","draggableRef","useRef","draggableTargetRef","useDraggable","enabled","containerElementRef","dragElementRef","div","class","styles","overlay","ref","cx","dialog","error","titleArea","h2","Button","variant","iconName","onClick","aria-label","resultIcons","img","src","alt","warning","success","ResultsAccordion","name","result","headerEndContent","headerCommands","getContent","index","isOpen","setIsOpen","useState","showContent","headerButtonId","contentId","root","header","expanded","h3","headerButtonWrapper","headerButton","aria-expanded","aria-controls","expandIcon","collapsed","headerEnd","content","contentHidden","ResultsAccordionContent","itemName","itemValue","h4"],"sourceRoot":""}