@solidxai/core-ui 0.1.7-beta.4 → 0.1.7-beta.5

package/dist/components/core/form/SolidFormFooter.js

@@ -143,7 +143,7 @@ export var SolidFormFooter = function (_a) {
     // -----------------------------
     // UI
     // -----------------------------
-    return (_jsxs("div", { className: "flex justify-content-end align-items-center gap-2 p-1", style: { borderTop: "1px solid var(--surface-border)" }, children: [meta &&
+    return (_jsxs("div", { className: "flex justify-content-end align-items-center gap-2 p-1", children: [meta &&
                 _jsx("span", { className: "solid-form-footer-pagination-meta", children: "".concat(meta.currentIndexGlobal, " of ").concat(meta.totalRecords) }), prevNav && (_jsxs(SolidTooltip, { children: [_jsx(SolidTooltipTrigger, { asChild: true, children: _jsx(SolidButton, { icon: "si si-angle-left", variant: "ghost", size: "sm", onClick: function () { return handlePrev(); }, disabled: isLoading }) }), _jsx(SolidTooltipContent, { side: "top", children: "Previous" })] })), nextNav && (_jsxs(SolidTooltip, { children: [_jsx(SolidTooltipTrigger, { asChild: true, children: _jsx(SolidButton, { icon: "si si-angle-right", variant: "ghost", size: "sm", onClick: function () { return handleNext(); }, disabled: isLoading }) }), _jsx(SolidTooltipContent, { side: "top", children: "Next" })] }))] }));
 };
 //# sourceMappingURL=SolidFormFooter.js.map

package/dist/components/core/form/SolidFormFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"SolidFormFooter.js","sourceRoot":"","sources":["../../../../src/components/core/form/SolidFormFooter.tsx"],"names":[],"mappings":"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","sourcesContent":["\n\nimport { useLazyNavigationQuery } from \"../../../redux/api/modelApi\";\nimport { useEffect, useState } from \"react\";\nimport qs from \"qs\";\nimport { setFilterObjectToLocalStorageByUrl, getFilterObjectFromLocalStorageByUrl } from \"../list/SolidListView\";\nimport { SolidFormViewProps } from \"./SolidFormView\";\nimport { usePathname } from \"../../../hooks/usePathname\";\nimport { useSearchParams } from \"../../../hooks/useSearchParams\";\nimport { useRouter } from \"../../../hooks/useRouter\";\nimport { SolidButton, SolidTooltip, SolidTooltipContent, SolidTooltipTrigger } from \"../../shad-cn-ui\";\n\nexport type SolidFormFooterProps = {\n    params: SolidFormViewProps;\n};\n\ntype NavItem = {\n    recordId: number;\n    offset: number;\n    limit: number;\n};\n\nexport const SolidFormFooter = ({ params }: SolidFormFooterProps) => {\n    const pathname = usePathname();\n    const searchParams = useSearchParams();\n    const router = useRouter();\n\n    const [prevNav, setPrevNav] = useState<NavItem | null>(null);\n    const [nextNav, setNextNav] = useState<NavItem | null>(null);\n    const [meta, setMeta] = useState<any>(null);\n\n    const [triggerGetNavigation, { isLoading }] =\n        useLazyNavigationQuery();\n\n    // -----------------------------\n    // Helper: update local storage\n    // -----------------------------\n    const updatePaginationInLocalStorage = (offset: number, limit: number) => {\n        const listPath = window.location.pathname.replace(\n            /\\/form\\/[^/]+/,\n            \"/list\",\n        );\n        const queryObject = getFilterObjectFromLocalStorageByUrl(listPath);\n\n        const updatedQueryObj = {\n            ...queryObject,\n            offset,\n            limit,\n        };\n        setFilterObjectToLocalStorageByUrl(listPath, updatedQueryObj)\n    };\n\n    const getNewUrl = (recordId: number): string => {\n        // Replace the id after /form/\n        const newPathname = pathname.replace(\n            /\\/form\\/[^/]+/,\n            `/form/${recordId}`,\n        );\n\n        // Clone search params (immutable in Next.js)\n        const params = new URLSearchParams(searchParams.toString());\n\n        // Remove only userKeyField\n        params.delete(\"userKeyField\");\n\n        const query = params.toString();\n        return query ? `${newPathname}?${query}` : newPathname;\n    }\n\n\n    // -----------------------------\n    // Click handlers\n    // -----------------------------\n    const handlePrev = () => {\n\n        if (!prevNav) return;\n\n        updatePaginationInLocalStorage(prevNav.offset, prevNav.limit);\n        const newUrl = getNewUrl(prevNav.recordId)\n        router.push(newUrl);\n    };\n\n    const handleNext = () => {\n        if (!nextNav) return;\n\n        updatePaginationInLocalStorage(nextNav.offset, nextNav.limit);\n        const newUrl = getNewUrl(nextNav.recordId)\n        router.push(newUrl);\n    };\n\n    // -----------------------------\n    // Fetch navigation data\n    // -----------------------------\n    useEffect(() => {\n        if (params.id !== \"new\") {\n\n            const fetchNavigation = async () => {\n                const listPath = window.location.pathname.replace(\n                    /\\/form\\/[^/]+/,\n                    \"/list\",\n                );\n\n                const queryObject = getFilterObjectFromLocalStorageByUrl(listPath);\n\n                const queryData = {\n                    offset: queryObject.offset || 0,\n                    limit: queryObject.limit || 25,\n                    filters: queryObject.filters,\n                    fields: [\"id\"],\n                    modelName: params.modelName,\n                    recordId: params.id,\n                    sort: queryObject.sort\n                };\n\n                const queryString = qs.stringify(queryData, {\n                    encodeValuesOnly: true,\n                });\n\n                const response: any = await triggerGetNavigation(queryString).unwrap();\n                console.log(\"response nav\", response);\n                if (response.statusCode == 200) {\n                    setPrevNav(response?.data?.prev ?? null);\n                    setNextNav(response?.data?.next ?? null);\n                    setMeta(response?.data?.meta ?? null);\n                }\n            };\n            fetchNavigation();\n        }\n    }, [params.id]);\n\n    // -----------------------------\n    // UI\n    // -----------------------------\n    return (\n        <div\n            className=\"flex justify-content-end align-items-center gap-2 p-1\"\n            style={{ borderTop: \"1px solid var(--surface-border)\" }}\n        >{meta &&\n            <span className=\"solid-form-footer-pagination-meta\">{`${meta.currentIndexGlobal} of ${meta.totalRecords}`}</span>\n            }\n            {prevNav && (\n                <SolidTooltip>\n                    <SolidTooltipTrigger asChild>\n                        <SolidButton\n                            icon=\"si si-angle-left\"\n                            variant=\"ghost\"\n                            size=\"sm\"\n                            onClick={() => handlePrev()}\n                            disabled={isLoading}\n                        />\n                    </SolidTooltipTrigger>\n                    <SolidTooltipContent side=\"top\">Previous</SolidTooltipContent>\n                </SolidTooltip>\n            )}\n\n            {nextNav && (\n                <SolidTooltip>\n                    <SolidTooltipTrigger asChild>\n                        <SolidButton\n                            icon=\"si si-angle-right\"\n                            variant=\"ghost\"\n                            size=\"sm\"\n                            onClick={() => handleNext()}\n                            disabled={isLoading}\n                        />\n                    </SolidTooltipTrigger>\n                    <SolidTooltipContent side=\"top\">Next</SolidTooltipContent>\n                </SolidTooltip>\n            )}\n        </div>\n    );\n};\n"]}
+{"version":3,"file":"SolidFormFooter.js","sourceRoot":"","sources":["../../../../src/components/core/form/SolidFormFooter.tsx"],"names":[],"mappings":"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","sourcesContent":["\n\nimport { useLazyNavigationQuery } from \"../../../redux/api/modelApi\";\nimport { useEffect, useState } from \"react\";\nimport qs from \"qs\";\nimport { setFilterObjectToLocalStorageByUrl, getFilterObjectFromLocalStorageByUrl } from \"../list/SolidListView\";\nimport { SolidFormViewProps } from \"./SolidFormView\";\nimport { usePathname } from \"../../../hooks/usePathname\";\nimport { useSearchParams } from \"../../../hooks/useSearchParams\";\nimport { useRouter } from \"../../../hooks/useRouter\";\nimport { SolidButton, SolidTooltip, SolidTooltipContent, SolidTooltipTrigger } from \"../../shad-cn-ui\";\n\nexport type SolidFormFooterProps = {\n    params: SolidFormViewProps;\n};\n\ntype NavItem = {\n    recordId: number;\n    offset: number;\n    limit: number;\n};\n\nexport const SolidFormFooter = ({ params }: SolidFormFooterProps) => {\n    const pathname = usePathname();\n    const searchParams = useSearchParams();\n    const router = useRouter();\n\n    const [prevNav, setPrevNav] = useState<NavItem | null>(null);\n    const [nextNav, setNextNav] = useState<NavItem | null>(null);\n    const [meta, setMeta] = useState<any>(null);\n\n    const [triggerGetNavigation, { isLoading }] =\n        useLazyNavigationQuery();\n\n    // -----------------------------\n    // Helper: update local storage\n    // -----------------------------\n    const updatePaginationInLocalStorage = (offset: number, limit: number) => {\n        const listPath = window.location.pathname.replace(\n            /\\/form\\/[^/]+/,\n            \"/list\",\n        );\n        const queryObject = getFilterObjectFromLocalStorageByUrl(listPath);\n\n        const updatedQueryObj = {\n            ...queryObject,\n            offset,\n            limit,\n        };\n        setFilterObjectToLocalStorageByUrl(listPath, updatedQueryObj)\n    };\n\n    const getNewUrl = (recordId: number): string => {\n        // Replace the id after /form/\n        const newPathname = pathname.replace(\n            /\\/form\\/[^/]+/,\n            `/form/${recordId}`,\n        );\n\n        // Clone search params (immutable in Next.js)\n        const params = new URLSearchParams(searchParams.toString());\n\n        // Remove only userKeyField\n        params.delete(\"userKeyField\");\n\n        const query = params.toString();\n        return query ? `${newPathname}?${query}` : newPathname;\n    }\n\n\n    // -----------------------------\n    // Click handlers\n    // -----------------------------\n    const handlePrev = () => {\n\n        if (!prevNav) return;\n\n        updatePaginationInLocalStorage(prevNav.offset, prevNav.limit);\n        const newUrl = getNewUrl(prevNav.recordId)\n        router.push(newUrl);\n    };\n\n    const handleNext = () => {\n        if (!nextNav) return;\n\n        updatePaginationInLocalStorage(nextNav.offset, nextNav.limit);\n        const newUrl = getNewUrl(nextNav.recordId)\n        router.push(newUrl);\n    };\n\n    // -----------------------------\n    // Fetch navigation data\n    // -----------------------------\n    useEffect(() => {\n        if (params.id !== \"new\") {\n\n            const fetchNavigation = async () => {\n                const listPath = window.location.pathname.replace(\n                    /\\/form\\/[^/]+/,\n                    \"/list\",\n                );\n\n                const queryObject = getFilterObjectFromLocalStorageByUrl(listPath);\n\n                const queryData = {\n                    offset: queryObject.offset || 0,\n                    limit: queryObject.limit || 25,\n                    filters: queryObject.filters,\n                    fields: [\"id\"],\n                    modelName: params.modelName,\n                    recordId: params.id,\n                    sort: queryObject.sort\n                };\n\n                const queryString = qs.stringify(queryData, {\n                    encodeValuesOnly: true,\n                });\n\n                const response: any = await triggerGetNavigation(queryString).unwrap();\n                console.log(\"response nav\", response);\n                if (response.statusCode == 200) {\n                    setPrevNav(response?.data?.prev ?? null);\n                    setNextNav(response?.data?.next ?? null);\n                    setMeta(response?.data?.meta ?? null);\n                }\n            };\n            fetchNavigation();\n        }\n    }, [params.id]);\n\n    // -----------------------------\n    // UI\n    // -----------------------------\n    return (\n        <div\n            className=\"flex justify-content-end align-items-center gap-2 p-1\"\n        >{meta &&\n            <span className=\"solid-form-footer-pagination-meta\">{`${meta.currentIndexGlobal} of ${meta.totalRecords}`}</span>\n            }\n            {prevNav && (\n                <SolidTooltip>\n                    <SolidTooltipTrigger asChild>\n                        <SolidButton\n                            icon=\"si si-angle-left\"\n                            variant=\"ghost\"\n                            size=\"sm\"\n                            onClick={() => handlePrev()}\n                            disabled={isLoading}\n                        />\n                    </SolidTooltipTrigger>\n                    <SolidTooltipContent side=\"top\">Previous</SolidTooltipContent>\n                </SolidTooltip>\n            )}\n\n            {nextNav && (\n                <SolidTooltip>\n                    <SolidTooltipTrigger asChild>\n                        <SolidButton\n                            icon=\"si si-angle-right\"\n                            variant=\"ghost\"\n                            size=\"sm\"\n                            onClick={() => handleNext()}\n                            disabled={isLoading}\n                        />\n                    </SolidTooltipTrigger>\n                    <SolidTooltipContent side=\"top\">Next</SolidTooltipContent>\n                </SolidTooltip>\n            )}\n        </div>\n    );\n};\n"]}

package/dist/components/core/form/SolidFormFooter.tsx

@@ -134,7 +134,6 @@ export const SolidFormFooter = ({ params }: SolidFormFooterProps) => {
     return (
         <div
             className="flex justify-content-end align-items-center gap-2 p-1"
-            style={{ borderTop: "1px solid var(--surface-border)" }}
         >{meta &&
             <span className="solid-form-footer-pagination-meta">{`${meta.currentIndexGlobal} of ${meta.totalRecords}`}</span>
             }

package/dist/components/core/form/SolidFormUserViewLayout.js

@@ -89,6 +89,6 @@ export var SolidFormUserViewLayout = function (_a) {
     });
     return (_jsx(_Fragment, { children: _jsxs("form", { onSubmit: formik.handleSubmit, children: [_jsx(SolidCodeEditor, { value: formik.values.layoutString, height: "500px", fontSize: 12, language: "json", onChange: function (value) {
                         formik.setFieldValue("layoutString", value);
-                    } }), _jsxs("div", { className: "pt-3 flex gap-2", children: [_jsx(SolidButton, { type: "submit", label: "Apply", size: "sm" }), _jsx(SolidButton, { type: "button", outlined: true, label: "Cancel", size: "sm", onClick: function () { return setLayoutDialogVisible(false); } })] })] }) }));
+                    } }), _jsxs("div", { className: "pt-3 flex gap-2", children: [_jsx(SolidButton, { type: "submit", label: "Apply", size: "sm" }), _jsx(SolidButton, { type: "button", variant: "outline", label: "Cancel", size: "sm", onClick: function () { return setLayoutDialogVisible(false); } })] })] }) }));
 };
 //# sourceMappingURL=SolidFormUserViewLayout.js.map

package/dist/components/core/form/SolidFormUserViewLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"SolidFormUserViewLayout.js","sourceRoot":"","sources":["../../../../src/components/core/form/SolidFormUserViewLayout.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport { useFormik } from \"formik\";\nimport { useDispatch } from \"react-redux\";\nimport React from \"react\";\nimport { createSolidEntityApi } from \"../../../redux/api/solidEntityApi\";\nimport { ERROR_MESSAGES } from \"../../../constants/error-messages\";\nimport { showToast } from \"../../../redux/features/toastSlice\";\nimport { SolidButton, SolidCodeEditor } from \"../../shad-cn-ui\";\n\nexport const SolidFormUserViewLayout = ({ solidFormViewMetaData, setLayoutDialogVisible }: any) => {\n    const dispatch = useDispatch();\n    const entityApi = createSolidEntityApi(\"userViewMetadata\");\n    const { useUpsertSolidEntityMutation } = entityApi;\n    const [upsertUserView] = useUpsertSolidEntityMutation();\n\n    if (!solidFormViewMetaData?.data?.solidView) return null;\n\n    const solidView = solidFormViewMetaData.data.solidView;\n\n    const formik = useFormik({\n        initialValues: {\n            layoutString: JSON.stringify(solidView.layout, null, 2),\n        },\n        onSubmit: async (values) => {\n            const parsedLayout = JSON.parse(values.layoutString);\n            try {\n                if (solidView.id) {\n                    const response = await upsertUserView({\n                        viewMetadataId: solidView.id,\n                        layout: JSON.stringify(parsedLayout)\n                    }).unwrap();\n                    if (response.statusCode === 200) {\n                        dispatch(showToast({ severity: \"success\", summary: ERROR_MESSAGES.LAYOUT, detail: ERROR_MESSAGES.FORM_LAYOUT_UPDATE }));\n                        setLayoutDialogVisible(false);\n                        window.location.reload();\n                    }\n                }\n            } catch (error) {\n                console.error(ERROR_MESSAGES.UPDATE_FAILED, error);\n            }\n        },\n    });\n\n    return (\n        <>\n            <form onSubmit={formik.handleSubmit}>\n                <SolidCodeEditor\n                    value={formik.values.layoutString}\n                    height=\"500px\"\n                    fontSize={12}\n                    language=\"json\"\n                    onChange={(value) => {\n                        formik.setFieldValue(\"layoutString\", value);\n                    }}\n                />\n                <div className=\"pt-3 flex gap-2\">\n                    <SolidButton type=\"submit\" label=\"Apply\" size=\"sm\" />\n                    <SolidButton\n                        type=\"button\"\n                        outlined\n                        label=\"Cancel\"\n                        size=\"sm\"\n                        onClick={() => setLayoutDialogVisible(false)}\n                    />\n                </div>\n            </form>\n        </>\n    );\n};\n"]}
+{"version":3,"file":"SolidFormUserViewLayout.js","sourceRoot":"","sources":["../../../../src/components/core/form/SolidFormUserViewLayout.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport { useFormik } from \"formik\";\nimport { useDispatch } from \"react-redux\";\nimport React from \"react\";\nimport { createSolidEntityApi } from \"../../../redux/api/solidEntityApi\";\nimport { ERROR_MESSAGES } from \"../../../constants/error-messages\";\nimport { showToast } from \"../../../redux/features/toastSlice\";\nimport { SolidButton, SolidCodeEditor } from \"../../shad-cn-ui\";\n\nexport const SolidFormUserViewLayout = ({ solidFormViewMetaData, setLayoutDialogVisible }: any) => {\n    const dispatch = useDispatch();\n    const entityApi = createSolidEntityApi(\"userViewMetadata\");\n    const { useUpsertSolidEntityMutation } = entityApi;\n    const [upsertUserView] = useUpsertSolidEntityMutation();\n\n    if (!solidFormViewMetaData?.data?.solidView) return null;\n\n    const solidView = solidFormViewMetaData.data.solidView;\n\n    const formik = useFormik({\n        initialValues: {\n            layoutString: JSON.stringify(solidView.layout, null, 2),\n        },\n        onSubmit: async (values) => {\n            const parsedLayout = JSON.parse(values.layoutString);\n            try {\n                if (solidView.id) {\n                    const response = await upsertUserView({\n                        viewMetadataId: solidView.id,\n                        layout: JSON.stringify(parsedLayout)\n                    }).unwrap();\n                    if (response.statusCode === 200) {\n                        dispatch(showToast({ severity: \"success\", summary: ERROR_MESSAGES.LAYOUT, detail: ERROR_MESSAGES.FORM_LAYOUT_UPDATE }));\n                        setLayoutDialogVisible(false);\n                        window.location.reload();\n                    }\n                }\n            } catch (error) {\n                console.error(ERROR_MESSAGES.UPDATE_FAILED, error);\n            }\n        },\n    });\n\n    return (\n        <>\n            <form onSubmit={formik.handleSubmit}>\n                <SolidCodeEditor\n                    value={formik.values.layoutString}\n                    height=\"500px\"\n                    fontSize={12}\n                    language=\"json\"\n                    onChange={(value) => {\n                        formik.setFieldValue(\"layoutString\", value);\n                    }}\n                />\n                <div className=\"pt-3 flex gap-2\">\n                    <SolidButton type=\"submit\" label=\"Apply\" size=\"sm\" />\n                    <SolidButton\n                        type=\"button\"\n                        variant=\"outline\"\n                        label=\"Cancel\"\n                        size=\"sm\"\n                        onClick={() => setLayoutDialogVisible(false)}\n                    />\n                </div>\n            </form>\n        </>\n    );\n};\n"]}

package/dist/components/core/form/SolidFormUserViewLayout.tsx

@@ -57,7 +57,7 @@ export const SolidFormUserViewLayout = ({ solidFormViewMetaData, setLayoutDialog
                     <SolidButton type="submit" label="Apply" size="sm" />
                     <SolidButton
                         type="button"
-                        outlined
+                        variant="outline"
                         label="Cancel"
                         size="sm"
                         onClick={() => setLayoutDialogVisible(false)}

package/dist/components/core/form/SolidFormView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidFormView.d.ts","sourceRoot":"","sources":["../../../../src/components/core/form/SolidFormView.tsx"],"names":[],"mappings":"AA0DA,MAAM,MAAM,kBAAkB,GAAG;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,OAAO,CAAC;IACjB,gBAAgB,CAAC,EAAE,GAAG,CAAC;IACvB,mBAAmB,CAAC,EAAE,GAAG,CAAA;IACzB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;CACnC,CAAC;AAyBF,eAAO,MAAM,uBAAuB,WAAY,GAAG,EAAE,KAAG,GAQvD,CAAA;AACD,eAAO,MAAM,sBAAsB,QAAS,MAAM,uBAAuB,OAAO,MAAM,EAAE,GAAG,CAAC,QAa3F,CAAC;AA6TF,QAAA,MAAM,aAAa,WAAY,kBAAkB,4CA02ChD,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"SolidFormView.d.ts","sourceRoot":"","sources":["../../../../src/components/core/form/SolidFormView.tsx"],"names":[],"mappings":"AA0DA,MAAM,MAAM,kBAAkB,GAAG;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,OAAO,CAAC;IACjB,gBAAgB,CAAC,EAAE,GAAG,CAAC;IACvB,mBAAmB,CAAC,EAAE,GAAG,CAAA;IACzB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;CACnC,CAAC;AAyBF,eAAO,MAAM,uBAAuB,WAAY,GAAG,EAAE,KAAG,GAQvD,CAAA;AACD,eAAO,MAAM,sBAAsB,QAAS,MAAM,uBAAuB,OAAO,MAAM,EAAE,GAAG,CAAC,QAa3F,CAAC;AAmSF,QAAA,MAAM,aAAa,WAAY,kBAAkB,4CA+2ChD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/core/form/SolidFormView.js

@@ -88,7 +88,7 @@ import { SolidFormFooter } from "./SolidFormFooter";
 import { normalizeSolidFormActionPath } from "../../../helpers/routePaths";
 import { showToast } from "../../../redux/features/toastSlice";
 import { useDispatch } from "react-redux";
-import { SolidButton, SolidConfirmDialog, SolidPanel } from "../../shad-cn-ui";
+import { SolidButton, SolidConfirmDialog } from "../../shad-cn-ui";
 import { SolidDialog, SolidDialogBody, SolidDialogClose, SolidDialogHeader, SolidDialogSeparator, SolidDialogTitle } from "../../shad-cn-ui/SolidDialog";
 import { SolidHeaderRequestStatus } from "../../common/SolidHeaderRequestStatus";
 var getLayoutFields = function (node) {
@@ -211,8 +211,10 @@ var SolidField = function (_a) {
 };
 var SolidGroup = function (_a) {
     var children = _a.children, attrs = _a.attrs;
-    var className = attrs.className;
-    return (_jsxs("div", { className: className, children: [attrs.label && _jsx("p", { children: attrs.label }), _jsx("div", { className: "grid", children: children })] })
+    var className = ["solid-form-layout-group", attrs.label ? "solid-form-layout-group--labeled" : "", attrs.className]
+        .filter(Boolean)
+        .join(" ");
+    return (_jsxs("div", { className: className, children: [attrs.label && _jsx("p", { className: "solid-form-layout-label", children: attrs.label }), _jsx("div", { className: "grid", children: children })] })
     // <div className={className}>
     //     <div className="s_group">
     //         <fieldset>
@@ -228,7 +230,9 @@ var SolidGroup = function (_a) {
 };
 var SolidRow = function (_a) {
     var children = _a.children, attrs = _a.attrs;
-    var className = attrs.className;
+    var className = ["row", "solid-form-layout-row", attrs.label ? "solid-form-layout-row--labeled" : "", attrs.className]
+        .filter(Boolean)
+        .join(" ");
     return (
     // <div className={`row ${className}`}>
     //     <div className="s_group">
@@ -238,33 +242,16 @@ var SolidRow = function (_a) {
     //         </fieldset>
     //     </div>
     // </div>
-    _jsxs("div", { className: "row ".concat(className), children: [attrs.label && _jsx("p", { children: attrs.label }), _jsx("div", { className: "grid", children: children })] })
+    _jsxs("div", { className: className, children: [attrs.label && _jsx("p", { className: "solid-form-layout-label", children: attrs.label }), _jsx("div", { className: "grid", children: children })] })
     // <div>{children}</div>
     );
 };
 var SolidColumn = function (_a) {
     var children = _a.children, attrs = _a.attrs;
-    var className = attrs.className;
-    return (
-    // first fieldset ui
-    // <div className={`${className}`}>
-    //     <div className="s_group">
-    //         <fieldset>
-    //             {attrs.label && <p className="s_group_heading">{attrs.label}</p>}
-    //             <div className="grid">{children}</div>
-    //         </fieldset>
-    //     </div>
-    // </div>
-    //second fieldset ui
-    // <div className={`${className}`}>
-    //     {attrs.label && <p>{attrs.label}</p>}
-    //     <div className="grid">{children}</div>
-    // </div>
-    //figma fieldset ui
-    attrs.label ?
-        _jsx("div", { className: "".concat(className), children: _jsx(SolidPanel, { header: attrs.label, className: "solid-column-panel", children: _jsx("div", { className: "grid", children: children }) }) })
-        :
-            _jsx("div", { className: "".concat(className), children: _jsx("div", { className: "grid", children: children }) }));
+    var className = ["solid-form-layout-column", attrs.label ? "solid-form-layout-column--labeled" : "", attrs.className]
+        .filter(Boolean)
+        .join(" ");
+    return (_jsxs("div", { className: className, children: [attrs.label && _jsx("p", { className: "solid-form-layout-label", children: attrs.label }), _jsx("div", { className: "grid", children: children })] }));
 };
 var SolidSheet = function (_a) {
     var children = _a.children;
@@ -389,7 +376,7 @@ var SolidFormView = function (params) {
     var _2 = useState(false), openLightbox = _2[0], setOpenLightbox = _2[1];
     var _3 = useState([]), lightboxUrls = _3[0], setLightboxUrls = _3[1];
     var _4 = useState(false), isShowChatter = _4[0], setShowChatter = _4[1];
-    var _5 = useState(380), chatterLocaleWidth = _5[0], setChatterLocaleWidth = _5[1]; // default width
+    var _5 = useState(360), chatterLocaleWidth = _5[0], setChatterLocaleWidth = _5[1];
     var _6 = useState(false), isResizingChatterLocale = _6[0], setIsResizingChatterLocale = _6[1];
     var _7 = useState(false), isSubmitting = _7[0], setIsSubmitting = _7[1];
     var _8 = useState(""), solidWorkflowFieldValue = _8[0], setSolidWorkflowFieldValue = _8[1];
@@ -444,7 +431,9 @@ var SolidFormView = function (params) {
     useEffect(function () {
         var stored = localStorage.getItem('chatter_locale_width');
         if (stored) {
-            setChatterLocaleWidth(parseInt(stored, 10));
+            var parsed = parseInt(stored, 10);
+            var clampedWidth = Math.max(320, Math.min(parsed, 420));
+            setChatterLocaleWidth(clampedWidth);
         }
     }, []);
     useEffect(function () {
@@ -452,7 +441,7 @@ var SolidFormView = function (params) {
             if (!isResizingChatterLocale)
                 return;
             var newWidth = window.innerWidth - e.clientX;
-            var clampedWidth = Math.max(280, Math.min(newWidth, 700));
+            var clampedWidth = Math.max(320, Math.min(newWidth, 420));
             setChatterLocaleWidth(clampedWidth);
             localStorage.setItem('chatter_locale_width', clampedWidth.toString());
         };
@@ -1080,7 +1069,7 @@ var SolidFormView = function (params) {
             enableReinitialize: true,
             onSubmit: onFormikSubmit,
         });
-        return (_jsx("div", { className: "solid-form-wrapper", children: _jsxs("div", { className: "solid-form-section", style: { borderRight: params.embeded !== true ? '1px solid var(--primary-light-color)' : '' }, children: [_jsx("div", { className: "page-header solid-list-toolbar flex-column lg:flex-row", children: _jsxs("div", { className: "flex justify-content-between w-full solid-form-toolbar-row", children: [_jsx("div", { className: "flex gap-3 align-items-center solid-form-toolbar-left", children: _jsx("p", { className: "m-0 view-title solid-text-wrapper", children: "Loading form" }) }), _jsx("div", { className: "flex align-items-center solid-header-buttons-wrapper solid-form-toolbar-actions", children: _jsx(SolidHeaderRequestStatus, { label: "Loading..." }) })] }) }), _jsx("div", { className: "solid-view-loading-body-spacer flex-1 min-h-0" })] }) }));
+        return (_jsx("div", { className: "solid-form-wrapper", children: _jsxs("div", { className: "solid-form-section", children: [_jsx("div", { className: "page-header solid-list-toolbar flex-column lg:flex-row", children: _jsxs("div", { className: "flex justify-content-between w-full solid-form-toolbar-row", children: [_jsx("div", { className: "flex gap-3 align-items-center solid-form-toolbar-left", children: _jsx("p", { className: "m-0 view-title solid-text-wrapper", children: "Loading form" }) }), _jsx("div", { className: "flex align-items-center solid-header-buttons-wrapper solid-form-toolbar-actions", children: _jsx(SolidHeaderRequestStatus, { label: "Loading..." }) })] }) }), _jsx("div", { className: "solid-view-loading-body-spacer flex-1 min-h-0" })] }) }));
     }
     // At this point everything required to render the form is loaded, so we go ahead and start rendering things dynamically...
     else {
@@ -1441,7 +1430,7 @@ var SolidFormView = function (params) {
             return slide;
         })
             .filter(function (slide) { return !!slide; });
-        return (_jsxs("div", { className: "solid-form-wrapper", children: [_jsxs("div", { className: "solid-form-section", style: { borderRight: params.embeded !== true ? '1px solid var(--primary-light-color)' : '' }, children: [_jsxs("form", { style: { width: '100%' }, onSubmit: formik.handleSubmit, children: [_jsx(SolidFormActionHeader, { formik: formik, formData: solidFormViewData === null || solidFormViewData === void 0 ? void 0 : solidFormViewData.data, params: params, actionsAllowed: actionsAllowed, formViewLayout: formViewLayout, solidView: solidView_1, solidFormViewMetaData: solidFormViewMetaData, initialEntityData: solidFormViewData ? solidFormViewData.data : {}, setDeleteDialogVisible: setDeleteDialogVisible, setLayoutDialogVisible: setLayoutDialogVisible, setRedirectToList: setRedirectToList, viewMode: viewMode, setViewMode: setViewMode, solidWorkflowFieldValue: solidWorkflowFieldValue, setSolidWorkflowFieldValue: setSolidWorkflowFieldValue, draftEnabled: (_j = (_h = (_g = solidFormViewMetaData === null || solidFormViewMetaData === void 0 ? void 0 : solidFormViewMetaData.data) === null || _g === void 0 ? void 0 : _g.solidView) === null || _h === void 0 ? void 0 : _h.model) === null || _j === void 0 ? void 0 : _j.draftPublishWorkflow, publish: published, internationalisationEnabled: (_m = (_l = (_k = solidFormViewMetaData === null || solidFormViewMetaData === void 0 ? void 0 : solidFormViewMetaData.data) === null || _k === void 0 ? void 0 : _k.solidView) === null || _l === void 0 ? void 0 : _l.model) === null || _m === void 0 ? void 0 : _m.internationalisation, handleDraftPublishWorkFlow: handleDraftPublishWorkFlow, onStepperUpdate: function () { return setRefreshChatterMessage(true); }, isSubmitting: isSubmitting, headerRequestStatusLabel: isSubmitting ? "Saving..." : null }), _jsxs("div", { className: "px-4 py-3 md:p-4 solid-form-content md:pt-1 ".concat(createMode ? 'solid-create-mode-form-content' : '', " ").concat(params.embeded === true ? 'h-auto' : ''), style: { maxHeight: params.embeded === true ? '80vh' : '', overflowY: 'auto' }, children: [DynamicHeaderComponent && _jsx(DynamicHeaderComponent, {}), params.id === 'new' && DynamicFormComponentNew ? (_jsx(DynamicFormComponentNew, { params: params })) : params.id !== 'new' && DynamicFormComponentEdit ? (_jsx(DynamicFormComponentEdit, { params: params })) : (renderFormDynamically(formViewMetaData, formViewLayout))] })] }), _jsx(SolidFormFooter, { params: params })] }), params.embeded !== true &&
+        return (_jsxs("div", { className: "solid-form-wrapper", children: [_jsxs("div", { className: "solid-form-section", children: [_jsxs("form", { style: { width: '100%' }, onSubmit: formik.handleSubmit, children: [_jsx(SolidFormActionHeader, { formik: formik, formData: solidFormViewData === null || solidFormViewData === void 0 ? void 0 : solidFormViewData.data, params: params, actionsAllowed: actionsAllowed, formViewLayout: formViewLayout, solidView: solidView_1, solidFormViewMetaData: solidFormViewMetaData, initialEntityData: solidFormViewData ? solidFormViewData.data : {}, setDeleteDialogVisible: setDeleteDialogVisible, setLayoutDialogVisible: setLayoutDialogVisible, setRedirectToList: setRedirectToList, viewMode: viewMode, setViewMode: setViewMode, solidWorkflowFieldValue: solidWorkflowFieldValue, setSolidWorkflowFieldValue: setSolidWorkflowFieldValue, draftEnabled: (_j = (_h = (_g = solidFormViewMetaData === null || solidFormViewMetaData === void 0 ? void 0 : solidFormViewMetaData.data) === null || _g === void 0 ? void 0 : _g.solidView) === null || _h === void 0 ? void 0 : _h.model) === null || _j === void 0 ? void 0 : _j.draftPublishWorkflow, publish: published, internationalisationEnabled: (_m = (_l = (_k = solidFormViewMetaData === null || solidFormViewMetaData === void 0 ? void 0 : solidFormViewMetaData.data) === null || _k === void 0 ? void 0 : _k.solidView) === null || _l === void 0 ? void 0 : _l.model) === null || _m === void 0 ? void 0 : _m.internationalisation, handleDraftPublishWorkFlow: handleDraftPublishWorkFlow, onStepperUpdate: function () { return setRefreshChatterMessage(true); }, isSubmitting: isSubmitting, headerRequestStatusLabel: isSubmitting ? "Saving..." : null }), _jsxs("div", { className: "px-4 py-3 md:p-4 solid-form-content md:pt-1 ".concat(createMode ? 'solid-create-mode-form-content' : '', " ").concat(params.embeded === true ? 'h-auto' : ''), style: { maxHeight: params.embeded === true ? '80vh' : '', overflowY: 'auto' }, children: [DynamicHeaderComponent && _jsx(DynamicHeaderComponent, {}), params.id === 'new' && DynamicFormComponentNew ? (_jsx(DynamicFormComponentNew, { params: params })) : params.id !== 'new' && DynamicFormComponentEdit ? (_jsx(DynamicFormComponentEdit, { params: params })) : (renderFormDynamically(formViewMetaData, formViewLayout))] })] }), _jsx(SolidFormFooter, { params: params })] }), params.embeded !== true &&
                     _jsxs("div", { className: "chatter-section ".concat(isShowChatter === false ? 'collapsed' : 'open'), style: { width: chatterLocaleWidth }, children: [isShowChatter && (_jsx("div", { style: {
                                     width: 5,
                                     cursor: 'col-resize',
@@ -1451,11 +1440,11 @@ var SolidFormView = function (params) {
                                     bottom: 0,
                                     zIndex: 9,
                                 }, onMouseDown: function () { return setIsResizingChatterLocale(true); } })), isShowChatter === true &&
-                                _jsx(SolidButton, { icon: "si si-angle-double-right", size: "sm", text: true, className: "chatter-collapse-btn", style: { width: 30, height: 30, aspectRatio: '1/1' }, onClick: function () { return setShowChatter(false); } }), isShowChatter === false ?
+                                _jsx(SolidButton, { icon: "si si-angle-double-right", size: "sm", text: true, className: "chatter-collapse-btn", style: { width: 26, height: 26, aspectRatio: '1/1' }, onClick: function () { return setShowChatter(false); } }), isShowChatter === false ?
                                 _jsxs("div", { className: "flex flex-column gap-2 justify-content-center p-1", children: [((_q = (_p = (_o = solidFormViewMetaData === null || solidFormViewMetaData === void 0 ? void 0 : solidFormViewMetaData.data) === null || _o === void 0 ? void 0 : _o.solidView) === null || _p === void 0 ? void 0 : _p.model) === null || _q === void 0 ? void 0 : _q.draftPublishWorkflow) &&
                                             _jsx("div", { className: "chatter-collapsed-content", onClick: function () { return handleChatterExpandClick_1('info'); }, children: "Info" }), _jsx("div", { className: "chatter-collapsed-content", onClick: function () { return handleChatterExpandClick_1('chatter'); }, children: "Audit Trail" }), _jsx(SolidButton, { icon: "si si-chevron-left", size: "sm", className: "px-0", style: { width: 30 }, onClick: function () { return handleChatterExpandClick_1('chatter'); } })] })
                                 :
-                                    _jsx(SolidChatterLocaleTabView, { createMode: createMode, setSelectedLocale: setSelectedLocale, selectedLocale: selectedLocale, solidFormViewMetaData: solidFormViewMetaData, id: params.id, refreshChatterMessage: refreshChatterMessage, setRefreshChatterMessage: setRefreshChatterMessage, activeTab: defaultTabViewOptionIndex, viewMode: viewMode, defaultEntityLocaleId: defaultEntityLocaleId, handleLocaleChangeRedirect: handleLocaleChangeRedirect, solidFormViewData: solidFormViewData, published: published, actionsAllowed: actionsAllowed, mcpUrl: mcpUrl })] }), _jsx(SolidDialog, { visible: isDeleteDialogVisible, header: "Confirm Delete", className: "solid-confirm-dialog", onHide: function () { return setDeleteDialogVisible(false); }, footer: _jsxs("div", { className: "flex justify-content-center gap-2", children: [_jsx(SolidButton, { label: "Yes", icon: "si si-check", className: 'small-button', severity: "danger", autoFocus: true, onClick: function () { return handleDeleteEntity_1(); } }), _jsx(SolidButton, { label: "No", icon: "si si-times", className: 'small-button', variant: "outline", onClick: onDeleteClose })] }), children: _jsx("p", { children: "Are you sure you want to delete?" }) }), _jsxs(SolidDialog, { open: isLayoutDialogVisible, onOpenChange: setLayoutDialogVisible, className: "solid-form-layout-dialog", children: [_jsxs(SolidDialogHeader, { className: "solid-shadcn-dialog-head", children: [_jsx(SolidDialogTitle, { children: "Change Form Layout" }), _jsx(SolidDialogClose, {})] }), _jsx(SolidDialogSeparator, {}), _jsx(SolidDialogBody, { className: "p-3 pt-0 lg:p-4", children: _jsx(SolidFormUserViewLayout, { solidFormViewMetaData: solidFormViewMetaData, setLayoutDialogVisible: setLayoutDialogVisible }) })] }), openLightbox && (_jsx(SolidLightbox, { open: openLightbox, slides: lightboxSlides, onClose: function () { return setOpenLightbox(false); } })), _jsx(SolidConfirmDialog, { open: confirmVisible, title: "Confirmation", confirmLabel: "Yes, confirm", cancelLabel: "No, cancel", onConfirm: handleConfirmAccept, onCancel: handleConfirmReject, message: _jsx("div", { className: "flex flex-col items-center justify-center text-center space-y-3", children: _jsxs("p", { className: "text-gray-800 text-base", children: ["Are you sure you want to ", published !== null ? 'unpublish' : 'publish', "?"] }) }) })] }));
+                                    _jsx(SolidChatterLocaleTabView, { createMode: createMode, setSelectedLocale: setSelectedLocale, selectedLocale: selectedLocale, solidFormViewMetaData: solidFormViewMetaData, id: params.id, refreshChatterMessage: refreshChatterMessage, setRefreshChatterMessage: setRefreshChatterMessage, activeTab: defaultTabViewOptionIndex, viewMode: viewMode, defaultEntityLocaleId: defaultEntityLocaleId, handleLocaleChangeRedirect: handleLocaleChangeRedirect, solidFormViewData: solidFormViewData, published: published, actionsAllowed: actionsAllowed, mcpUrl: mcpUrl })] }), _jsxs(SolidDialog, { open: isDeleteDialogVisible, onOpenChange: setDeleteDialogVisible, className: "solid-confirm-dialog", children: [_jsxs(SolidDialogHeader, { className: "solid-field-confirm-header", children: [_jsx(SolidDialogTitle, { children: "Confirm Delete" }), _jsx(SolidDialogClose, {})] }), _jsx(SolidDialogBody, { className: "solid-field-confirm-dialog-body", children: _jsx("p", { className: "solid-field-confirm-message", children: "Are you sure you want to delete?" }) }), _jsxs("div", { className: "solid-radix-dialog-footer solid-field-confirm-actions", children: [_jsx(SolidButton, { label: "Yes", icon: "si si-check", variant: "destructive", autoFocus: true, onClick: function () { return handleDeleteEntity_1(); } }), _jsx(SolidButton, { label: "No", icon: "si si-times", variant: "outline", onClick: onDeleteClose })] })] }), _jsxs(SolidDialog, { open: isLayoutDialogVisible, onOpenChange: setLayoutDialogVisible, className: "solid-form-layout-dialog", children: [_jsxs(SolidDialogHeader, { className: "solid-shadcn-dialog-head", children: [_jsx(SolidDialogTitle, { children: "Change Form Layout" }), _jsx(SolidDialogClose, {})] }), _jsx(SolidDialogSeparator, {}), _jsx(SolidDialogBody, { className: "p-3 pt-0 lg:p-4", children: _jsx(SolidFormUserViewLayout, { solidFormViewMetaData: solidFormViewMetaData, setLayoutDialogVisible: setLayoutDialogVisible }) })] }), openLightbox && (_jsx(SolidLightbox, { open: openLightbox, slides: lightboxSlides, onClose: function () { return setOpenLightbox(false); } })), _jsx(SolidConfirmDialog, { open: confirmVisible, title: "Confirmation", confirmLabel: "Yes, confirm", cancelLabel: "No, cancel", onConfirm: handleConfirmAccept, onCancel: handleConfirmReject, message: _jsx("div", { className: "flex flex-col items-center justify-center text-center space-y-3", children: _jsxs("p", { className: "text-gray-800 text-base", children: ["Are you sure you want to ", published !== null ? 'unpublish' : 'publish', "?"] }) }) })] }));
     }
 };
 export default SolidFormView;