analytica-frontend-lib 1.3.72 → 1.3.73

package/dist/AlertManager/index.js

@@ -823,7 +823,7 @@ __export(AlertsManager_exports, {
   AlertsManager: () => AlertsManager
 });
 module.exports = __toCommonJS(AlertsManager_exports);
-var import_react21 = require("react");
+var import_react22 = require("react");
 
 // src/index.ts
 init_Text();
@@ -6155,14 +6155,20 @@ function applyChainedAutoSelection(categories) {
 var import_phosphor_react13 = require("phosphor-react");
 
 // src/components/AlertManager/AlertSteps/MessageStep.tsx
+var import_react19 = require("react");
 var import_shallow = require("zustand/react/shallow");
 init_Input();
 init_TextArea();
+init_Text();
 var import_jsx_runtime25 = require("react/jsx-runtime");
+var ACCEPTED_IMAGE_EXTENSIONS = "image/jpeg,image/png,image/gif,image/webp,image/svg+xml,.jpg,.jpeg,.png,.gif,.webp,.svg";
+var MAX_IMAGE_SIZE_BYTES = 5 * 1024 * 1024;
+var MAX_IMAGE_SIZE_LABEL = "5MB";
 var MessageStep = ({
   labels,
   allowImageAttachment = true
 }) => {
+  const [imageError, setImageError] = (0, import_react19.useState)(null);
   const { title, message, image, setTitle, setMessage, setImage } = useAlertFormStore(
     (0, import_shallow.useShallow)((state) => ({
       title: state.title,
@@ -6174,11 +6180,23 @@ var MessageStep = ({
     }))
   );
   const handleFileSelect = (file) => {
+    setImageError(null);
     setImage(file);
   };
   const handleRemoveFile = () => {
+    setImageError(null);
     setImage(null);
   };
+  const handleTypeError = () => {
+    setImageError(
+      "Formato de imagem n\xE3o suportado. Use jpg, jpeg, png, gif, webp ou svg."
+    );
+  };
+  const handleSizeError = () => {
+    setImageError(
+      `Imagem muito grande. O tamanho m\xE1ximo permitido \xE9 ${MAX_IMAGE_SIZE_LABEL}.`
+    );
+  };
   const isImageFile = image instanceof File;
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("section", { className: "flex flex-col gap-4", children: [
     /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
@@ -6202,19 +6220,26 @@ var MessageStep = ({
         onChange: (e) => setMessage(e.target.value)
       }
     ),
-    allowImageAttachment && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
-      ImageUpload,
-      {
-        selectedFile: isImageFile ? image : null,
-        onFileSelect: handleFileSelect,
-        onRemoveFile: handleRemoveFile
-      }
-    )
+    allowImageAttachment && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        ImageUpload,
+        {
+          selectedFile: isImageFile ? image : null,
+          onFileSelect: handleFileSelect,
+          onRemoveFile: handleRemoveFile,
+          accept: ACCEPTED_IMAGE_EXTENSIONS,
+          maxSize: MAX_IMAGE_SIZE_BYTES,
+          onTypeError: handleTypeError,
+          onSizeError: handleSizeError
+        }
+      ),
+      imageError && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text_default, { size: "sm", className: "text-error-600", role: "alert", children: imageError })
+    ] })
   ] });
 };
 
 // src/components/AlertManager/AlertSteps/RecipientsStep.tsx
-var import_react19 = require("react");
+var import_react20 = require("react");
 var import_jsx_runtime26 = require("react/jsx-runtime");
 var RecipientsStep = ({
   categories,
@@ -6222,7 +6247,7 @@ var RecipientsStep = ({
   onCategoriesChange
 }) => {
   const { recipientCategories, initializeCategory } = useAlertFormStore();
-  (0, import_react19.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     for (const category of categories) {
       const existingCategory = recipientCategories[category.key];
       if (!existingCategory) {
@@ -6252,7 +6277,7 @@ var RecipientsStep = ({
       onCategoriesChange(updatedCategories);
     }
   };
-  const syncedCategories = (0, import_react19.useMemo)(() => {
+  const syncedCategories = (0, import_react20.useMemo)(() => {
     return categories.map((category) => {
       const storeCategory = recipientCategories[category.key];
       if (storeCategory) {
@@ -6337,13 +6362,13 @@ var DateStep = ({
 };
 
 // src/components/AlertManager/AlertSteps/PreviewStep.tsx
-var import_react20 = require("react");
+var import_react21 = require("react");
 var import_jsx_runtime28 = require("react/jsx-runtime");
 var PreviewStep = ({ imageLink, defaultImage }) => {
   const title = useAlertFormStore((state) => state.title);
   const message = useAlertFormStore((state) => state.message);
   const image = useAlertFormStore((state) => state.image);
-  const imageUrl = (0, import_react20.useMemo)(() => {
+  const imageUrl = (0, import_react21.useMemo)(() => {
     if (globalThis.window === void 0) {
       return void 0;
     }
@@ -6355,7 +6380,7 @@ var PreviewStep = ({ imageLink, defaultImage }) => {
     }
     return void 0;
   }, [image]);
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     return () => {
       if (globalThis.window !== void 0 && imageUrl && image instanceof File) {
         URL.revokeObjectURL(imageUrl);
@@ -6462,29 +6487,29 @@ var AlertsManager = ({
   imageLink,
   defaultImage
 }) => {
-  const [isModalOpen, setIsModalOpen] = (0, import_react21.useState)(isOpen);
-  const [currentStep, setCurrentStep] = (0, import_react21.useState)(0);
-  const [completedSteps, setCompletedSteps] = (0, import_react21.useState)([]);
-  const [categories, setCategories] = (0, import_react21.useState)(config.categories);
-  const formData = (0, import_react21.useSyncExternalStore)(
+  const [isModalOpen, setIsModalOpen] = (0, import_react22.useState)(isOpen);
+  const [currentStep, setCurrentStep] = (0, import_react22.useState)(0);
+  const [completedSteps, setCompletedSteps] = (0, import_react22.useState)([]);
+  const [categories, setCategories] = (0, import_react22.useState)(config.categories);
+  const formData = (0, import_react22.useSyncExternalStore)(
     useAlertFormStore.subscribe,
     useAlertFormStore.getState
   );
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     setIsModalOpen(isOpen);
   }, [isOpen]);
-  const categoriesInitializedRef = (0, import_react21.useRef)(false);
+  const categoriesInitializedRef = (0, import_react22.useRef)(false);
   const { labels, behavior, steps: customSteps } = config;
   const { handleCategoriesChange: baseHandleCategoriesChange } = useDynamicStudentFetching(setCategories, {
     fetchStudentsByFilters: behavior?.fetchStudentsByFilters
   });
-  const handleCategoriesChange = (0, import_react21.useCallback)(
+  const handleCategoriesChange = (0, import_react22.useCallback)(
     async (updatedCategories) => {
       await baseHandleCategoriesChange(updatedCategories);
     },
     [baseHandleCategoriesChange]
   );
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     if (isModalOpen && config.categories.length > 0 && !categoriesInitializedRef.current) {
       const autoSelectedCategories = applyChainedAutoSelection(
         config.categories
@@ -6499,7 +6524,7 @@ var AlertsManager = ({
     applyChainedAutoSelection,
     handleCategoriesChange
   ]);
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     if (!isModalOpen) {
       categoriesInitializedRef.current = false;
     }
@@ -6531,7 +6556,7 @@ var AlertsManager = ({
     setIsModalOpen(false);
     onClose?.();
   };
-  const isCurrentStepValid2 = (0, import_react21.useCallback)(() => {
+  const isCurrentStepValid2 = (0, import_react22.useCallback)(() => {
     return isCurrentStepValid(
       currentStep,
       formData,
@@ -6539,10 +6564,10 @@ var AlertsManager = ({
       customSteps
     );
   }, [currentStep, categories, customSteps, formData]);
-  const canFinish2 = (0, import_react21.useCallback)(() => {
+  const canFinish2 = (0, import_react22.useCallback)(() => {
     return canFinish(formData, categories);
   }, [categories, formData]);
-  const handleNext2 = (0, import_react21.useCallback)(() => {
+  const handleNext2 = (0, import_react22.useCallback)(() => {
     const result = handleNext({
       currentStep,
       steps,
@@ -6566,7 +6591,7 @@ var AlertsManager = ({
     setCurrentStep,
     formData
   ]);
-  const handlePrevious = (0, import_react21.useCallback)(() => {
+  const handlePrevious = (0, import_react22.useCallback)(() => {
     if (currentStep > 0) {
       setCurrentStep(currentStep - 1);
     }
@@ -6616,7 +6641,7 @@ var AlertsManager = ({
       return { ...step, state: "pending" };
     }
   );
-  const currentStepContent = (0, import_react21.useMemo)(() => {
+  const currentStepContent = (0, import_react22.useMemo)(() => {
     if (customSteps?.[currentStep]?.component) {
       const CustomComponent = customSteps[currentStep].component;
       return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(StepWrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(CustomComponent, { onNext: handleNext2, onPrevious: handlePrevious }) });