@pablo2410/shared-ui 0.18.2 → 0.19.0

package/dist/reporting/index.js

@@ -12,8 +12,9 @@ import {
   SelectItem,
   SelectTrigger,
   SelectValue,
+  Switch,
   Textarea
-} from "../chunk-NXE653CX.js";
+} from "../chunk-K6FHU4HN.js";
 import {
   cn
 } from "../chunk-JT3XLKKD.js";
@@ -29,7 +30,7 @@ import {
 } from "../chunk-BKGUIIN2.js";
 
 // src/reporting/ReportingToolbar.tsx
-import { useState } from "react";
+import { useRef, useState } from "react";
 import {
   ShieldAlert,
   Leaf,
@@ -38,6 +39,8 @@ import {
   Lightbulb,
   ChevronDown,
   Send,
+  ImagePlus,
+  X,
   UserCog
 } from "lucide-react";
 import { toast } from "sonner";
@@ -68,7 +71,7 @@ var ALL_REPORT_OPTIONS = [
 var ALL_FEEDBACK_OPTIONS = [
   {
     category: "problem",
-    label: "Report Problem",
+    label: "Report a Problem",
     description: "Something isn't working",
     icon: Bug,
     color: "#EF4444"
@@ -76,17 +79,11 @@ var ALL_FEEDBACK_OPTIONS = [
   {
     category: "suggestion",
     label: "Suggestion",
-    description: "Idea for improvement",
+    description: "An idea for improvement",
     icon: Lightbulb,
     color: "#8C34E9"
   }
 ];
-var SEVERITY_OPTIONS = [
-  { value: "critical", label: "Critical", color: "#EF4444" },
-  { value: "high", label: "High", color: "#F59E0B" },
-  { value: "medium", label: "Medium", color: "#3b82f6" },
-  { value: "low", label: "Low", color: "#22C55E" }
-];
 function ReportingToolbar({
   moduleName = "Oplytics",
   showIncidentReporting = true,
@@ -95,7 +92,12 @@ function ReportingToolbar({
   feedbackCategories = ["problem", "suggestion"],
   onReportSubmit,
   onFeedbackSubmit,
-  defaultLocation = "",
+  hierarchyContext,
+  currentUser,
+  services = OPLYTICS_SERVICES,
+  defaultServiceSlug,
+  enableScreenshot = true,
+  reportsComingSoon = true,
   className
 }) {
   const reportOptions = ALL_REPORT_OPTIONS.filter(
@@ -104,91 +106,82 @@ function ReportingToolbar({
   const feedbackOptions = ALL_FEEDBACK_OPTIONS.filter(
     (opt) => feedbackCategories.includes(opt.category)
   );
-  const [reportDialogOpen, setReportDialogOpen] = useState(false);
-  const [selectedReportCategory, setSelectedReportCategory] = useState("safety");
-  const [reportSeverity, setReportSeverity] = useState("medium");
-  const [reportLocation, setReportLocation] = useState(defaultLocation);
-  const [reportDescription, setReportDescription] = useState("");
-  const [reportImmediateAction, setReportImmediateAction] = useState("");
-  const [feedbackDialogOpen, setFeedbackDialogOpen] = useState(false);
-  const [selectedFeedbackCategory, setSelectedFeedbackCategory] = useState("problem");
-  const [feedbackSubject, setFeedbackSubject] = useState("");
-  const [feedbackDescription, setFeedbackDescription] = useState("");
+  const firstServiceSlug = defaultServiceSlug ?? services[0]?.slug ?? "portal";
+  const [feedbackOpen, setFeedbackOpen] = useState(false);
+  const [category, setCategory] = useState("problem");
+  const [serviceSlug, setServiceSlug] = useState(firstServiceSlug);
+  const [isBlocking, setIsBlocking] = useState(false);
+  const [summary, setSummary] = useState("");
+  const [details, setDetails] = useState("");
+  const [screenshot, setScreenshot] = useState(null);
+  const [screenshotName, setScreenshotName] = useState(null);
   const [submitting, setSubmitting] = useState(false);
-  const openReportDialog = (category) => {
-    setSelectedReportCategory(category);
-    setReportSeverity(category === "stop-work" ? "critical" : "medium");
-    setReportLocation(defaultLocation);
-    setReportDescription("");
-    setReportImmediateAction("");
-    setReportDialogOpen(true);
-  };
-  const openFeedbackDialog = (category) => {
-    setSelectedFeedbackCategory(category);
-    setFeedbackSubject("");
-    setFeedbackDescription("");
-    setFeedbackDialogOpen(true);
+  const fileInputRef = useRef(null);
+  const openFeedback = (c) => {
+    setCategory(c);
+    setServiceSlug(firstServiceSlug);
+    setIsBlocking(false);
+    setSummary("");
+    setDetails("");
+    setScreenshot(null);
+    setScreenshotName(null);
+    setFeedbackOpen(true);
   };
-  const handleReportSubmit = async () => {
-    if (!reportDescription.trim()) {
-      toast.error("Please provide a description");
+  const handlePickFile = async (e) => {
+    const file = e.target.files?.[0];
+    e.target.value = "";
+    if (!file) return;
+    const check = isAcceptableScreenshot(file);
+    if (!check.ok) {
+      toast.error(check.reason);
       return;
     }
-    setSubmitting(true);
     try {
-      const report = {
-        category: selectedReportCategory,
-        description: reportDescription,
-        location: reportLocation || void 0,
-        severity: reportSeverity,
-        immediateAction: reportImmediateAction || void 0,
-        moduleName,
-        timestamp: (/* @__PURE__ */ new Date()).toISOString()
-      };
-      await onReportSubmit(report);
-      toast.success("Report submitted successfully", {
-        description: selectedReportCategory === "stop-work" ? "Stop Work authority raised \u2014 management has been notified" : "Your report has been logged and assigned for review"
-      });
-      setReportDialogOpen(false);
+      const shot = await readFileAsScreenshot(file);
+      setScreenshot(shot);
+      setScreenshotName(file.name);
     } catch (err) {
-      console.error("[ReportingToolbar] report submit failed:", err);
-      toast.error("Failed to submit report. Please try again.");
-    } finally {
-      setSubmitting(false);
+      console.error("[ReportingToolbar] screenshot read failed:", err);
+      toast.error("Could not read that image.");
     }
   };
-  const handleFeedbackSubmit = async () => {
-    if (!feedbackDescription.trim()) {
-      toast.error("Please provide a description");
+  const submitFeedback = async () => {
+    if (!details.trim()) {
+      toast.error("Please describe the problem or idea.");
       return;
     }
     setSubmitting(true);
     try {
       const feedback = {
-        category: selectedFeedbackCategory,
-        subject: feedbackSubject || void 0,
-        description: feedbackDescription,
+        category,
+        serviceSlug,
+        summary: summary.trim() || void 0,
+        details: details.trim(),
+        isBlocking,
         moduleName,
         timestamp: (/* @__PURE__ */ new Date()).toISOString(),
-        pageContext: typeof window !== "undefined" ? window.location.pathname : void 0
+        pageContext: typeof window !== "undefined" ? window.location.pathname : void 0,
+        submittedBy: currentUser,
+        screenshot: screenshot ?? void 0
       };
       await onFeedbackSubmit(feedback);
       toast.success(
-        selectedFeedbackCategory === "problem" ? "Problem reported \u2014 Oplytics team will review" : "Suggestion submitted \u2014 thank you for your feedback"
+        category === "problem" ? "Thanks \u2014 we've logged it. You'll get a confirmation email." : "Thanks for the suggestion \u2014 you'll get a confirmation email."
       );
-      setFeedbackDialogOpen(false);
+      setFeedbackOpen(false);
     } catch (err) {
       console.error("[ReportingToolbar] feedback submit failed:", err);
-      toast.error("Failed to submit feedback. Please try again.");
+      toast.error("Couldn't submit that. Please try again.");
     } finally {
       setSubmitting(false);
     }
   };
-  const reportConfig = ALL_REPORT_OPTIONS.find(
-    (r) => r.category === selectedReportCategory
-  );
+  const showReportGroup = showIncidentReporting && reportOptions.length > 0;
+  const showFeedbackGroup = showFeedback && feedbackOptions.length > 0;
+  if (!showReportGroup && !showFeedbackGroup) return null;
+  void hierarchyContext;
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("div", { className: cn("flex items-center gap-2", className), children: showIncidentReporting && reportOptions.length > 0 || showFeedback && feedbackOptions.length > 0 ? /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx("div", { className: cn("flex items-center gap-2", className), children: /* @__PURE__ */ jsxs(DropdownMenu, { children: [
       /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
         Button,
         {
@@ -202,13 +195,28 @@ function ReportingToolbar({
           ]
         }
       ) }),
-      /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", className: "w-56", children: [
-        showIncidentReporting && reportOptions.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(DropdownMenuLabel, { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: "Report" }),
+      /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", className: "w-60", children: [
+        showReportGroup && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs(DropdownMenuLabel, { className: "flex items-center gap-2 text-[10px] uppercase tracking-wide text-muted-foreground", children: [
+            "Report",
+            reportsComingSoon && /* @__PURE__ */ jsx(
+              Badge,
+              {
+                variant: "outline",
+                className: "border-[#8C34E9]/40 text-[9px] font-normal text-[#C084FC]",
+                children: "Coming soon"
+              }
+            )
+          ] }),
           reportOptions.map((opt) => /* @__PURE__ */ jsxs(
             DropdownMenuItem,
             {
-              onClick: () => openReportDialog(opt.category),
+              disabled: reportsComingSoon,
+              onClick: () => {
+                if (!reportsComingSoon) {
+                  void onReportSubmit;
+                }
+              },
               className: "gap-3 py-2.5",
               children: [
                 /* @__PURE__ */ jsx(
@@ -227,13 +235,13 @@ function ReportingToolbar({
             opt.category
           ))
         ] }),
-        showIncidentReporting && reportOptions.length > 0 && showFeedback && feedbackOptions.length > 0 && /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
-        showFeedback && feedbackOptions.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        showReportGroup && showFeedbackGroup && /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+        showFeedbackGroup && /* @__PURE__ */ jsxs(Fragment, { children: [
           /* @__PURE__ */ jsx(DropdownMenuLabel, { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: "Feedback" }),
           feedbackOptions.map((opt) => /* @__PURE__ */ jsxs(
             DropdownMenuItem,
             {
-              onClick: () => openFeedbackDialog(opt.category),
+              onClick: () => openFeedback(opt.category),
               className: "gap-3 py-2.5",
               children: [
                 /* @__PURE__ */ jsx(
@@ -253,176 +261,117 @@ function ReportingToolbar({
           ))
         ] })
       ] })
-    ] }) : null }),
-    /* @__PURE__ */ jsx(Dialog, { open: reportDialogOpen, onOpenChange: setReportDialogOpen, children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[500px]", children: [
+    ] }) }),
+    /* @__PURE__ */ jsx(Dialog, { open: feedbackOpen, onOpenChange: setFeedbackOpen, children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[520px]", children: [
       /* @__PURE__ */ jsxs(DialogHeader, { children: [
         /* @__PURE__ */ jsxs(DialogTitle, { className: "flex items-center gap-2", children: [
-          reportConfig && /* @__PURE__ */ jsx(
-            reportConfig.icon,
-            {
-              className: "h-5 w-5",
-              style: { color: reportConfig.color }
-            }
-          ),
-          reportConfig?.label || "Report",
-          selectedReportCategory === "stop-work" && /* @__PURE__ */ jsx(Badge, { className: "bg-[#F59E0B] text-white text-[9px] border-0", children: "URGENT" })
+          category === "problem" ? /* @__PURE__ */ jsx(Bug, { className: "h-5 w-5 text-[#EF4444]" }) : /* @__PURE__ */ jsx(Lightbulb, { className: "h-5 w-5 text-[#8C34E9]" }),
+          category === "problem" ? "Report a Problem" : "Share a Suggestion"
         ] }),
-        /* @__PURE__ */ jsxs(DialogDescription, { children: [
-          reportConfig?.description,
-          ". All reports are logged and tracked."
-        ] })
+        /* @__PURE__ */ jsx(DialogDescription, { children: category === "problem" ? "Tell us what went wrong. We triage within 24 hours." : "We review every suggestion and schedule improvements against the roadmap." })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "space-y-4 py-2", children: [
         /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-          /* @__PURE__ */ jsx(Label, { className: "text-xs font-medium", children: "Severity" }),
-          /* @__PURE__ */ jsxs(
-            Select,
-            {
-              value: reportSeverity,
-              onValueChange: (v) => setReportSeverity(
-                v
-              ),
-              children: [
-                /* @__PURE__ */ jsx(SelectTrigger, { className: "h-9", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
-                /* @__PURE__ */ jsx(SelectContent, { children: SEVERITY_OPTIONS.map((s) => /* @__PURE__ */ jsx(SelectItem, { value: s.value, children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-                  /* @__PURE__ */ jsx(
-                    "div",
-                    {
-                      className: "h-2 w-2 rounded-full",
-                      style: { backgroundColor: s.color }
-                    }
-                  ),
-                  s.label
-                ] }) }, s.value)) })
-              ]
-            }
-          )
+          /* @__PURE__ */ jsx(Label, { className: "text-xs font-medium", children: "Which service?" }),
+          /* @__PURE__ */ jsxs(Select, { value: serviceSlug, onValueChange: setServiceSlug, children: [
+            /* @__PURE__ */ jsx(SelectTrigger, { className: "h-9", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+            /* @__PURE__ */ jsx(SelectContent, { children: services.map((s) => /* @__PURE__ */ jsx(SelectItem, { value: s.slug, children: s.label }, s.slug)) })
+          ] })
+        ] }),
+        category === "problem" && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between rounded-md border border-[#1E2738] px-3 py-2", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: "Is this blocking you?" }),
+            /* @__PURE__ */ jsx("p", { className: "text-[10px] text-muted-foreground", children: "Blocking issues are treated as high priority." })
+          ] }),
+          /* @__PURE__ */ jsx(Switch, { checked: isBlocking, onCheckedChange: setIsBlocking })
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-          /* @__PURE__ */ jsx(Label, { className: "text-xs font-medium", children: "Location / Area" }),
+          /* @__PURE__ */ jsx(Label, { className: "text-xs font-medium", children: "Summary" }),
           /* @__PURE__ */ jsx(
             Input,
             {
-              value: reportLocation,
-              onChange: (e) => setReportLocation(e.target.value),
-              placeholder: "e.g., Production Line 3, Warehouse B",
+              value: summary,
+              onChange: (e) => setSummary(e.target.value),
+              placeholder: category === "problem" ? "Brief summary of the issue" : "Brief summary of your idea",
               className: "h-9"
             }
           )
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-          /* @__PURE__ */ jsx(Label, { className: "text-xs font-medium", children: "Description *" }),
+          /* @__PURE__ */ jsx(Label, { className: "text-xs font-medium", children: "Details *" }),
           /* @__PURE__ */ jsx(
             Textarea,
             {
-              value: reportDescription,
-              onChange: (e) => setReportDescription(e.target.value),
-              placeholder: "Describe what happened or what you observed...",
-              rows: 4
+              value: details,
+              onChange: (e) => setDetails(e.target.value),
+              placeholder: category === "problem" ? "What were you trying to do? What happened instead?" : "Describe your suggestion and how it would help\u2026",
+              rows: 5
             }
           )
         ] }),
-        /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-          /* @__PURE__ */ jsx(Label, { className: "text-xs font-medium", children: "Immediate Action Taken" }),
+        enableScreenshot && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx(Label, { className: "text-xs font-medium", children: "Screenshot (optional)" }),
           /* @__PURE__ */ jsx(
-            Textarea,
+            "input",
             {
-              value: reportImmediateAction,
-              onChange: (e) => setReportImmediateAction(e.target.value),
-              placeholder: "Describe any immediate action taken to make the area safe...",
-              rows: 2
+              ref: fileInputRef,
+              type: "file",
+              accept: "image/*",
+              className: "hidden",
+              onChange: handlePickFile
             }
-          )
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxs(DialogFooter, { children: [
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "outline",
-            onClick: () => setReportDialogOpen(false),
-            children: "Cancel"
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          Button,
-          {
-            onClick: handleReportSubmit,
-            disabled: submitting || !reportDescription.trim(),
-            className: "gap-2",
-            style: {
-              backgroundColor: reportConfig?.color,
-              color: "white"
-            },
-            children: [
-              /* @__PURE__ */ jsx(Send, { className: "h-3.5 w-3.5" }),
-              submitting ? "Submitting..." : "Submit Report"
-            ]
-          }
-        )
-      ] })
-    ] }) }),
-    /* @__PURE__ */ jsx(Dialog, { open: feedbackDialogOpen, onOpenChange: setFeedbackDialogOpen, children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[500px]", children: [
-      /* @__PURE__ */ jsxs(DialogHeader, { children: [
-        /* @__PURE__ */ jsxs(DialogTitle, { className: "flex items-center gap-2", children: [
-          selectedFeedbackCategory === "problem" ? /* @__PURE__ */ jsx(Bug, { className: "h-5 w-5 text-[#EF4444]" }) : /* @__PURE__ */ jsx(Lightbulb, { className: "h-5 w-5 text-[#8C34E9]" }),
-          selectedFeedbackCategory === "problem" ? "Report a Problem" : "Submit a Suggestion"
-        ] }),
-        /* @__PURE__ */ jsx(DialogDescription, { children: selectedFeedbackCategory === "problem" ? "Help us fix issues \u2014 describe what went wrong." : "We'd love to hear your ideas for improving Oplytics." })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "space-y-4 py-2", children: [
-        /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-          /* @__PURE__ */ jsx(Label, { className: "text-xs font-medium", children: "Subject" }),
-          /* @__PURE__ */ jsx(
-            Input,
-            {
-              value: feedbackSubject,
-              onChange: (e) => setFeedbackSubject(e.target.value),
-              placeholder: selectedFeedbackCategory === "problem" ? "Brief summary of the issue" : "Brief summary of your idea",
-              className: "h-9"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-          /* @__PURE__ */ jsx(Label, { className: "text-xs font-medium", children: "Description *" }),
-          /* @__PURE__ */ jsx(
-            Textarea,
+          ),
+          screenshot ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 rounded-md border border-[#1E2738] px-3 py-2", children: [
+            /* @__PURE__ */ jsx(ImagePlus, { className: "h-4 w-4 text-[#8C34E9]" }),
+            /* @__PURE__ */ jsx("span", { className: "flex-1 truncate text-xs text-[#E2E8F0]", children: screenshotName ?? "screenshot" }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  setScreenshot(null);
+                  setScreenshotName(null);
+                },
+                className: "text-muted-foreground hover:text-[#E2E8F0]",
+                "aria-label": "Remove screenshot",
+                children: /* @__PURE__ */ jsx(X, { className: "h-3.5 w-3.5" })
+              }
+            )
+          ] }) : /* @__PURE__ */ jsxs(
+            Button,
             {
-              value: feedbackDescription,
-              onChange: (e) => setFeedbackDescription(e.target.value),
-              placeholder: selectedFeedbackCategory === "problem" ? "What were you trying to do? What happened instead?" : "Describe your suggestion and how it would help...",
-              rows: 5
+              type: "button",
+              variant: "outline",
+              size: "sm",
+              className: "h-9 gap-1.5",
+              onClick: () => fileInputRef.current?.click(),
+              children: [
+                /* @__PURE__ */ jsx(ImagePlus, { className: "h-3.5 w-3.5" }),
+                "Attach an image"
+              ]
             }
           )
         ] }),
-        /* @__PURE__ */ jsxs("div", { className: "text-[10px] text-muted-foreground", children: [
-          "Module: ",
+        /* @__PURE__ */ jsxs("p", { className: "text-[10px] text-muted-foreground", children: [
           moduleName,
-          " \u2014 Feedback is reviewed by the Oplytics team"
+          " \xB7 you'll get a confirmation email once this is logged."
         ] })
       ] }),
       /* @__PURE__ */ jsxs(DialogFooter, { children: [
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "outline",
-            onClick: () => setFeedbackDialogOpen(false),
-            children: "Cancel"
-          }
-        ),
+        /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: () => setFeedbackOpen(false), children: "Cancel" }),
         /* @__PURE__ */ jsxs(
           Button,
           {
-            onClick: handleFeedbackSubmit,
-            disabled: submitting || !feedbackDescription.trim(),
+            onClick: submitFeedback,
+            disabled: submitting || !details.trim(),
             className: "gap-2",
             style: {
-              backgroundColor: selectedFeedbackCategory === "problem" ? "#EF4444" : "#8C34E9",
+              backgroundColor: category === "problem" ? "#EF4444" : "#8C34E9",
               color: "white"
             },
             children: [
               /* @__PURE__ */ jsx(Send, { className: "h-3.5 w-3.5" }),
-              submitting ? "Submitting..." : "Submit"
+              submitting ? "Submitting\u2026" : "Submit"
             ]
           }
         )
@@ -432,6 +381,14 @@ function ReportingToolbar({
 }
 
 // src/reporting/index.ts
+var OPLYTICS_SERVICES = [
+  { slug: "sqdcp", label: "SQDCP" },
+  { slug: "oee-manager", label: "OEE Manager" },
+  { slug: "action-manager", label: "Action Manager" },
+  { slug: "policy-deployment", label: "Policy Deployment" },
+  { slug: "connect", label: "Connect" },
+  { slug: "portal", label: "Portal" }
+];
 var REPORT_BUTTONS = [
   {
     category: "safety",
@@ -481,10 +438,40 @@ function createReportingConfig(moduleName, handlers) {
     ...handlers
   };
 }
+var FEEDBACK_SCREENSHOT_MAX_BYTES = 300 * 1024;
+function isAcceptableScreenshot(file, maxBytes = FEEDBACK_SCREENSHOT_MAX_BYTES) {
+  if (!file.type.startsWith("image/")) {
+    return { ok: false, reason: "Please choose an image file." };
+  }
+  if (file.size > maxBytes) {
+    return {
+      ok: false,
+      reason: `Image is too large (max ${Math.round(maxBytes / 1024)} KB).`
+    };
+  }
+  return { ok: true };
+}
+function readFileAsScreenshot(file) {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onerror = () => reject(new Error("Could not read the file."));
+    reader.onload = () => {
+      const result = String(reader.result || "");
+      const comma = result.indexOf(",");
+      const dataBase64 = comma >= 0 ? result.slice(comma + 1) : result;
+      resolve({ dataBase64, mime: file.type || "image/png" });
+    };
+    reader.readAsDataURL(file);
+  });
+}
 export {
   FEEDBACK_BUTTONS,
+  FEEDBACK_SCREENSHOT_MAX_BYTES,
+  OPLYTICS_SERVICES,
   REPORT_BUTTONS,
   ReportingToolbar,
-  createReportingConfig
+  createReportingConfig,
+  isAcceptableScreenshot,
+  readFileAsScreenshot
 };
 //# sourceMappingURL=index.js.map