@solidxai/core-ui 0.1.13-beta.2 → 0.1.13-beta.3

package/dist/components/core/form/fields/SolidMediaSingleField.tsx

@@ -21,6 +21,8 @@ import { FileReaderExt } from "../../../../components/common/FileReaderExt";
 import getAcceptedFileTypes from "../../../../helpers/getAcceptedFileTypes";
 import { downloadMediaFile } from "../../../../helpers/downloadMediaFile";
 import { getExtensionComponent } from "../../../../helpers/registry";
+import { openMediaInNewTab } from "../../../../helpers/mediaUrl";
+import { getMediaPreviewKind, isLightboxMediaKind } from "../../../../helpers/mediaType";
 import { SolidMediaFormFieldWidgetProps } from "../../../../types/solid-core";
 import { SolidFieldTooltip } from "../../../../components/common/SolidFieldTooltip";
 import { ERROR_MESSAGES } from "../../../../constants/error-messages";
@@ -28,6 +30,13 @@ import styles from "./solidFields.module.css";
 import { SolidIcon } from "../../../shad-cn-ui";
 import { getPersistedMediaId } from "./mediaFieldUtils";
 
+type SingleMediaFileDetail = {
+    name: string;
+    type: string;
+    fileUrl: string;
+    fileSize: number;
+};
+
 export class SolidMediaSingleField implements ISolidField {
 
     private fieldContext: SolidFieldProps;
@@ -170,7 +179,7 @@ export const DefaultMediaSingleFormEditWidget = ({ formik, fieldContext, setLigh
     const isFieldReadonly = formReadonly || fieldReadonly || readOnlyPermission;
 
     const [isDeleteImageDialogVisible, setDeleteImageDialogVisible] = useState(false);
-    const [fileDetails, setFileDetails] = useState<{ name: string; type: string, fileUrl: string, fileSize: number } | null>(null);
+    const [fileDetails, setFileDetails] = useState<SingleMediaFileDetail | null>(null);
     const [isReplaceImageDialogVisible, setReplaceImageDialogVisible] = useState(false);
     const [newFileToUpload, setNewFileToUpload] = useState<any>(null);
     const [fileSizeError, setFileSizeError] = useState<string | null>(null);
@@ -272,34 +281,38 @@ export const DefaultMediaSingleFormEditWidget = ({ formik, fieldContext, setLigh
 
     useEffect(() => {
         const fieldValue = formik?.values[fieldLayoutInfo.attrs.name];
+        if (!fieldValue || typeof fieldValue !== "object") {
+            setFileDetails(null);
+            return;
+        }
 
-        if (fieldValue && typeof fieldValue === "object") {
-            let fileUrl = "";
-            let fileName = "Unknown File";
-            let fileSize = 0;
-
-            if (fieldValue instanceof File) {
-                fileUrl = URL.createObjectURL(fieldValue);
-                fileName = fieldValue.name;
-                fileSize = fieldValue.size;
-            } else if (fieldValue._full_url) {
-                fileUrl = fieldValue._full_url;
-                fileName = fieldValue.originalFileName;
-                fileSize = fieldValue.fileSize;
-            }
-
+        if (fieldValue instanceof File) {
+            const fileUrl = URL.createObjectURL(fieldValue);
             setFileDetails({
-                name: fileName,
-                type: fieldValue.mimeType ? fieldValue.mimeType : fieldValue.type,
+                name: fieldValue.name,
+                type: fieldValue.type,
                 fileUrl,
-                fileSize
+                fileSize: fieldValue.size,
             });
 
-            // Ensure formik has the correct value
             formik.setFieldValue(fieldLayoutInfo.attrs.name, fieldValue);
-        } else {
+            return () => URL.revokeObjectURL(fileUrl);
+        }
+
+        const fileUrl = fieldValue._full_url;
+        if (!fileUrl) {
             setFileDetails(null);
+            return;
         }
+
+        setFileDetails({
+            name: fieldValue.originalFileName,
+            type: fieldValue.mimeType ? fieldValue.mimeType : fieldValue.type,
+            fileUrl,
+            fileSize: fieldValue.fileSize,
+        });
+
+        formik.setFieldValue(fieldLayoutInfo.attrs.name, fieldValue);
     }, [formik.values, fieldLayoutInfo.attrs.name]);
 
     const {
@@ -332,32 +345,25 @@ export const DefaultMediaSingleFormEditWidget = ({ formik, fieldContext, setLigh
     }
 
     const handleFileView = (url: any) => {
-        const downloadOnlyExt = [
-            "txt", "zip", "rar",
-            "doc", "docx",
-            "xls", "xlsx",
-            "ppt", "pptx"
-        ];
-
-        const fileUrl = url?.fileUrl || "";
-        const cleanUrl = fileUrl.split("?")[0];
-        const ext = cleanUrl.split(".").pop()?.toLowerCase();
-
-        if (ext && downloadOnlyExt.includes(ext)) {
-            const link = document.createElement('a');
-            link.href = url.fileUrl;
-            link.download = ''; // or specify a file name like 'file.pdf'
-            link.target = '_blank';
-            document.body.appendChild(link);
-            link.click();
-            document.body.removeChild(link);
+        const previewKind = getMediaPreviewKind({
+            url: url?.fileUrl,
+            fileName: url?.name,
+            mimeType: url?.type,
+        });
 
-        } else {
+        if (isLightboxMediaKind(previewKind)) {
             setLightboxUrls?.([
-                { src: url.fileUrl, downloadUrl: url.fileUrl },
+                {
+                    src: url.fileUrl,
+                    downloadUrl: url.fileUrl,
+                    type: previewKind === "video" ? "video" : undefined
+                },
             ]);
             setOpenLightbox?.(true);
+            return;
         }
+
+        openMediaInNewTab(url?.fileUrl);
     }
 
 
@@ -412,7 +418,11 @@ export const DefaultMediaSingleFormEditWidget = ({ formik, fieldContext, setLigh
                                             className="solid-file-icon-btn"
                                             disabled={isFieldDisabled || isFieldReadonly}
                                             aria-label="Download file"
-                                            onClick={() => downloadMediaFile(fileDetails?.fileUrl, fileDetails?.name)}
+                                            onClick={(event) => {
+                                                event.preventDefault();
+                                                event.stopPropagation();
+                                                downloadMediaFile(fileDetails?.fileUrl, fileDetails?.name);
+                                            }}
                                         >
                                             <SolidIcon name="si-download" aria-hidden />
                                         </button>
@@ -484,7 +494,7 @@ export const DefaultMediaSingleFormEditWidget = ({ formik, fieldContext, setLigh
 }
 
 export const DefaultMediaSingleFormViewWidget = ({ formik, fieldContext, setLightboxUrls, setOpenLightbox }: SolidMediaFormFieldWidgetProps) => {
-    const [fileDetails, setFileDetails] = useState<{ name: string; type: string, fileUrl: string, fileSize: number } | null>(null);
+    const [fileDetails, setFileDetails] = useState<SingleMediaFileDetail | null>(null);
     const fieldMetadata = fieldContext.fieldMetadata;
     const fieldLayoutInfo = fieldContext.field;
     const className = fieldLayoutInfo.attrs?.className || 'field w-full px-2 pt-2';
@@ -502,60 +512,57 @@ export const DefaultMediaSingleFormViewWidget = ({ formik, fieldContext, setLigh
 
     useEffect(() => {
         const fieldValue = formik?.values[fieldLayoutInfo.attrs.name];
+        if (!fieldValue || typeof fieldValue !== "object") {
+            setFileDetails(null);
+            return;
+        }
 
-        if (fieldValue && typeof fieldValue === "object") {
-            let fileUrl = "";
-            let fileName = "Unknown File";
-            let fileSize = 0;
-
-            if (fieldValue instanceof File) {
-                fileUrl = URL.createObjectURL(fieldValue);
-                fileName = fieldValue.name;
-                fileSize = fieldValue.size;
-            } else if (fieldValue._full_url) {
-                fileUrl = fieldValue._full_url;
-                fileName = fieldValue.originalFileName;
-                fileSize = fieldValue.fileSize;
-            }
-
+        if (fieldValue instanceof File) {
+            const fileUrl = URL.createObjectURL(fieldValue);
             setFileDetails({
-                name: fileName,
-                type: fieldValue.mimeType ? fieldValue.mimeType : fieldValue.type,
+                name: fieldValue.name,
+                type: fieldValue.type,
                 fileUrl,
-                fileSize
+                fileSize: fieldValue.size,
             });
-            // Ensure formik has the correct value
-            formik.setFieldValue(fieldLayoutInfo.attrs.name, fieldValue);
+
+            return () => URL.revokeObjectURL(fileUrl);
+        }
+
+        const fileUrl = fieldValue._full_url;
+        if (!fileUrl) {
+            setFileDetails(null);
+            return;
         }
+
+        setFileDetails({
+            name: fieldValue.originalFileName,
+            type: fieldValue.mimeType ? fieldValue.mimeType : fieldValue.type,
+            fileUrl,
+            fileSize: fieldValue.fileSize,
+        });
     }, [formik.values, fieldLayoutInfo.attrs.name]);
 
     const handleFileView = (url: any) => {
-        const downloadOnlyExt = [
-            "txt", "zip", "rar",
-            "doc", "docx",
-            "xls", "xlsx",
-            "ppt", "pptx"
-        ];
-
-        const fileUrl = url?.fileUrl || "";
-        const cleanUrl = fileUrl.split("?")[0];
-        const ext = cleanUrl.split(".").pop()?.toLowerCase();
-
-        if (ext && downloadOnlyExt.includes(ext)) {
-            const link = document.createElement('a');
-            link.href = url.fileUrl;
-            link.download = ''; // or specify a file name like 'file.pdf'
-            link.target = '_blank';
-            document.body.appendChild(link);
-            link.click();
-            document.body.removeChild(link);
+        const previewKind = getMediaPreviewKind({
+            url: url?.fileUrl,
+            fileName: url?.name,
+            mimeType: url?.type,
+        });
 
-        } else {
+        if (isLightboxMediaKind(previewKind)) {
             setLightboxUrls?.([
-                { src: url.fileUrl, downloadUrl: url.fileUrl },
+                {
+                    src: url.fileUrl,
+                    downloadUrl: url.fileUrl,
+                    type: previewKind === "video" ? "video" : undefined
+                },
             ]);
             setOpenLightbox?.(true);
+            return;
         }
+
+        openMediaInNewTab(url?.fileUrl);
     }
 
     return (
@@ -585,7 +592,11 @@ export const DefaultMediaSingleFormViewWidget = ({ formik, fieldContext, setLigh
                                         type="button"
                                         className="solid-file-icon-btn"
                                         aria-label="Download file"
-                                        onClick={() => downloadMediaFile(fileDetails?.fileUrl, fileDetails?.name)}
+                                        onClick={(event) => {
+                                            event.preventDefault();
+                                            event.stopPropagation();
+                                            downloadMediaFile(fileDetails?.fileUrl, fileDetails?.name);
+                                        }}
                                     >
                                         <SolidIcon name="si-download" aria-hidden />
                                     </button>

package/dist/components/core/form/fields/widgets/SolidChatterMessageCoModelEntityIdFormViewWidget.d.ts

@@ -0,0 +1,3 @@
+import { SolidFormFieldWidgetProps } from "../../../../../types/solid-core";
+export declare const SolidChatterMessageCoModelEntityIdFormViewWidget: ({ formik, fieldContext }: SolidFormFieldWidgetProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SolidChatterMessageCoModelEntityIdFormViewWidget.d.ts.map

package/dist/components/core/form/fields/widgets/SolidChatterMessageCoModelEntityIdFormViewWidget.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidChatterMessageCoModelEntityIdFormViewWidget.d.ts","sourceRoot":"","sources":["../../../../../../src/components/core/form/fields/widgets/SolidChatterMessageCoModelEntityIdFormViewWidget.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,yBAAyB,EAAE,MAAM,iCAAiC,CAAC;AAK5E,eAAO,MAAM,gDAAgD,6BAA8B,yBAAyB,4CA6DnH,CAAC"}

package/dist/components/core/form/fields/widgets/SolidChatterMessageCoModelEntityIdFormViewWidget.js

@@ -0,0 +1,92 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { ExternalLink } from "lucide-react";
+import { solidGet } from "../../../../../http/solidHttp";
+import { snakeCase } from "lodash";
+export var SolidChatterMessageCoModelEntityIdFormViewWidget = function (_a) {
+    var _b, _c, _d, _e, _f, _g;
+    var formik = _a.formik, fieldContext = _a.fieldContext;
+    var fieldMetadata = fieldContext.fieldMetadata;
+    var fieldLayoutInfo = fieldContext.field;
+    var fieldLabel = (_b = fieldLayoutInfo.attrs.label) !== null && _b !== void 0 ? _b : fieldMetadata.displayName;
+    var fieldName = (_c = fieldLayoutInfo === null || fieldLayoutInfo === void 0 ? void 0 : fieldLayoutInfo.attrs) === null || _c === void 0 ? void 0 : _c.name;
+    var _h = useState('#'), redirectUrl = _h[0], setRedirectUrl = _h[1];
+    var value = (_d = formik.values) === null || _d === void 0 ? void 0 : _d[fieldName];
+    var coModelName = (_e = fieldContext === null || fieldContext === void 0 ? void 0 : fieldContext.data) === null || _e === void 0 ? void 0 : _e.coModelName;
+    var modelDisplayName = (_f = fieldContext === null || fieldContext === void 0 ? void 0 : fieldContext.data) === null || _f === void 0 ? void 0 : _f.modelDisplayName;
+    var modelUserKey = (_g = fieldContext === null || fieldContext === void 0 ? void 0 : fieldContext.data) === null || _g === void 0 ? void 0 : _g.modelUserKey;
+    useEffect(function () {
+        if (coModelName) {
+            var fetchModel = function () { return __awaiter(void 0, void 0, void 0, function () {
+                var qs, res, model, module_1, moduleName, modelSingularName, modelSlug, redirectUrl_1;
+                var _a, _b, _c, _d, _e;
+                return __generator(this, function (_f) {
+                    switch (_f.label) {
+                        case 0:
+                            qs = "offset=0&limit=25&filters[$and][0][$or][0][singularName][$eq]=".concat(coModelName, "&populate[0]=module&locale=en&sort[0]=id%3Adesc");
+                            return [4 /*yield*/, solidGet("/model-metadata?".concat(qs))];
+                        case 1:
+                            res = _f.sent();
+                            if (((_c = (_b = (_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.records) === null || _c === void 0 ? void 0 : _c.length) > 0) {
+                                model = (_e = (_d = res === null || res === void 0 ? void 0 : res.data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.records[0];
+                                module_1 = model === null || model === void 0 ? void 0 : model.module;
+                                moduleName = module_1 === null || module_1 === void 0 ? void 0 : module_1.name;
+                                modelSingularName = model === null || model === void 0 ? void 0 : model.singularName;
+                                modelSlug = snakeCase(model === null || model === void 0 ? void 0 : model.singularName).replace(/_/g, '-');
+                                redirectUrl_1 = "/admin/core/".concat(moduleName, "/").concat(modelSlug, "/form/").concat(value);
+                                setRedirectUrl(redirectUrl_1);
+                            }
+                            return [2 /*return*/];
+                    }
+                });
+            }); };
+            fetchModel();
+        }
+    }, [coModelName]);
+    return (_jsxs("div", { children: [_jsx("label", { className: "form-field-label", children: fieldLabel }), _jsx("div", { className: "mt-2", children: value ? (_jsxs("a", { href: redirectUrl, target: "_blank", rel: "noopener noreferrer", style: {
+                        display: 'inline-flex',
+                        alignItems: 'center',
+                        gap: '6px',
+                        textDecoration: 'none',
+                        fontSize: '12px',
+                        color: '#2563eb',
+                        fontWeight: 500
+                    }, children: [_jsxs("span", { children: [value, " (", modelUserKey || modelDisplayName || coModelName, ")"] }), _jsx(ExternalLink, { size: 16 })] })) : (_jsx("span", { className: "text-muted", children: "\u2014" })) })] }));
+};
+//# sourceMappingURL=SolidChatterMessageCoModelEntityIdFormViewWidget.js.map

package/dist/components/core/form/fields/widgets/SolidChatterMessageCoModelEntityIdFormViewWidget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidChatterMessageCoModelEntityIdFormViewWidget.js","sourceRoot":"","sources":["../../../../../../src/components/core/form/fields/widgets/SolidChatterMessageCoModelEntityIdFormViewWidget.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAEnC,MAAM,CAAC,IAAM,gDAAgD,GAAG,UAAC,EAAmD;;QAAjD,MAAM,YAAA,EAAE,YAAY,kBAAA;IACnF,IAAM,aAAa,GAAG,YAAY,CAAC,aAAa,CAAC;IACjD,IAAM,eAAe,GAAG,YAAY,CAAC,KAAK,CAAC;IAE3C,IAAM,UAAU,GAAG,MAAA,eAAe,CAAC,KAAK,CAAC,KAAK,mCAAI,aAAa,CAAC,WAAW,CAAC;IAC5E,IAAM,SAAS,GAAG,MAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,KAAK,0CAAE,IAAI,CAAC;IAEzC,IAAA,KAAgC,QAAQ,CAAS,GAAG,CAAC,EAApD,WAAW,QAAA,EAAE,cAAc,QAAyB,CAAC;IAC5D,IAAM,KAAK,GAAG,MAAA,MAAM,CAAC,MAAM,0CAAG,SAAS,CAAC,CAAC;IAEzC,IAAM,WAAW,GAAG,MAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,0CAAE,WAAW,CAAC;IACpD,IAAM,gBAAgB,GAAG,MAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,0CAAE,gBAAgB,CAAC;IAC9D,IAAM,YAAY,GAAG,MAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,0CAAE,YAAY,CAAC;IAEtD,SAAS,CAAC;QACN,IAAI,WAAW,EAAE;YACb,IAAM,UAAU,GAAG;;;;;;4BACT,EAAE,GAAG,wEAAiE,WAAW,oDAAiD,CAAC;4BAC7H,qBAAM,QAAQ,CAAC,0BAAmB,EAAE,CAAE,CAAC,EAAA;;4BAA7C,GAAG,GAAG,SAAuC;4BACnD,IAAI,CAAA,MAAA,MAAA,MAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,IAAI,0CAAE,IAAI,0CAAE,OAAO,0CAAE,MAAM,IAAG,CAAC,EAAE;gCAChC,KAAK,GAAG,MAAA,MAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,IAAI,0CAAE,IAAI,0CAAE,OAAO,CAAC,CAAC,CAAC,CAAC;gCACpC,WAAS,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,CAAC;gCACvB,UAAU,GAAG,QAAM,aAAN,QAAM,uBAAN,QAAM,CAAE,IAAI,CAAC;gCAC1B,iBAAiB,GAAG,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,YAAY,CAAC;gCACxC,SAAS,GAAG,SAAS,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,YAAY,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;gCAC9D,gBAAc,sBAAe,UAAU,cAAI,SAAS,mBAAS,KAAK,CAAE,CAAC;gCAC3E,cAAc,CAAC,aAAW,CAAC,CAAC;6BAC/B;;;;iBACJ,CAAA;YACD,UAAU,EAAE,CAAC;SAChB;IACL,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,OAAO,CACH,0BACI,gBAAO,SAAS,EAAC,kBAAkB,YAAE,UAAU,GAAS,EACxD,cAAK,SAAS,EAAC,MAAM,YAChB,KAAK,CAAC,CAAC,CAAC,CACL,aACI,IAAI,EAAE,WAAW,EACjB,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,qBAAqB,EACzB,KAAK,EAAE;wBACH,OAAO,EAAE,aAAa;wBACtB,UAAU,EAAE,QAAQ;wBACpB,GAAG,EAAE,KAAK;wBACV,cAAc,EAAE,MAAM;wBACtB,QAAQ,EAAE,MAAM;wBAChB,KAAK,EAAE,SAAS;wBAChB,UAAU,EAAE,GAAG;qBAClB,aAED,2BAAO,KAAK,QAAI,YAAY,IAAI,gBAAgB,IAAI,WAAW,SAAS,EACxE,KAAC,YAAY,IAAC,IAAI,EAAE,EAAE,GAAI,IAC1B,CACP,CAAC,CAAC,CAAC,CACA,eAAM,SAAS,EAAC,YAAY,uBAAS,CACxC,GACC,IACJ,CACT,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { useEffect, useState } from \"react\";\nimport { SolidFormFieldWidgetProps } from \"../../../../../types/solid-core\";\nimport { ExternalLink } from \"lucide-react\";\nimport { solidGet } from \"../../../../../http/solidHttp\";\nimport { snakeCase } from \"lodash\";\n\nexport const SolidChatterMessageCoModelEntityIdFormViewWidget = ({ formik, fieldContext }: SolidFormFieldWidgetProps) => {\n    const fieldMetadata = fieldContext.fieldMetadata;\n    const fieldLayoutInfo = fieldContext.field;\n\n    const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;\n    const fieldName = fieldLayoutInfo?.attrs?.name;\n\n    const [redirectUrl, setRedirectUrl] = useState<string>('#');\n    const value = formik.values?.[fieldName];\n\n    const coModelName = fieldContext?.data?.coModelName;\n    const modelDisplayName = fieldContext?.data?.modelDisplayName;\n    const modelUserKey = fieldContext?.data?.modelUserKey;\n\n    useEffect(() => {\n        if (coModelName) {\n            const fetchModel = async () => {\n                const qs = `offset=0&limit=25&filters[$and][0][$or][0][singularName][$eq]=${coModelName}&populate[0]=module&locale=en&sort[0]=id%3Adesc`;\n                const res = await solidGet(`/model-metadata?${qs}`);\n                if (res?.data?.data?.records?.length > 0) {\n                    const model = res?.data?.data?.records[0];\n                    const module = model?.module;\n                    const moduleName = module?.name;\n                    const modelSingularName = model?.singularName;\n                    const modelSlug = snakeCase(model?.singularName).replace(/_/g, '-');\n                    const redirectUrl = `/admin/core/${moduleName}/${modelSlug}/form/${value}`;\n                    setRedirectUrl(redirectUrl);\n                }\n            }\n            fetchModel();\n        }\n    }, [coModelName]);\n\n    return (\n        <div>\n            <label className=\"form-field-label\">{fieldLabel}</label>\n            <div className=\"mt-2\">\n                {value ? (\n                    <a\n                        href={redirectUrl}\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        style={{\n                            display: 'inline-flex',\n                            alignItems: 'center',\n                            gap: '6px',\n                            textDecoration: 'none',\n                            fontSize: '12px',\n                            color: '#2563eb',\n                            fontWeight: 500\n                        }}\n                    >\n                        <span>{value} ({modelUserKey || modelDisplayName || coModelName})</span>\n                        <ExternalLink size={16} />\n                    </a>\n                ) : (\n                    <span className=\"text-muted\">—</span>\n                )}\n            </div>\n        </div>\n    );\n};"]}

package/dist/components/core/form/fields/widgets/SolidChatterMessageCoModelEntityIdFormViewWidget.tsx

@@ -0,0 +1,68 @@
+import { useEffect, useState } from "react";
+import { SolidFormFieldWidgetProps } from "../../../../../types/solid-core";
+import { ExternalLink } from "lucide-react";
+import { solidGet } from "../../../../../http/solidHttp";
+import { snakeCase } from "lodash";
+
+export const SolidChatterMessageCoModelEntityIdFormViewWidget = ({ formik, fieldContext }: SolidFormFieldWidgetProps) => {
+    const fieldMetadata = fieldContext.fieldMetadata;
+    const fieldLayoutInfo = fieldContext.field;
+
+    const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;
+    const fieldName = fieldLayoutInfo?.attrs?.name;
+
+    const [redirectUrl, setRedirectUrl] = useState<string>('#');
+    const value = formik.values?.[fieldName];
+
+    const coModelName = fieldContext?.data?.coModelName;
+    const modelDisplayName = fieldContext?.data?.modelDisplayName;
+    const modelUserKey = fieldContext?.data?.modelUserKey;
+
+    useEffect(() => {
+        if (coModelName) {
+            const fetchModel = async () => {
+                const qs = `offset=0&limit=25&filters[$and][0][$or][0][singularName][$eq]=${coModelName}&populate[0]=module&locale=en&sort[0]=id%3Adesc`;
+                const res = await solidGet(`/model-metadata?${qs}`);
+                if (res?.data?.data?.records?.length > 0) {
+                    const model = res?.data?.data?.records[0];
+                    const module = model?.module;
+                    const moduleName = module?.name;
+                    const modelSingularName = model?.singularName;
+                    const modelSlug = snakeCase(model?.singularName).replace(/_/g, '-');
+                    const redirectUrl = `/admin/core/${moduleName}/${modelSlug}/form/${value}`;
+                    setRedirectUrl(redirectUrl);
+                }
+            }
+            fetchModel();
+        }
+    }, [coModelName]);
+
+    return (
+        <div>
+            <label className="form-field-label">{fieldLabel}</label>
+            <div className="mt-2">
+                {value ? (
+                    <a
+                        href={redirectUrl}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        style={{
+                            display: 'inline-flex',
+                            alignItems: 'center',
+                            gap: '6px',
+                            textDecoration: 'none',
+                            fontSize: '12px',
+                            color: '#2563eb',
+                            fontWeight: 500
+                        }}
+                    >
+                        <span>{value} ({modelUserKey || modelDisplayName || coModelName})</span>
+                        <ExternalLink size={16} />
+                    </a>
+                ) : (
+                    <span className="text-muted">—</span>
+                )}
+            </div>
+        </div>
+    );
+};

package/dist/components/core/form/fields/widgets/SolidLovTypeChangeFormEditWidget.d.ts

@@ -0,0 +1,3 @@
+import { SolidFormFieldWidgetProps } from "../../../../../types/solid-core";
+export declare const SolidLovTypeChangeFormEditWidget: ({ formik, fieldContext }: SolidFormFieldWidgetProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SolidLovTypeChangeFormEditWidget.d.ts.map

package/dist/components/core/form/fields/widgets/SolidLovTypeChangeFormEditWidget.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidLovTypeChangeFormEditWidget.d.ts","sourceRoot":"","sources":["../../../../../../src/components/core/form/fields/widgets/SolidLovTypeChangeFormEditWidget.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,yBAAyB,EAAE,MAAM,iCAAiC,CAAC;AAM5E,eAAO,MAAM,gCAAgC,6BAG1C,yBAAyB,4CA+G3B,CAAC"}

package/dist/components/core/form/fields/widgets/SolidLovTypeChangeFormEditWidget.js

@@ -0,0 +1,111 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { solidGet } from "../../../../../http/solidHttp";
+import { SolidAutocomplete } from "../../../../../components/shad-cn-ui/SolidAutocomplete";
+import { SolidInput } from "../../../../../components/shad-cn-ui/SolidInput";
+import { SolidIcon } from "../../../../../components/shad-cn-ui/SolidIcon";
+export var SolidLovTypeChangeFormEditWidget = function (_a) {
+    var _b, _c, _d;
+    var formik = _a.formik, fieldContext = _a.fieldContext;
+    var fieldMetadata = fieldContext.fieldMetadata;
+    var fieldLayoutInfo = fieldContext.field;
+    var fieldLabel = (_b = fieldLayoutInfo.attrs.label) !== null && _b !== void 0 ? _b : fieldMetadata.displayName;
+    var fieldName = (_c = fieldLayoutInfo === null || fieldLayoutInfo === void 0 ? void 0 : fieldLayoutInfo.attrs) === null || _c === void 0 ? void 0 : _c.name;
+    var value = (_d = formik.values) === null || _d === void 0 ? void 0 : _d[fieldName];
+    // 🔹 UI State
+    var _e = useState([]), filteredOptions = _e[0], setFilteredOptions = _e[1];
+    var _f = useState(false), isCreating = _f[0], setIsCreating = _f[1];
+    var _g = useState(value || ""), inputValue = _g[0], setInputValue = _g[1];
+    // 🔹 Handle Autocommplete AJAX Fetching
+    var completeMethod = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, filterPart, res, extracted, err_1;
+        var _a, _b, _c;
+        return __generator(this, function (_d) {
+            switch (_d.label) {
+                case 0:
+                    _d.trys.push([0, 2, , 3]);
+                    query = event.query;
+                    filterPart = query
+                        ? "&filters[$and][0][$or][0][".concat(fieldName, "][$containsi]=%").concat(query, "%")
+                        : "";
+                    return [4 /*yield*/, solidGet("/api/list-of-values?&offset=0&limit=50&groupBy[0]=".concat(fieldName, "&aggregates[0]=id:count").concat(filterPart))];
+                case 1:
+                    res = _d.sent();
+                    extracted = ((_c = (_b = (_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.groupMeta) === null || _c === void 0 ? void 0 : _c.filter(function (item) { return item.groupValue != null; }).map(function (item) { return ({
+                        label: item.groupValue,
+                        value: item.groupValue
+                    }); })) || [];
+                    setFilteredOptions(extracted);
+                    return [3 /*break*/, 3];
+                case 2:
+                    err_1 = _d.sent();
+                    console.error("Failed to fetch autocomplete suggestions", err_1);
+                    setFilteredOptions([]);
+                    return [3 /*break*/, 3];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    // 🔹 Handle Change from Autocomplete
+    var handleAutocompleteChange = function (e) {
+        var _a;
+        var selectedValue = typeof e.value === "object" ? (_a = e.value) === null || _a === void 0 ? void 0 : _a.value : e.value;
+        formik.setFieldValue(fieldName, selectedValue);
+    };
+    // 🔹 Handle Input Submit (blur or enter)
+    var handleCreate = function () {
+        if (!inputValue.trim())
+            return;
+        formik.setFieldValue(fieldName, inputValue);
+        setIsCreating(false);
+    };
+    return (_jsxs("div", { className: "solid-lov-type-change-widget w-full", children: [_jsxs("div", { className: "flex align-items-center justify-between  mb-2", children: [_jsx("label", { className: "text-xs font-semibold text-muted-foreground uppercase tracking-wider", children: fieldLabel }), _jsxs("button", { type: "button", onClick: function () {
+                            setIsCreating(!isCreating);
+                            if (!isCreating)
+                                setInputValue("");
+                        }, style: { color: "blue", background: "transparent", border: 0 }, children: [_jsx(SolidIcon, { name: isCreating ? "si-times" : "si-plus", size: 12 }), _jsx("span", { children: isCreating ? "choose existing" : "add custom" })] })] }), _jsx("div", { className: "relative", children: !isCreating ? (_jsx(SolidAutocomplete, { value: value, suggestions: filteredOptions, completeMethod: completeMethod, onChange: handleAutocompleteChange, dropdown: true, placeholder: "Select ".concat(fieldLabel), className: "w-full" })) : (_jsx("div", { className: "flex gap-2", children: _jsx(SolidInput, { type: "text", value: inputValue, autoFocus: true, placeholder: "Enter new type", className: "flex-1 h-9", onChange: function (e) { return setInputValue(e.target.value); }, onBlur: handleCreate, onKeyDown: function (e) {
+                            if (e.key === "Enter") {
+                                handleCreate();
+                            }
+                            if (e.key === "Escape") {
+                                setIsCreating(false);
+                            }
+                        } }) })) })] }));
+};
+//# sourceMappingURL=SolidLovTypeChangeFormEditWidget.js.map

package/dist/components/core/form/fields/widgets/SolidLovTypeChangeFormEditWidget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidLovTypeChangeFormEditWidget.js","sourceRoot":"","sources":["../../../../../../src/components/core/form/fields/widgets/SolidLovTypeChangeFormEditWidget.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from \"react\";\nimport { SolidFormFieldWidgetProps } from \"../../../../../types/solid-core\";\nimport { solidGet } from \"../../../../../http/solidHttp\";\nimport { SolidAutocomplete } from \"../../../../../components/shad-cn-ui/SolidAutocomplete\";\nimport { SolidInput } from \"../../../../../components/shad-cn-ui/SolidInput\";\nimport { SolidIcon } from \"../../../../../components/shad-cn-ui/SolidIcon\";\n\nexport const SolidLovTypeChangeFormEditWidget = ({\n    formik,\n    fieldContext\n}: SolidFormFieldWidgetProps) => {\n    const fieldMetadata = fieldContext.fieldMetadata;\n    const fieldLayoutInfo = fieldContext.field;\n\n    const fieldLabel =\n        fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;\n    const fieldName = fieldLayoutInfo?.attrs?.name;\n\n    const value = formik.values?.[fieldName];\n\n    // 🔹 UI State\n    const [filteredOptions, setFilteredOptions] = useState<any[]>([]);\n    const [isCreating, setIsCreating] = useState(false);\n    const [inputValue, setInputValue] = useState(value || \"\");\n\n    // 🔹 Handle Autocommplete AJAX Fetching\n    const completeMethod = async (event: { query: string }) => {\n        try {\n            const query = event.query;\n            // Build the URL following the user's provided filter pattern\n\n            const filterPart = query\n                ? `&filters[$and][0][$or][0][${fieldName}][$containsi]=%${query}%`\n                : \"\";\n\n            const res = await solidGet(\n                `/api/list-of-values?&offset=0&limit=50&groupBy[0]=${fieldName}&aggregates[0]=id:count${filterPart}`\n            );\n\n            const extracted =\n                res?.data?.data?.groupMeta\n                    ?.filter((item: any) => item.groupValue != null)\n                    .map((item: any) => ({\n                        label: item.groupValue,\n                        value: item.groupValue\n                    })) || [];\n\n            setFilteredOptions(extracted);\n        } catch (err) {\n            console.error(\"Failed to fetch autocomplete suggestions\", err);\n            setFilteredOptions([]);\n        }\n    };\n\n    // 🔹 Handle Change from Autocomplete\n    const handleAutocompleteChange = (e: { value: any }) => {\n        const selectedValue = typeof e.value === \"object\" ? e.value?.value : e.value;\n        formik.setFieldValue(fieldName, selectedValue);\n    };\n\n    // 🔹 Handle Input Submit (blur or enter)\n    const handleCreate = () => {\n        if (!inputValue.trim()) return;\n        formik.setFieldValue(fieldName, inputValue);\n        setIsCreating(false);\n    };\n\n    return (\n        <div className=\"solid-lov-type-change-widget w-full\">\n            <div className=\"flex align-items-center justify-between  mb-2\">\n                <label className=\"text-xs font-semibold text-muted-foreground uppercase tracking-wider\">\n                    {fieldLabel}\n                </label>\n                <button\n                    type=\"button\"\n                    onClick={() => {\n                        setIsCreating(!isCreating);\n                        if (!isCreating) setInputValue(\"\");\n                    }}\n                    style={{ color: \"blue\", background: \"transparent\", border: 0 }}\n                >\n                    <SolidIcon name={isCreating ? \"si-times\" : \"si-plus\"} size={12} />\n                    <span>{isCreating ? \"choose existing\" : \"add custom\"}</span>\n                </button>\n            </div>\n\n            <div className=\"relative\">\n                {!isCreating ? (\n                    <SolidAutocomplete\n                        value={value}\n                        suggestions={filteredOptions}\n                        completeMethod={completeMethod}\n                        onChange={handleAutocompleteChange}\n                        dropdown\n                        placeholder={`Select ${fieldLabel}`}\n                        className=\"w-full\"\n                    />\n                ) : (\n                    <div className=\"flex gap-2\">\n                        <SolidInput\n                            type=\"text\"\n                            value={inputValue}\n                            autoFocus\n                            placeholder=\"Enter new type\"\n                            className=\"flex-1 h-9\"\n                            onChange={(e) => setInputValue(e.target.value)}\n                            onBlur={handleCreate}\n                            onKeyDown={(e) => {\n                                if (e.key === \"Enter\") {\n                                    handleCreate();\n                                }\n                                if (e.key === \"Escape\") {\n                                    setIsCreating(false);\n                                }\n                            }}\n                        />\n                    </div>\n                )}\n            </div>\n        </div>\n    );\n};"]}