@visns-studio/visns-components 5.8.10 → 5.8.12

package/package.json

@@ -20,12 +20,12 @@
         "dayjs": "^1.11.13",
         "fabric": "^6.6.5",
         "file-saver": "^2.0.5",
-        "framer-motion": "^12.11.3",
+        "framer-motion": "^12.12.1",
         "html-react-parser": "^5.2.5",
         "lodash": "^4.17.21",
         "lodash.debounce": "^4.0.8",
         "moment": "^2.30.1",
-        "motion": "^12.11.3",
+        "motion": "^12.12.1",
         "numeral": "^2.0.6",
         "pluralize": "^8.0.0",
         "qrcode.react": "^4.2.0",
@@ -41,7 +41,7 @@
         "react-promise-tracker": "^2.1.1",
         "react-quill": "^2.0.0",
         "react-reveal": "^1.2.2",
-        "react-router-dom": "^6.30.0",
+        "react-router-dom": "^6.30.1",
         "react-select": "^5.10.1",
         "react-signature-pad-wrapper": "^4.1.0",
         "react-slugify": "^4.0.1",
@@ -54,13 +54,13 @@
         "reactjs-popup": "^2.0.6",
         "style-loader": "^4.0.0",
         "swapy": "^1.0.5",
-        "sweetalert2": "^11.21.0",
+        "sweetalert2": "^11.21.2",
         "truncate": "^3.0.0",
         "uuid": "^11.1.0",
         "validator": "^13.15.0",
         "vite": "^6.3.5",
         "yarn": "^1.22.22",
-        "yet-another-react-lightbox": "^3.23.1"
+        "yet-another-react-lightbox": "^3.23.2"
     },
     "devDependencies": {
         "@babel/core": "^7.27.1",
@@ -74,7 +74,7 @@
         "mini-css-extract-plugin": "^2.9.2",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
-        "sass": "^1.88.0",
+        "sass": "^1.89.0",
         "sass-loader": "^16.0.5"
     },
     "peerDependencies": {
@@ -82,7 +82,7 @@
         "react-dom": "^17.0.0 || ^18.0.0"
     },
     "name": "@visns-studio/visns-components",
-    "version": "5.8.10",
+    "version": "5.8.12",
     "description": "Various packages to assist in the development of our Custom Applications.",
     "main": "src/index.js",
     "files": [

package/src/components/crm/generic/ConfirmationDialog.jsx

@@ -0,0 +1,97 @@
+import React from 'react';
+import Swal from 'sweetalert2';
+import './styles/SweetAlert.module.css';
+
+/**
+ * A utility function that uses SweetAlert2 for confirmation dialogs
+ *
+ * @param {Object} options - Configuration options
+ * @param {string} options.title - The title of the confirmation dialog
+ * @param {string} options.message - The message to display in the dialog
+ * @param {string} options.confirmLabel - Label for the confirm button
+ * @param {string} options.cancelLabel - Label for the cancel button
+ * @param {Function} options.onConfirm - Function to call when confirmed
+ * @param {Function} options.onCancel - Function to call when cancelled
+ * @param {Object} options.data - Optional data object to pass to the dialog
+ * @returns {Promise} - A promise that resolves when the dialog is closed
+ */
+export const showConfirmDialog = ({
+    title = 'Confirm',
+    message = 'Are you sure?',
+    confirmLabel = 'Yes',
+    cancelLabel = 'No',
+    onConfirm = () => {},
+    onCancel = () => {},
+    data = null,
+}) => {
+    // Enhanced message with item details if available
+    let enhancedMessage = message;
+    let itemDetails = '';
+
+    // Extract meaningful information from the data object if available
+    if (data) {
+        // Common identifiers that might be present in data objects
+        const identifiers = [
+            'name',
+            'label',
+            'title',
+            'email',
+            'username',
+            'id',
+            'code',
+            'reference',
+            'description',
+        ];
+
+        // Find the first available identifier
+        for (const id of identifiers) {
+            if (
+                data[id] &&
+                typeof data[id] === 'string' &&
+                data[id].trim() !== ''
+            ) {
+                itemDetails = data[id];
+                break;
+            }
+        }
+
+        // If we found an identifier, enhance the message
+        if (itemDetails && !message.includes(itemDetails)) {
+            // If the message already contains a question mark, add the details before it
+            if (message.includes('?')) {
+                enhancedMessage = message.replace('?', `"${itemDetails}"?`);
+            } else {
+                // Otherwise, append the details
+                enhancedMessage = `${message} "${itemDetails}"`;
+            }
+        }
+    }
+
+    // Configure SweetAlert2 options
+    const swalOptions = {
+        title: title,
+        html: enhancedMessage,
+        icon: 'question',
+        showCancelButton: true,
+        confirmButtonText: confirmLabel,
+        cancelButtonText: cancelLabel,
+        confirmButtonColor: 'var(--primary-color, #4f46e5)',
+        cancelButtonColor: '#6b7280',
+        allowOutsideClick: true,
+        allowEscapeKey: true,
+        reverseButtons: true,
+        focusCancel: false,
+        buttonsStyling: true,
+    };
+
+    // Show SweetAlert2 dialog
+    return Swal.fire(swalOptions).then((result) => {
+        if (result.isConfirmed) {
+            onConfirm();
+        } else if (result.dismiss === Swal.DismissReason.cancel) {
+            onCancel();
+        }
+    });
+};
+
+export default showConfirmDialog;