npm - @solidxai/core-ui - Versions diffs - 0.1.7-beta.4 → 0.1.7-beta.5 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (221) hide show

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

@@ -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 ADDED Viewed

	@@ -0,0 +1 @@
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 ADDED Viewed

@@ -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 ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"SolidChatterMessageCoModelEntityIdFormViewWidget.js","sourceRoot":"","sources":["../../../../../../src/components/core/form/fields/widgets/SolidChatterMessageCoModelEntityIdFormViewWidget.tsx"],"names":[],"mappings":"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","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 ADDED Viewed

@@ -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/SolidIconEditWidget.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SolidIconEditWidget.d.ts","sourceRoot":"","sources":["../../../../../../src/components/core/form/fields/widgets/SolidIconEditWidget.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,yBAAyB,EAAE,MAAM,iCAAiC,CAAC;~~AAO5E~~,eAAO,MAAM,mBAAmB,6BAA8B,yBAAyB,~~4CA+PtF~~,CAAC"}
1	+ {"version":3,"file":"SolidIconEditWidget.d.ts","sourceRoot":"","sources":["../../../../../../src/components/core/form/fields/widgets/SolidIconEditWidget.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,yBAAyB,EAAE,MAAM,iCAAiC,CAAC;AAa5E,eAAO,MAAM,mBAAmB,6BAA8B,yBAAyB,4CA6PtF,CAAC"}

package/dist/components/core/form/fields/widgets/SolidIconEditWidget.js CHANGED Viewed

@@ -10,13 +10,12 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { solidIcons } from "../../../../../helpers/solidIcons";
 import { SolidButton } from "../../../../shad-cn-ui/SolidButton";
-import { SolidDialog } from "../../../../shad-cn-ui/SolidDialog";
+import { SolidDialog, SolidDialogBody, SolidDialogClose, SolidDialogFooter, SolidDialogHeader, SolidDialogTitle, } from "../../../../shad-cn-ui/SolidDialog";
 import { SolidInput } from "../../../../shad-cn-ui/SolidInput";
 import { useEffect, useState } from "react";
 export var SolidIconEditWidget = function (_a) {
     var _b, _c, _d;
     var formik = _a.formik, fieldContext = _a.fieldContext;
-    console.log("SolidIconWidget", "formik : ", formik, "fieldContext : ", fieldContext);
     var fieldMetadata = fieldContext.fieldMetadata;
     var fieldLayoutInfo = fieldContext.field;
     var fieldLabel = (_b = fieldLayoutInfo.attrs.label) !== null && _b !== void 0 ? _b : fieldMetadata.displayName;
@@ -61,6 +60,12 @@ export var SolidIconEditWidget = function (_a) {
         formik.setFieldValue(fieldName, "", true);
         // formik.setFieldValue("iconVariant", null);
     };
+    var formatIconLabel = function (icon) {
+        return icon
+            .split('_')
+            .map(function (word) { return word.charAt(0).toUpperCase() + word.slice(1); })
+            .join(' ');
+    };
     return (_jsxs("div", { children: [_jsx("label", { className: "form-field-label", children: fieldLabel }), _jsxs("div", { className: "flex align-items-end gap-3 mt-2", children: [_jsx("div", { style: { display: 'inline-block' }, children: selectedIcon ? (
                         // <Button
                         //     type="button"
@@ -68,36 +73,21 @@ export var SolidIconEditWidget = function (_a) {
                         //     onClick={() => setOpenIconDialog(true)}
                         //     outlined
                         // />
-                        _jsxs("div", { children: [_jsx("span", { className: "material-symbols-outlined", style: { fontSize: 48, cursor: 'pointer' }, onClick: function () { return setOpenIconDialog(true); }, children: selectedIcon }), _jsx("p", { className: "mb-0 text-center", children: selectedIcon
-                                        .split('_')
-                                        .map(function (word) { return word.charAt(0).toUpperCase() + word.slice(1); })
-                                        .join(' ') })] })) : (_jsx(SolidButton, { type: "button", size: "small", label: "Select Icon", onClick: function () { return setOpenIconDialog(true); }, variant: "outline" })) }), selectedIcon && (_jsx("div", { children: _jsx(SolidButton, { type: "button", label: "Remove", className: "p-button-text p-button-danger ml-2", onClick: function () {
-                                setSelectedIcon("");
-                                formik.setFieldValue(fieldName, "");
-                            } }) }))] }), _jsx(SolidDialog, { contentClassName: "p-0", className: "solid-icon-dialog", contentStyle: { borderRadius: 6 }, showHeader: false, header: false, visible: openIconDialog, style: { width: '70vw', height: '70vh' }, breakpoints: { '1024px': '75vw', '991px': '90vw', '767px': '94w', '250px': '96vw' }, onHide: function () { return setOpenIconDialog(false); }, children: _jsx("div", { children: _jsxs("div", { className: "grid m-0 flex-column md:flex-row ", children: [_jsx("div", { className: "col-12 lg:col-3 p-0", children: _jsxs("div", { className: "flex flex-column justify-content-between p-3 lg:p-4", style: { height: '100%' }, children: [_jsxs("div", { className: "", children: [_jsx("p", { className: "font-medium", children: "Category" }), _jsx("div", { style: { marginBottom: "1rem", display: "flex", gap: "1rem", flexWrap: "wrap" }, className: "solid-icon-category-wrapper", children: tabs.map(function (tab) { return (_jsx(SolidButton, { type: 'button', size: "small", onClick: function () {
+                        _jsxs("div", { children: [_jsx("span", { className: "material-symbols-outlined", style: { fontSize: 48, cursor: 'pointer' }, onClick: function () { return setOpenIconDialog(true); }, children: selectedIcon }), _jsx("p", { className: "mb-0 text-center", children: formatIconLabel(selectedIcon) })] })) : (_jsx(SolidButton, { type: "button", size: "sm", variant: "outline", onClick: function () { return setOpenIconDialog(true); }, children: "Select Icon" })) }), selectedIcon && (_jsx("div", { children: _jsx(SolidButton, { type: "button", variant: "ghost", className: "ml-2", onClick: handleRemoveIcon, children: "Remove" }) }))] }), _jsxs(SolidDialog, { open: openIconDialog, onOpenChange: setOpenIconDialog, className: "solid-icon-dialog p-0", style: { width: '70vw', height: '70vh', borderRadius: 6 }, showHeader: false, breakpoints: { '1024px': '75vw', '991px': '90vw', '767px': '94w', '250px': '96vw' }, children: [_jsxs(SolidDialogHeader, { children: [_jsx(SolidDialogTitle, { children: "Select Icon" }), _jsx(SolidDialogClose, {})] }), _jsx(SolidDialogBody, { className: "p-0", children: _jsxs("div", { className: "grid m-0 flex-column md:flex-row ", children: [_jsx("div", { className: "col-12 lg:col-3 p-0", children: _jsx("div", { className: "flex flex-column justify-content-between p-3 lg:p-4", style: { height: '100%' }, children: _jsxs("div", { className: "", children: [_jsx("p", { className: "font-medium", children: "Category" }), _jsx("div", { style: { marginBottom: "1rem", display: "flex", gap: "1rem", flexWrap: "wrap" }, className: "solid-icon-category-wrapper", children: tabs.map(function (tab) { return (_jsx(SolidButton, { type: 'button', size: "sm", onClick: function () {
                                                             setSelectedCategory(tab);
                                                             setSearchIcon("");
                                                         }, variant: selectedCategory === tab ? "primary" : "outline", style: {
                                                             padding: "8px 16px",
                                                             fontSize: 12
-                                                        }, className: "solid-icon-category", severity: "secondary", children: tab }, tab)); }) })] }), _jsxs("div", { className: "flex gap-3", children: [_jsx(SolidButton, { type: "button", size: "small", label: "Select", onClick: function () { return setOpenIconDialog(false); } }), _jsx(SolidButton, { type: "button", size: "small", variant: "outline", label: "Cancel", onClick: function () { return setOpenIconDialog(false); } })] })] }) }), _jsx("div", { className: "col-6 p-0 flex lg:hidden", children: _jsxs("div", { className: "p-3 lg:p-4", children: [_jsx("p", { className: "font-medium", children: "Selected Icon" }), selectedIcon && (_jsxs(_Fragment, { children: [_jsx("div", { className: "flex justify-content-center", children: _jsx("span", { className: "material-symbols-outlined", style: { fontSize: 100 }, children: selectedIcon }) }), _jsx("p", { className: 'mt-2 text-center', children: selectedIcon
-                                                        .split('_')
-                                                        .map(function (word) { return word.charAt(0).toUpperCase() + word.slice(1); })
-                                                        .join(' ') })] }))] }) }), _jsxs("div", { className: "col-12 lg:col-6 p-0", style: { borderLeft: '1px solid var(--primary-light-color)', borderRight: '1px solid var(--primary-light-color)' }, children: [_jsx("div", { className: "px-3 lg:px-4 pt-3 lg:pt-4", children: _jsxs("div", { children: [_jsx("p", { className: "font-medium", children: "Select Icon" }), _jsx(SolidInput, { type: "text", placeholder: "Search icons in \"".concat(selectedCategory, "\""), value: searchIcon, onChange: function (e) { return setSearchIcon(e.target.value); }, className: "w-full" })] }) }), _jsx("div", { style: { height: 'calc(70vh - 125px)', overflowY: 'auto', overflowX: 'hidden' }, className: "px-4 pb-3 mt-4", children: _jsx("div", { className: "grid", children: filteredIcons.length > 0 ? (filteredIcons.map(function (_a) {
-                                                var icon = _a.icon, category = _a.category;
-                                                return (_jsx("div", { className: "col-3", children: _jsxs("div", { className: "w-full flex flex-column align-items-center justify-content-center gap-3", children: [_jsx("span", { className: "material-symbols-outlined", style: {
-                                                                    fontSize: 32,
-                                                                    cursor: "pointer",
-                                                                    padding: "8px",
-                                                                    border: selectedIcon === icon ? "2px solid var(--primary-color)" : "2px solid transparent",
-                                                                    borderRadius: "6px",
-                                                                }, onClick: function () { return handleSelectIcon(icon); }, title: "".concat(icon, " (").concat(category, ")"), children: icon }), _jsx("p", { className: 'mb-0 mt-1 text-center', children: icon
-                                                                    .split('_')
-                                                                    .map(function (word) { return word.charAt(0).toUpperCase() + word.slice(1); })
-                                                                    .join(' ') })] }) }, icon));
-                                            })) : (_jsx("p", { className: "mt", children: "No icons found." })) }) })] }), _jsx("div", { className: "col-3 p-0 hidden lg:flex", children: _jsxs("div", { className: "p-3 lg:p-4", children: [_jsx("p", { className: "font-medium", children: "Selected Icon" }), selectedIcon && (_jsxs(_Fragment, { children: [_jsx("div", { className: "flex justify-content-center", children: _jsx("span", { className: "material-symbols-outlined", style: { fontSize: 100 }, children: selectedIcon }) }), _jsx("p", { className: 'mt-2 text-center', children: selectedIcon
-                                                        .split('_')
-                                                        .map(function (word) { return word.charAt(0).toUpperCase() + word.slice(1); })
-                                                        .join(' ') })] }))] }) })] }) }) })] }));
+                                                        }, className: "solid-icon-category", children: tab }, tab)); }) })] }) }) }), _jsx("div", { className: "col-6 p-0 flex lg:hidden", children: _jsxs("div", { className: "p-3 lg:p-4", children: [_jsx("p", { className: "font-medium", children: "Selected Icon" }), selectedIcon && (_jsxs(_Fragment, { children: [_jsx("div", { className: "flex justify-content-center", children: _jsx("span", { className: "material-symbols-outlined", style: { fontSize: 100 }, children: selectedIcon }) }), _jsx("p", { className: 'mt-2 text-center', children: formatIconLabel(selectedIcon) })] }))] }) }), _jsxs("div", { className: "col-12 lg:col-6 p-0", style: { borderLeft: '1px solid var(--primary-light-color)', borderRight: '1px solid var(--primary-light-color)' }, children: [_jsx("div", { className: "px-3 lg:px-4 pt-3 lg:pt-4", children: _jsxs("div", { children: [_jsx("p", { className: "font-medium", children: "Select Icon" }), _jsx(SolidInput, { type: "text", placeholder: "Search icons in \"".concat(selectedCategory, "\""), value: searchIcon, onChange: function (e) { return setSearchIcon(e.target.value); }, className: "w-full" })] }) }), _jsx("div", { style: { height: 'calc(70vh - 125px)', overflowY: 'auto', overflowX: 'hidden' }, className: "px-4 pb-3 mt-4", children: _jsx("div", { className: "grid", children: filteredIcons.length > 0 ? (filteredIcons.map(function (_a) {
+                                                    var icon = _a.icon, category = _a.category;
+                                                    return (_jsx("div", { className: "col-3", children: _jsxs("div", { className: "w-full flex flex-column align-items-center justify-content-center gap-3", children: [_jsx("span", { className: "material-symbols-outlined", style: {
+                                                                        fontSize: 32,
+                                                                        cursor: "pointer",
+                                                                        padding: "8px",
+                                                                        border: selectedIcon === icon ? "2px solid var(--primary-color)" : "2px solid transparent",
+                                                                        borderRadius: "6px",
+                                                                    }, onClick: function () { return handleSelectIcon(icon); }, title: "".concat(icon, " (").concat(category, ")"), children: icon }), _jsx("p", { className: 'mb-0 mt-1 text-center', children: formatIconLabel(icon) })] }) }, icon));
+                                                })) : (_jsx("p", { className: "mt", children: "No icons found." })) }) })] }), _jsx("div", { className: "col-3 p-0 hidden lg:flex", children: _jsxs("div", { className: "p-3 lg:p-4", children: [_jsx("p", { className: "font-medium", children: "Selected Icon" }), selectedIcon && (_jsxs(_Fragment, { children: [_jsx("div", { className: "flex justify-content-center", children: _jsx("span", { className: "material-symbols-outlined", style: { fontSize: 100 }, children: selectedIcon }) }), _jsx("p", { className: 'mt-2 text-center', children: formatIconLabel(selectedIcon) })] }))] }) })] }) }), _jsxs(SolidDialogFooter, { className: "gap-3", children: [_jsx(SolidButton, { type: "button", size: "sm", onClick: function () { return setOpenIconDialog(false); }, children: "Select" }), _jsx(SolidButton, { type: "button", size: "sm", variant: "outline", onClick: function () { return setOpenIconDialog(false); }, children: "Cancel" })] })] })] }));
 };
 //# sourceMappingURL=SolidIconEditWidget.js.map

package/dist/components/core/form/fields/widgets/SolidIconEditWidget.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SolidIconEditWidget.js","sourceRoot":"","sources":["../../../../../../src/components/core/form/fields/widgets/SolidIconEditWidget.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport { solidIcons } from \"../../../../../helpers/solidIcons\";\nimport { SolidFormFieldWidgetProps } from \"../../../../../types/solid-core\";\nimport { SolidButton } from \"../../../../shad-cn-ui/SolidButton\";\nimport { SolidDialog } from \"../../../../shad-cn-ui/SolidDialog\";\nimport { SolidSelect } from \"../../../../shad-cn-ui/SolidSelect\";\nimport { SolidInput } from \"../../../../shad-cn-ui/SolidInput\";\nimport { useEffect, useState } from \"react\";\n\nexport const SolidIconEditWidget = ({ formik, fieldContext }: SolidFormFieldWidgetProps) => {\n console.log(\"SolidIconWidget\", \"formik : \", formik, \"fieldContext : \", fieldContext);\n\n const fieldMetadata = fieldContext.fieldMetadata;\n const fieldLayoutInfo = fieldContext.field;\n const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;\n const fieldName = fieldLayoutInfo?.attrs?.name;\n\n const [openIconDialog, setOpenIconDialog] = useState(false);\n const [selectedCategory, setSelectedCategory] = useState(\"All\");\n const [searchIcon, setSearchIcon] = useState(\"\");\n const [selectedIcon, setSelectedIcon] = useState(formik.values?.[fieldName] \|\| \"\");\n\n // const [iconVariant, setIconVariant] = useState(formik.values.iconVariant \|\| \"outlined\");\n\n // const iconVariants = [\n // { label: \"Outlined\", value: \"outlined\" },\n // { label: \"Rounded\", value: \"rounded\" },\n // { label: \"Sharp\", value: \"sharp\" }\n // ];\n\n const allIcons = solidIcons.flatMap(({ category, icons }) =>\n icons.map((icon) => ({ icon, category }))\n );\n\n const filteredIcons = (selectedCategory === \"All\" ? allIcons :\n allIcons.filter((i) => i.category === selectedCategory)\n ).filter(({ icon }) => icon.toLowerCase().includes(searchIcon.toLowerCase()));\n\n const tabs = [\"All\", ...solidIcons.map((c) => c.category)];\n\n useEffect(() => {\n if (openIconDialog) {\n setSelectedIcon(formik?.values?.[fieldName] ?? \"\");\n // setIconVariant(formik.values.iconVariant ?? \"outlined\");\n }\n }, [openIconDialog]);\n\n const handleSelectIcon = (icon: string) => {\n setSelectedIcon(icon);\n // setIconVariant(variant)\n formik.setFieldValue(fieldName, icon);\n // formik.setFieldValue(\"iconVariant\", variant);\n };\n\n const handleRemoveIcon = () => {\n setSelectedIcon(\"\");\n // setIconVariant(null)\n formik.setFieldTouched(fieldName, true);\n formik.setFieldValue(fieldName, \"\", true);\n // formik.setFieldValue(\"iconVariant\", null);\n };\n\n return (\n <div>\n <label className=\"form-field-label\">{fieldLabel}</label>\n <div className=\"flex align-items-end gap-3 mt-2\">\n <div style={{ display: 'inline-block' }}>\n {selectedIcon ? (\n // <Button\n // type=\"button\"\n // icon={<span className={`material-symbols-outlined`}>{selectedIcon}</span>}\n // onClick={() => setOpenIconDialog(true)}\n // outlined\n // />\n <div>\n <span className={`material-symbols-outlined`} style={{ fontSize: 48, cursor: 'pointer' }} onClick={() => setOpenIconDialog(true)}>\n {selectedIcon}\n </span>\n <p className=\"mb-0 text-center\">\n {selectedIcon\n .split('_')\n .map((word: string) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(' ')\n }\n </p>\n </div>\n ) : (\n <SolidButton\n type=\"button\"\n size=\"small\"\n label=\"Select Icon\"\n onClick={() => setOpenIconDialog(true)}\n variant=\"outline\"\n />\n )}\n </div>\n {selectedIcon && (\n <div>\n <SolidButton\n type=\"button\"\n label=\"Remove\"\n className=\"p-button-text p-button-danger ml-2\"\n onClick={() => {\n setSelectedIcon(\"\");\n formik.setFieldValue(fieldName, \"\");\n }}\n />\n </div>\n )}\n </div>\n <SolidDialog contentClassName=\"p-0\" className=\"solid-icon-dialog\" contentStyle={{ borderRadius: 6 }} showHeader={false} header={false} visible={openIconDialog} style={{ width: '70vw', height: '70vh' }} breakpoints={{ '1024px': '75vw','991px': '90vw','767px':'94w', '250px': '96vw'}} onHide={() => setOpenIconDialog(false)}>\n <div>\n <div className=\"grid m-0 flex-column md:flex-row \">\n <div className=\"col-12 lg:col-3 p-0\">\n <div className=\"flex flex-column justify-content-between p-3 lg:p-4\" style={{ height: '100%' }}>\n <div className=\"\">\n {/* <p className=\"font-medium\">Variant</p>\n <Dropdown\n value={iconVariant}\n onChange={(e) => setIconVariant(e.value)}\n options={iconVariants}\n optionLabel=\"label\"\n className=\"w-full mb-3\"\n checkmark\n highlightOnSelect={false}\n placeholder=\"Select Variant\"\n /> /}\n\n <p className=\"font-medium\">Category</p>\n <div style={{ marginBottom: \"1rem\", display: \"flex\", gap: \"1rem\", flexWrap: \"wrap\" }} className=\"solid-icon-category-wrapper\">\n {tabs.map((tab) => (\n <SolidButton\n type='button'\n key={tab}\n size=\"small\"\n onClick={() => {\n setSelectedCategory(tab);\n setSearchIcon(\"\");\n }}\n variant={selectedCategory === tab ? \"primary\" : \"outline\"}\n style={{\n padding: \"8px 16px\",\n fontSize: 12\n }}\n className=\"solid-icon-category\"\n severity=\"secondary\"\n >\n {tab}\n </SolidButton>\n ))}\n </div>\n </div>\n <div className=\"flex gap-3\">\n <SolidButton type=\"button\" size=\"small\" label=\"Select\" onClick={() => setOpenIconDialog(false)} />\n <SolidButton type=\"button\" size=\"small\" variant=\"outline\" label=\"Cancel\" onClick={() => setOpenIconDialog(false)} />\n </div>\n </div>\n </div>\n\n <div className=\"col-6 p-0 flex lg:hidden\">\n <div className=\"p-3 lg:p-4\">\n <p className=\"font-medium\">Selected Icon</p>\n {selectedIcon && (\n <>\n <div className=\"flex justify-content-center\">\n <span className={`material-symbols-outlined`} style={{ fontSize: 100 }}>\n {selectedIcon}\n </span>\n </div>\n <p className='mt-2 text-center'>\n {selectedIcon\n .split('_')\n .map((word: any) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(' ')\n }\n </p>\n {/ <code className=\"mt-2 d-block\">\n {`<span class=\"material-symbols-${iconVariant \|\| \"outlined\"}\">${selectedIcon}</span>`}\n </code> /}\n </>\n )}\n </div>\n\n </div>\n <div className=\"col-12 lg:col-6 p-0\" style={{ borderLeft: '1px solid var(--primary-light-color)', borderRight: '1px solid var(--primary-light-color)' }}>\n <div className=\"px-3 lg:px-4 pt-3 lg:pt-4\">\n <div>\n <p className=\"font-medium\">Select Icon</p>\n <SolidInput\n type=\"text\"\n placeholder={`Search icons in \"${selectedCategory}\"`}\n value={searchIcon}\n onChange={(e) => setSearchIcon(e.target.value)}\n className=\"w-full\"\n />\n </div>\n </div>\n <div style={{ height: 'calc(70vh - 125px)', overflowY: 'auto', overflowX: 'hidden' }} className=\"px-4 pb-3 mt-4\">\n <div className=\"grid\">\n {filteredIcons.length > 0 ? (\n filteredIcons.map(({ icon, category }) => (\n <div className=\"col-3\" key={icon}>\n <div className=\"w-full flex flex-column align-items-center justify-content-center gap-3\">\n <span\n className={`material-symbols-outlined`}\n style={{\n fontSize: 32,\n cursor: \"pointer\",\n padding: \"8px\",\n border: selectedIcon === icon ? \"2px solid var(--primary-color)\" : \"2px solid transparent\",\n borderRadius: \"6px\",\n }}\n onClick={() => handleSelectIcon(icon)}\n title={`${icon} (${category})`}\n >\n {icon}\n </span>\n <p className='mb-0 mt-1 text-center'>\n {icon\n .split('_')\n .map(word => word.charAt(0).toUpperCase() + word.slice(1))\n .join(' ')\n }\n </p>\n </div>\n </div>\n ))\n ) : (\n <p className=\"mt\">No icons found.</p>\n )}\n </div>\n </div>\n </div>\n\n <div className=\"col-3 p-0 hidden lg:flex\">\n <div className=\"p-3 lg:p-4\">\n <p className=\"font-medium\">Selected Icon</p>\n {selectedIcon && (\n <>\n <div className=\"flex justify-content-center\">\n <span className={`material-symbols-outlined`} style={{ fontSize: 100 }}>\n {selectedIcon}\n </span>\n </div>\n <p className='mt-2 text-center'>\n {selectedIcon\n .split('_')\n .map((word: any) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(' ')\n }\n </p>\n {/ <code className=\"mt-2 d-block\">\n {`<span class=\"material-symbols-${iconVariant \|\| \"outlined\"}\">${selectedIcon}</span>`}\n </code> */}\n </>\n )}\n </div>\n\n </div>\n </div>\n </div>\n </SolidDialog>\n </div>\n );\n};\n"]}
1	+ {"version":3,"file":"SolidIconEditWidget.js","sourceRoot":"","sources":["../../../../../../src/components/core/form/fields/widgets/SolidIconEditWidget.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport { solidIcons } from \"../../../../../helpers/solidIcons\";\nimport { SolidFormFieldWidgetProps } from \"../../../../../types/solid-core\";\nimport { SolidButton } from \"../../../../shad-cn-ui/SolidButton\";\nimport {\n SolidDialog,\n SolidDialogBody,\n SolidDialogClose,\n SolidDialogFooter,\n SolidDialogHeader,\n SolidDialogTitle,\n} from \"../../../../shad-cn-ui/SolidDialog\";\nimport { SolidInput } from \"../../../../shad-cn-ui/SolidInput\";\nimport { useEffect, useState } from \"react\";\n\nexport const SolidIconEditWidget = ({ formik, fieldContext }: SolidFormFieldWidgetProps) => {\n const fieldMetadata = fieldContext.fieldMetadata;\n const fieldLayoutInfo = fieldContext.field;\n const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;\n const fieldName = fieldLayoutInfo?.attrs?.name;\n\n const [openIconDialog, setOpenIconDialog] = useState(false);\n const [selectedCategory, setSelectedCategory] = useState(\"All\");\n const [searchIcon, setSearchIcon] = useState(\"\");\n const [selectedIcon, setSelectedIcon] = useState(formik.values?.[fieldName] \|\| \"\");\n\n // const [iconVariant, setIconVariant] = useState(formik.values.iconVariant \|\| \"outlined\");\n\n // const iconVariants = [\n // { label: \"Outlined\", value: \"outlined\" },\n // { label: \"Rounded\", value: \"rounded\" },\n // { label: \"Sharp\", value: \"sharp\" }\n // ];\n\n const allIcons = solidIcons.flatMap(({ category, icons }) =>\n icons.map((icon) => ({ icon, category }))\n );\n\n const filteredIcons = (selectedCategory === \"All\" ? allIcons :\n allIcons.filter((i) => i.category === selectedCategory)\n ).filter(({ icon }) => icon.toLowerCase().includes(searchIcon.toLowerCase()));\n\n const tabs = [\"All\", ...solidIcons.map((c) => c.category)];\n\n useEffect(() => {\n if (openIconDialog) {\n setSelectedIcon(formik?.values?.[fieldName] ?? \"\");\n // setIconVariant(formik.values.iconVariant ?? \"outlined\");\n }\n }, [openIconDialog]);\n\n const handleSelectIcon = (icon: string) => {\n setSelectedIcon(icon);\n // setIconVariant(variant)\n formik.setFieldValue(fieldName, icon);\n // formik.setFieldValue(\"iconVariant\", variant);\n };\n\n const handleRemoveIcon = () => {\n setSelectedIcon(\"\");\n // setIconVariant(null)\n formik.setFieldTouched(fieldName, true);\n formik.setFieldValue(fieldName, \"\", true);\n // formik.setFieldValue(\"iconVariant\", null);\n };\n\n const formatIconLabel = (icon: string) =>\n icon\n .split('_')\n .map((word: string) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(' ');\n\n return (\n <div>\n <label className=\"form-field-label\">{fieldLabel}</label>\n <div className=\"flex align-items-end gap-3 mt-2\">\n <div style={{ display: 'inline-block' }}>\n {selectedIcon ? (\n // <Button\n // type=\"button\"\n // icon={<span className={`material-symbols-outlined`}>{selectedIcon}</span>}\n // onClick={() => setOpenIconDialog(true)}\n // outlined\n // />\n <div>\n <span className={`material-symbols-outlined`} style={{ fontSize: 48, cursor: 'pointer' }} onClick={() => setOpenIconDialog(true)}>\n {selectedIcon}\n </span>\n <p className=\"mb-0 text-center\">\n {formatIconLabel(selectedIcon)}\n </p>\n </div>\n ) : (\n <SolidButton\n type=\"button\"\n size=\"sm\"\n variant=\"outline\"\n onClick={() => setOpenIconDialog(true)}\n >\n Select Icon\n </SolidButton>\n )}\n </div>\n {selectedIcon && (\n <div>\n <SolidButton\n type=\"button\"\n variant=\"ghost\"\n className=\"ml-2\"\n onClick={handleRemoveIcon}\n >\n Remove\n </SolidButton>\n </div>\n )}\n </div>\n <SolidDialog\n open={openIconDialog}\n onOpenChange={setOpenIconDialog}\n className=\"solid-icon-dialog p-0\"\n style={{ width: '70vw', height: '70vh', borderRadius: 6 }}\n showHeader={false}\n breakpoints={{ '1024px': '75vw','991px': '90vw','767px':'94w', '250px': '96vw'}}\n >\n <SolidDialogHeader>\n <SolidDialogTitle>Select Icon</SolidDialogTitle>\n <SolidDialogClose />\n </SolidDialogHeader>\n <SolidDialogBody className=\"p-0\">\n <div className=\"grid m-0 flex-column md:flex-row \">\n <div className=\"col-12 lg:col-3 p-0\">\n <div className=\"flex flex-column justify-content-between p-3 lg:p-4\" style={{ height: '100%' }}>\n <div className=\"\">\n {/* <p className=\"font-medium\">Variant</p>\n <Dropdown\n value={iconVariant}\n onChange={(e) => setIconVariant(e.value)}\n options={iconVariants}\n optionLabel=\"label\"\n className=\"w-full mb-3\"\n checkmark\n highlightOnSelect={false}\n placeholder=\"Select Variant\"\n /> /}\n\n <p className=\"font-medium\">Category</p>\n <div style={{ marginBottom: \"1rem\", display: \"flex\", gap: \"1rem\", flexWrap: \"wrap\" }} className=\"solid-icon-category-wrapper\">\n {tabs.map((tab) => (\n <SolidButton\n type='button'\n key={tab}\n size=\"sm\"\n onClick={() => {\n setSelectedCategory(tab);\n setSearchIcon(\"\");\n }}\n variant={selectedCategory === tab ? \"primary\" : \"outline\"}\n style={{\n padding: \"8px 16px\",\n fontSize: 12\n }}\n className=\"solid-icon-category\"\n >\n {tab}\n </SolidButton>\n ))}\n </div>\n </div>\n </div>\n </div>\n\n <div className=\"col-6 p-0 flex lg:hidden\">\n <div className=\"p-3 lg:p-4\">\n <p className=\"font-medium\">Selected Icon</p>\n {selectedIcon && (\n <>\n <div className=\"flex justify-content-center\">\n <span className={`material-symbols-outlined`} style={{ fontSize: 100 }}>\n {selectedIcon}\n </span>\n </div>\n <p className='mt-2 text-center'>{formatIconLabel(selectedIcon)}</p>\n {/ <code className=\"mt-2 d-block\">\n {`<span class=\"material-symbols-${iconVariant \|\| \"outlined\"}\">${selectedIcon}</span>`}\n </code> /}\n </>\n )}\n </div>\n\n </div>\n <div className=\"col-12 lg:col-6 p-0\" style={{ borderLeft: '1px solid var(--primary-light-color)', borderRight: '1px solid var(--primary-light-color)' }}>\n <div className=\"px-3 lg:px-4 pt-3 lg:pt-4\">\n <div>\n <p className=\"font-medium\">Select Icon</p>\n <SolidInput\n type=\"text\"\n placeholder={`Search icons in \"${selectedCategory}\"`}\n value={searchIcon}\n onChange={(e) => setSearchIcon(e.target.value)}\n className=\"w-full\"\n />\n </div>\n </div>\n <div style={{ height: 'calc(70vh - 125px)', overflowY: 'auto', overflowX: 'hidden' }} className=\"px-4 pb-3 mt-4\">\n <div className=\"grid\">\n {filteredIcons.length > 0 ? (\n filteredIcons.map(({ icon, category }) => (\n <div className=\"col-3\" key={icon}>\n <div className=\"w-full flex flex-column align-items-center justify-content-center gap-3\">\n <span\n className={`material-symbols-outlined`}\n style={{\n fontSize: 32,\n cursor: \"pointer\",\n padding: \"8px\",\n border: selectedIcon === icon ? \"2px solid var(--primary-color)\" : \"2px solid transparent\",\n borderRadius: \"6px\",\n }}\n onClick={() => handleSelectIcon(icon)}\n title={`${icon} (${category})`}\n >\n {icon}\n </span>\n <p className='mb-0 mt-1 text-center'>\n {formatIconLabel(icon)}\n </p>\n </div>\n </div>\n ))\n ) : (\n <p className=\"mt\">No icons found.</p>\n )}\n </div>\n </div>\n </div>\n\n <div className=\"col-3 p-0 hidden lg:flex\">\n <div className=\"p-3 lg:p-4\">\n <p className=\"font-medium\">Selected Icon</p>\n {selectedIcon && (\n <>\n <div className=\"flex justify-content-center\">\n <span className={`material-symbols-outlined`} style={{ fontSize: 100 }}>\n {selectedIcon}\n </span>\n </div>\n <p className='mt-2 text-center'>{formatIconLabel(selectedIcon)}</p>\n {/ <code className=\"mt-2 d-block\">\n {`<span class=\"material-symbols-${iconVariant \|\| \"outlined\"}\">${selectedIcon}</span>`}\n </code> */}\n </>\n )}\n </div>\n\n </div>\n </div>\n </SolidDialogBody>\n <SolidDialogFooter className=\"gap-3\">\n <SolidButton type=\"button\" size=\"sm\" onClick={() => setOpenIconDialog(false)}>\n Select\n </SolidButton>\n <SolidButton type=\"button\" size=\"sm\" variant=\"outline\" onClick={() => setOpenIconDialog(false)}>\n Cancel\n </SolidButton>\n </SolidDialogFooter>\n </SolidDialog>\n </div>\n );\n};\n"]}

package/dist/components/core/form/fields/widgets/SolidIconEditWidget.tsx CHANGED Viewed

@@ -2,14 +2,18 @@
 import { solidIcons } from "../../../../../helpers/solidIcons";
 import { SolidFormFieldWidgetProps } from "../../../../../types/solid-core";
 import { SolidButton } from "../../../../shad-cn-ui/SolidButton";
-import { SolidDialog } from "../../../../shad-cn-ui/SolidDialog";
-import { SolidSelect } from "../../../../shad-cn-ui/SolidSelect";
+import {
+    SolidDialog,
+    SolidDialogBody,
+    SolidDialogClose,
+    SolidDialogFooter,
+    SolidDialogHeader,
+    SolidDialogTitle,
+} from "../../../../shad-cn-ui/SolidDialog";
 import { SolidInput } from "../../../../shad-cn-ui/SolidInput";
 import { useEffect, useState } from "react";
 export const SolidIconEditWidget = ({ formik, fieldContext }: SolidFormFieldWidgetProps) => {
-    console.log("SolidIconWidget", "formik : ", formik, "fieldContext : ", fieldContext);
     const fieldMetadata = fieldContext.fieldMetadata;
     const fieldLayoutInfo = fieldContext.field;
     const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;
@@ -60,6 +64,12 @@ export const SolidIconEditWidget = ({ formik, fieldContext }: SolidFormFieldWidg
         // formik.setFieldValue("iconVariant", null);
     };
+    const formatIconLabel = (icon: string) =>
+        icon
+            .split('_')
+            .map((word: string) => word.charAt(0).toUpperCase() + word.slice(1))
+            .join(' ');
     return (
         <div>
             <label className="form-field-label">{fieldLabel}</label>
@@ -77,39 +87,46 @@ export const SolidIconEditWidget = ({ formik, fieldContext }: SolidFormFieldWidg
                                 {selectedIcon}
                             </span>
                             <p className="mb-0 text-center">
-                                {selectedIcon
-                                    .split('_')
-                                    .map((word: string) => word.charAt(0).toUpperCase() + word.slice(1))
-                                    .join(' ')
-                                }
+                                {formatIconLabel(selectedIcon)}
                             </p>
                         </div>
                     ) : (
                         <SolidButton
                             type="button"
-                            size="small"
-                            label="Select Icon"
-                            onClick={() => setOpenIconDialog(true)}
+                            size="sm"
                             variant="outline"
-                        />
+                            onClick={() => setOpenIconDialog(true)}
+                        >
+                            Select Icon
+                        </SolidButton>
                     )}
                 </div>
                 {selectedIcon && (
                     <div>
                         <SolidButton
                             type="button"
-                            label="Remove"
-                            className="p-button-text p-button-danger ml-2"
-                            onClick={() => {
-                                setSelectedIcon("");
-                                formik.setFieldValue(fieldName, "");
-                            }}
-                        />
+                            variant="ghost"
+                            className="ml-2"
+                            onClick={handleRemoveIcon}
+                        >
+                            Remove
+                        </SolidButton>
                     </div>
                 )}
             </div>
-            <SolidDialog contentClassName="p-0" className="solid-icon-dialog" contentStyle={{ borderRadius: 6 }} showHeader={false} header={false} visible={openIconDialog} style={{ width: '70vw', height: '70vh' }} breakpoints={{ '1024px': '75vw','991px': '90vw','767px':'94w', '250px': '96vw'}} onHide={() => setOpenIconDialog(false)}>
-                <div>
+            <SolidDialog
+                open={openIconDialog}
+                onOpenChange={setOpenIconDialog}
+                className="solid-icon-dialog p-0"
+                style={{ width: '70vw', height: '70vh', borderRadius: 6 }}
+                showHeader={false}
+                breakpoints={{ '1024px': '75vw','991px': '90vw','767px':'94w', '250px': '96vw'}}
+            >
+                <SolidDialogHeader>
+                    <SolidDialogTitle>Select Icon</SolidDialogTitle>
+                    <SolidDialogClose />
+                </SolidDialogHeader>
+                <SolidDialogBody className="p-0">
                     <div className="grid m-0 flex-column md:flex-row ">
                         <div className="col-12 lg:col-3 p-0">
                             <div className="flex flex-column justify-content-between p-3 lg:p-4" style={{ height: '100%' }}>
@@ -132,7 +149,7 @@ export const SolidIconEditWidget = ({ formik, fieldContext }: SolidFormFieldWidg
                                             <SolidButton
                                                 type='button'
                                                 key={tab}
-                                                size="small"
+                                                size="sm"
                                                 onClick={() => {
                                                     setSelectedCategory(tab);
                                                     setSearchIcon("");
@@ -143,17 +160,12 @@ export const SolidIconEditWidget = ({ formik, fieldContext }: SolidFormFieldWidg
                                                     fontSize: 12
                                                 }}
                                                 className="solid-icon-category"
-                                                severity="secondary"
                                             >
                                                 {tab}
                                             </SolidButton>
                                         ))}
                                     </div>
                                 </div>
-                                <div className="flex gap-3">
-                                    <SolidButton type="button" size="small" label="Select" onClick={() => setOpenIconDialog(false)} />
-                                    <SolidButton type="button" size="small" variant="outline" label="Cancel" onClick={() => setOpenIconDialog(false)} />
-                                </div>
                             </div>
                         </div>
@@ -167,13 +179,7 @@ export const SolidIconEditWidget = ({ formik, fieldContext }: SolidFormFieldWidg
                                                 {selectedIcon}
                                             </span>
                                         </div>
-                                        <p className='mt-2 text-center'>
-                                            {selectedIcon
-                                                .split('_')
-                                                .map((word: any) => word.charAt(0).toUpperCase() + word.slice(1))
-                                                .join(' ')
-                                            }
-                                        </p>
+                                        <p className='mt-2 text-center'>{formatIconLabel(selectedIcon)}</p>
                                         {/* <code className="mt-2 d-block">
                                             {`<span class="material-symbols-${iconVariant || "outlined"}">${selectedIcon}</span>`}
                                         </code> */}
@@ -216,11 +222,7 @@ export const SolidIconEditWidget = ({ formik, fieldContext }: SolidFormFieldWidg
                                                         {icon}
                                                     </span>
                                                     <p className='mb-0 mt-1 text-center'>
-                                                        {icon
-                                                            .split('_')
-                                                            .map(word => word.charAt(0).toUpperCase() + word.slice(1))
-                                                            .join(' ')
-                                                        }
+                                                        {formatIconLabel(icon)}
                                                     </p>
                                                 </div>
                                             </div>
@@ -242,13 +244,7 @@ export const SolidIconEditWidget = ({ formik, fieldContext }: SolidFormFieldWidg
                                                 {selectedIcon}
                                             </span>
                                         </div>
-                                        <p className='mt-2 text-center'>
-                                            {selectedIcon
-                                                .split('_')
-                                                .map((word: any) => word.charAt(0).toUpperCase() + word.slice(1))
-                                                .join(' ')
-                                            }
-                                        </p>
+                                        <p className='mt-2 text-center'>{formatIconLabel(selectedIcon)}</p>
                                         {/* <code className="mt-2 d-block">
                                             {`<span class="material-symbols-${iconVariant || "outlined"}">${selectedIcon}</span>`}
                                         </code> */}
@@ -258,7 +254,15 @@ export const SolidIconEditWidget = ({ formik, fieldContext }: SolidFormFieldWidg
                         </div>
                     </div>
-                </div>
+                </SolidDialogBody>
+                <SolidDialogFooter className="gap-3">
+                    <SolidButton type="button" size="sm" onClick={() => setOpenIconDialog(false)}>
+                        Select
+                    </SolidButton>
+                    <SolidButton type="button" size="sm" variant="outline" onClick={() => setOpenIconDialog(false)}>
+                        Cancel
+                    </SolidButton>
+                </SolidDialogFooter>
             </SolidDialog>
         </div>
     );

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

@@ -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 ADDED Viewed

	@@ -0,0 +1 @@
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"}