@solidstarters/solid-core-ui 1.1.70 → 1.1.71

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

@@ -0,0 +1,272 @@
+'use client';
+import { AutoComplete, AutoCompleteCompleteEvent } from "primereact/autocomplete";
+import { Message } from "primereact/message";
+import { useState } from "react";
+import * as Yup from 'yup';
+import { Schema } from "yup";
+import { FormikObject, ISolidField, SolidFieldProps } from "./ISolidField";
+import { getExtensionComponent } from "@/helpers/registry";
+import { SolidFormFieldWidgetProps } from "@/types/solid-core";
+import { RadioButton } from "primereact/radiobutton";
+
+export class SolidSelectionStaticField implements ISolidField {
+
+    private fieldContext: SolidFieldProps;
+
+    constructor(fieldContext: SolidFieldProps) {
+        this.fieldContext = fieldContext;
+    }
+
+    updateFormData(value: any, formData: FormData): any {
+        const fieldLayoutInfo = this.fieldContext.field;
+        if (value) {
+            formData.append(fieldLayoutInfo.attrs.name, value.value);
+        }
+    }
+
+    initialValue(): any {
+        // Get field name and metadata
+        const fieldName = this.fieldContext.field.attrs.name;
+        const fieldMetadata = this.fieldContext.fieldMetadata;
+        const fieldDefaultValue = fieldMetadata?.defaultValue;
+
+        // Get existing value from form data
+        const existingValue = this.fieldContext.data[fieldName];
+
+        // Function to get display value based on selectionStaticValues
+        const getDisplayValue = (value: string | null): string | null => {
+            if (!value) return null;
+            for (const item of fieldMetadata.selectionStaticValues) {
+                const [lhs, rhs] = item.split(':');
+                if (lhs === value) {
+                    return rhs;
+                }
+            }
+            return null;
+        };
+
+        // Determine the final value to use (existing value or default value)
+        const finalValue = existingValue ?? fieldDefaultValue ?? '';
+
+        // Get display value for the final value
+        const displayValue = getDisplayValue(finalValue);
+
+        return { label: displayValue ?? '', value: finalValue };
+    }
+
+
+    validationSchema(): Schema {
+
+        const fieldMetadata = this.fieldContext.fieldMetadata;
+        const fieldLayoutInfo = this.fieldContext.field;
+        const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;
+        let schema = Yup.object({
+            value: Yup.string().required(`${fieldLabel} is required.`)
+        });
+
+        // 1. required 
+        if (fieldMetadata.required) {
+            schema = schema.required(`${fieldLabel} is required.`);
+        }
+
+        return schema;
+    }
+
+    render(formik: FormikObject) {
+        const fieldMetadata = this.fieldContext.fieldMetadata;
+        const fieldLayoutInfo = this.fieldContext.field;
+        const className = fieldLayoutInfo.attrs?.className || 'field col-12';
+        const isFormFieldValid = (formik: any, fieldName: string) => formik.touched[fieldName] && formik.errors[fieldName];
+
+        let viewWidget = fieldLayoutInfo.attrs.viewWidget;
+        let editWidget = fieldLayoutInfo.attrs.editWidget;
+        if (!editWidget) {
+            editWidget = 'DefaultSelectionStaticAutocompleteFormEditWidget';
+        }
+        if (!viewWidget) {
+            viewWidget = 'DefaultSelectionStaticFormViewWidget';
+        }
+        const viewMode: string = this.fieldContext.viewMode;
+
+        return (
+            <>
+                <div className={className}>
+                    {viewMode === "view" &&
+                        this.renderExtensionRenderMode(viewWidget, formik)
+                    }
+                    {viewMode === "edit" &&
+                        <>
+                            {editWidget &&
+                                this.renderExtensionRenderMode(editWidget, formik)
+                            }
+                            {isFormFieldValid(formik, fieldLayoutInfo.attrs.name) && (
+                                <div className="absolute mt-1">
+                                    <Message severity="error" text={formik?.errors[fieldLayoutInfo.attrs.name]?.toString()} />
+                                </div>
+                            )}
+                        </>
+                    }
+                </div>
+            </>
+        );
+    }
+
+    renderExtensionRenderMode(widget: string, formik: FormikObject) {
+        let DynamicWidget = getExtensionComponent(widget);
+        const widgetProps: SolidFormFieldWidgetProps = {
+            formik: formik,
+            fieldContext: this.fieldContext,
+        }
+        return (
+            <>
+                {DynamicWidget && <DynamicWidget {...widgetProps} />}
+            </>
+        )
+    }
+
+}
+
+export const DefaultSelectionStaticAutocompleteFormEditWidget = ({ formik, fieldContext }: SolidFormFieldWidgetProps) => {
+    const fieldMetadata = fieldContext.fieldMetadata;
+    const fieldLayoutInfo = fieldContext.field;
+    const className = fieldLayoutInfo.attrs?.className || 'field col-12';
+    const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;
+    const fieldDescription = fieldLayoutInfo.attrs.description ?? fieldMetadata.description;
+    const solidFormViewMetaData = fieldContext.solidFormViewMetaData;
+    const showFieldLabel = fieldLayoutInfo?.attrs?.showLabel;
+    const readOnlyPermission = fieldContext.readOnly;
+    const fieldDisabled = fieldLayoutInfo.attrs?.disabled;
+    const fieldReadonly = fieldLayoutInfo.attrs?.readonly;
+
+    const formDisabled = solidFormViewMetaData.data.solidView?.layout?.attrs?.disabled;
+    const formReadonly = solidFormViewMetaData.data.solidView?.layout?.attrs?.readonly;
+
+    const [selectionStaticItems, setSelectionStaticItems] = useState([]);
+    const selectionStaticSearch = (event: AutoCompleteCompleteEvent) => {
+        const selectionStaticData = fieldMetadata.selectionStaticValues.map((i: string) => {
+            return {
+                label: i.split(":")[1],
+                value: i.split(":")[0]
+            }
+        });
+        const suggestionData = selectionStaticData.filter((t: any) => t.value.toLowerCase().startsWith(event.query.toLowerCase()));
+        setSelectionStaticItems(suggestionData)
+    }
+    const isFormFieldValid = (formik: any, fieldName: string) => formik.touched[fieldName] && formik.errors[fieldName];
+
+    return (
+        <div className="relative">
+            <div className="flex flex-column gap-2 mt-4">
+                {showFieldLabel != false &&
+                    <label htmlFor={fieldLayoutInfo.attrs.name} className="form-field-label font-medium">{fieldLabel}
+                        {fieldMetadata.required && <span className="text-red-500"> *</span>}
+                        {/* &nbsp;   {fieldDescription && <span className="form_field_help">({fieldDescription}) </span>} */}
+                    </label>
+                }
+                <AutoComplete
+                    readOnly={formReadonly || fieldReadonly || readOnlyPermission}
+                    disabled={formDisabled || fieldDisabled}
+                    {...formik.getFieldProps(fieldLayoutInfo.attrs.name)}
+                    id={fieldLayoutInfo.attrs.name}
+                    name={fieldLayoutInfo.attrs.name}
+                    field="label"
+                    value={formik.values[fieldLayoutInfo.attrs.name] || ''}
+                    dropdown
+                    suggestions={selectionStaticItems}
+                    completeMethod={selectionStaticSearch}
+                    // onChange={(e) => updateInputs(index, e.value)} />
+                    // onChange={formik.handleChange}
+                    onChange={(e) => fieldContext.onChange(e, 'onFieldChange')}
+                    className="solid-standard-autocomplete"
+                />
+            </div>
+            {isFormFieldValid(formik, fieldLayoutInfo.attrs.name) && (
+                <div className="absolute mt-1">
+                    <Message severity="error" text={formik?.errors[fieldLayoutInfo.attrs.name]?.toString()} />
+                </div>
+            )}
+        </div>
+    );
+}
+
+export const SolidSelectionStaticRadioFormEditWidget = ({ formik, fieldContext }: SolidFormFieldWidgetProps) => {
+    const fieldMetadata = fieldContext.fieldMetadata;
+    const fieldLayoutInfo = fieldContext.field;
+    const className = fieldLayoutInfo.attrs?.className || 'field col-12';
+    const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;
+    const showFieldLabel = fieldLayoutInfo?.attrs?.showLabel;
+    const readOnlyPermission = fieldContext.readOnly;
+
+    const fieldDisabled = fieldLayoutInfo.attrs?.disabled;
+    const fieldReadonly = fieldLayoutInfo.attrs?.readonly;
+    const formDisabled = fieldContext.solidFormViewMetaData.data.solidView?.layout?.attrs?.disabled;
+    const formReadonly = fieldContext.solidFormViewMetaData.data.solidView?.layout?.attrs?.readonly;
+
+    const fieldName = fieldLayoutInfo.attrs.name;
+
+    // Convert selectionStaticValues to usable radio options
+    const radioOptions = fieldMetadata.selectionStaticValues.map((i: string) => {
+        const [value, label] = i.split(":");
+        return { label, value };
+    });
+
+    const isFormFieldValid = (formik: any, fieldName: string) =>
+        formik.touched[fieldName] && formik.errors[fieldName];
+
+    return (
+        <div className={className}>
+            <div className="relative">
+                <div className="flex flex-column gap-2 mt-4">
+                    {showFieldLabel !== false && (
+                        <label htmlFor={fieldName} className="form-field-label font-medium">
+                            {fieldLabel}
+                            {fieldMetadata.required && <span className="text-red-500"> *</span>}
+                        </label>
+                    )}
+                    <div className="flex flex-wrap gap-3">
+                        {radioOptions.map((option: any) => (
+                            <div key={option.value} className="flex items-center">
+                                <RadioButton
+                                    id={`${fieldName}-${option.value}`}
+                                    name={fieldName}
+                                    value={option}
+                                    checked={formik.values[fieldName]?.value === option.value}
+                                    // onChange={(e) => formik.setFieldValue(fieldName, e.value)} 
+                                    onChange={(e) => fieldContext.onChange(e, 'onFieldChange')}
+                                    disabled={formReadonly || fieldReadonly || readOnlyPermission || formDisabled || fieldDisabled}
+                                    className="mr-2"
+                                />
+                                <label htmlFor={`${fieldName}-${option.value}`} className="cursor-pointer">
+                                    {option.label}
+                                </label>
+                            </div>
+                        ))}
+                    </div>
+                </div>
+                {isFormFieldValid(formik, fieldName) && (
+                    <div className="absolute mt-1">
+                        <Message severity="error" text={formik?.errors[fieldName]?.toString()} />
+                    </div>
+                )}
+            </div>
+        </div>
+    );
+}
+
+
+export const DefaultSelectionStaticFormViewWidget = ({ formik, fieldContext }: SolidFormFieldWidgetProps) => {
+    
+    const fieldMetadata = fieldContext.fieldMetadata;
+    const fieldLayoutInfo = fieldContext.field;
+    const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;
+    const value  =formik.values[fieldLayoutInfo.attrs.name];
+
+    return (
+        <div className="mt-2 flex-column gap-2">
+            <p className="m-0 form-field-label font-medium">{fieldLabel}</p>
+            <p className="m-0">{value && value.label && value.label}</p>
+        </div>
+    );
+}
+
+

package/dist/components/core/form/fields/SolidShortTextField.d.ts

@@ -1,5 +1,6 @@
 import { Schema } from "yup";
 import { FormikObject, ISolidField, SolidFieldProps } from "./ISolidField";
+import { SolidFormFieldWidgetProps } from "../../../../types/solid-core";
 export declare class SolidShortTextField implements ISolidField {
     private fieldContext;
     constructor(fieldContext: SolidFieldProps);
@@ -7,5 +8,8 @@ export declare class SolidShortTextField implements ISolidField {
     initialValue(): any;
     validationSchema(): Schema;
     render(formik: FormikObject): import("react/jsx-runtime").JSX.Element;
+    renderExtensionRenderMode(widget: string, formik: FormikObject): import("react/jsx-runtime").JSX.Element;
 }
+export declare const DefaultShortTextFormEditWidget: ({ formik, fieldContext }: SolidFormFieldWidgetProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DefaultShortTextFormViewWidget: ({ formik, fieldContext }: SolidFormFieldWidgetProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=SolidShortTextField.d.ts.map

package/dist/components/core/form/fields/SolidShortTextField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidShortTextField.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/form/fields/SolidShortTextField.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,MAAM,EAAE,MAAM,KAAK,CAAC;AAC7B,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAG3E,qBAAa,mBAAoB,YAAW,WAAW;IAEnD,OAAO,CAAC,YAAY,CAAkB;gBAE1B,YAAY,EAAE,eAAe;IAIzC,cAAc,CAAC,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,QAAQ,GAAG,GAAG;IAOnD,YAAY,IAAI,GAAG;IASnB,gBAAgB,IAAI,MAAM;IA+B1B,MAAM,CAAC,MAAM,EAAE,YAAY;CAuF9B"}
+{"version":3,"file":"SolidShortTextField.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/form/fields/SolidShortTextField.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,MAAM,EAAE,MAAM,KAAK,CAAC;AAC7B,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAE3E,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE/D,qBAAa,mBAAoB,YAAW,WAAW;IAEnD,OAAO,CAAC,YAAY,CAAkB;gBAE1B,YAAY,EAAE,eAAe;IAIzC,cAAc,CAAC,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,QAAQ,GAAG,GAAG;IAOnD,YAAY,IAAI,GAAG;IASnB,gBAAgB,IAAI,MAAM;IA+B1B,MAAM,CAAC,MAAM,EAAE,YAAY;IAwC3B,yBAAyB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY;CAYjE;AAGD,eAAO,MAAM,8BAA8B,6BAA8B,yBAAyB,4CAuEjG,CAAA;AAED,eAAO,MAAM,8BAA8B,6BAA8B,yBAAyB,4CAajG,CAAA"}

package/dist/components/core/form/fields/SolidShortTextField.js

@@ -10,7 +10,7 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { InputText } from "primereact/inputtext";
 import { Message } from "primereact/message";
 import * as Yup from 'yup';
@@ -61,40 +61,71 @@ var SolidShortTextField = /** @class */ (function () {
         return schema;
     };
     SolidShortTextField.prototype.render = function (formik) {
-        var _this = this;
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
+        var _a, _b;
         var fieldMetadata = this.fieldContext.fieldMetadata;
         var fieldLayoutInfo = this.fieldContext.field;
-        var className = ((_a = fieldLayoutInfo.attrs) === null || _a === void 0 ? void 0 : _a.className) || 'field col-12';
-        var includeWrapper = ((_b = fieldLayoutInfo.attrs) === null || _b === void 0 ? void 0 : _b.includeWrapper) || 'yes';
-        var fieldLabel = (_c = fieldLayoutInfo.attrs.label) !== null && _c !== void 0 ? _c : fieldMetadata.displayName;
-        var fieldDescription = (_d = fieldLayoutInfo.attrs.description) !== null && _d !== void 0 ? _d : fieldMetadata.description;
         var solidFormViewMetaData = this.fieldContext.solidFormViewMetaData;
-        var showFieldLabel = (_e = fieldLayoutInfo === null || fieldLayoutInfo === void 0 ? void 0 : fieldLayoutInfo.attrs) === null || _e === void 0 ? void 0 : _e.showLabel;
-        var readOnlyPermission = this.fieldContext.readOnly;
+        var className = ((_a = fieldLayoutInfo.attrs) === null || _a === void 0 ? void 0 : _a.className) || 'field col-12';
         var isFormFieldValid = function (formik, fieldName) { return formik.touched[fieldName] && formik.errors[fieldName]; };
-        var fieldDisabled = (_f = fieldLayoutInfo.attrs) === null || _f === void 0 ? void 0 : _f.disabled;
-        var fieldReadonly = (_g = fieldLayoutInfo.attrs) === null || _g === void 0 ? void 0 : _g.readonly;
-        var formDisabled = (_k = (_j = (_h = solidFormViewMetaData.data.solidView) === null || _h === void 0 ? void 0 : _h.layout) === null || _j === void 0 ? void 0 : _j.attrs) === null || _k === void 0 ? void 0 : _k.disabled;
-        var formReadonly = (_o = (_m = (_l = solidFormViewMetaData.data.solidView) === null || _l === void 0 ? void 0 : _l.layout) === null || _m === void 0 ? void 0 : _m.attrs) === null || _o === void 0 ? void 0 : _o.readonly;
+        var viewWidget = fieldLayoutInfo.attrs.viewWidget;
+        var editWidget = fieldLayoutInfo.attrs.editWidget;
+        if (!editWidget) {
+            editWidget = 'DefaultShortTextFormEditWidget';
+        }
+        if (!viewWidget) {
+            viewWidget = 'DefaultShortTextFormViewWidget';
+        }
         var viewMode = this.fieldContext.viewMode;
-        var DynamicWidget = getExtensionComponent("SolidFormFieldViewModeWidget");
+        return (_jsx(_Fragment, { children: _jsxs("div", { className: className, children: [viewMode === "view" &&
+                        this.renderExtensionRenderMode(viewWidget, formik), viewMode === "edit" &&
+                        _jsxs(_Fragment, { children: [editWidget &&
+                                    this.renderExtensionRenderMode(editWidget, formik), isFormFieldValid(formik, fieldLayoutInfo.attrs.name) && (_jsx("div", { className: "absolute mt-1", children: _jsx(Message, { severity: "error", text: (_b = formik === null || formik === void 0 ? void 0 : formik.errors[fieldLayoutInfo.attrs.name]) === null || _b === void 0 ? void 0 : _b.toString() }) }))] })] }) }));
+    };
+    SolidShortTextField.prototype.renderExtensionRenderMode = function (widget, formik) {
+        var DynamicWidget = getExtensionComponent(widget);
         var widgetProps = {
-            label: fieldLabel,
-            value: formik.values[fieldLayoutInfo.attrs.name],
+            formik: formik,
+            fieldContext: this.fieldContext,
         };
-        return (_jsxs(_Fragment, { children: [viewMode === "view" &&
-                    _jsx("div", { className: className, children: DynamicWidget && _jsx(DynamicWidget, __assign({}, widgetProps)) }), viewMode === "edit" &&
-                    _jsxs(_Fragment, { children: [includeWrapper === 'yes' && _jsx("div", { className: className, children: _jsxs("div", { className: "relative", children: [_jsxs("div", { className: "flex flex-column gap-2 mt-4", children: [showFieldLabel != false &&
-                                                    _jsxs("label", { htmlFor: fieldLayoutInfo.attrs.name, className: "form-field-label", children: [fieldLabel, fieldMetadata.required && _jsx("span", { className: "text-red-500", children: " *" })] }), _jsx(InputText, { readOnly: formReadonly || fieldReadonly || readOnlyPermission, disabled: formDisabled || fieldDisabled, id: fieldLayoutInfo.attrs.name, name: fieldMetadata.name, "aria-describedby": "".concat(fieldLayoutInfo.attrs.name, "-help"), 
-                                                    // onChange={formik.handleChange}
-                                                    onChange: function (e) { return _this.fieldContext.onChange(e, 'onFieldChange'); }, onBlur: function (e) { return _this.fieldContext.onBlur(e, 'onFieldBlur'); }, value: formik.values[fieldLayoutInfo.attrs.name] || '' })] }), isFormFieldValid(formik, fieldLayoutInfo.attrs.name) && (_jsx("div", { className: "absolute mt-1", children: _jsx(Message, { severity: "error", text: (_p = formik === null || formik === void 0 ? void 0 : formik.errors[fieldLayoutInfo.attrs.name]) === null || _p === void 0 ? void 0 : _p.toString() }) }))] }) }), includeWrapper === 'no' &&
-                                _jsxs(_Fragment, { children: [showFieldLabel != false &&
-                                            _jsxs("label", { htmlFor: fieldLayoutInfo.attrs.name, className: "form-field-label", children: [fieldLabel, fieldMetadata.required && _jsx("span", { className: "text-red-500", children: " *" })] }), _jsx(InputText, { readOnly: formReadonly || fieldReadonly || readOnlyPermission, disabled: formDisabled || fieldDisabled, id: fieldLayoutInfo.attrs.name, name: fieldMetadata.name, "aria-describedby": "".concat(fieldLayoutInfo.attrs.name, "-help"), 
-                                            // onChange={formik.handleChange}
-                                            onChange: function (e) { return _this.fieldContext.onChange(e, 'onFieldChange'); }, onBlur: function (e) { return _this.fieldContext.onBlur(e, 'onFieldBlur'); }, value: formik.values[fieldLayoutInfo.attrs.name] || '' })] })] })] }));
+        return (_jsx(_Fragment, { children: DynamicWidget && _jsx(DynamicWidget, __assign({}, widgetProps)) }));
     };
     return SolidShortTextField;
 }());
 export { SolidShortTextField };
+export var DefaultShortTextFormEditWidget = function (_a) {
+    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
+    var formik = _a.formik, fieldContext = _a.fieldContext;
+    var fieldMetadata = fieldContext.fieldMetadata;
+    var fieldLayoutInfo = fieldContext.field;
+    var className = ((_b = fieldLayoutInfo.attrs) === null || _b === void 0 ? void 0 : _b.className) || 'field col-12';
+    var includeWrapper = ((_c = fieldLayoutInfo.attrs) === null || _c === void 0 ? void 0 : _c.includeWrapper) || 'yes';
+    var fieldLabel = (_d = fieldLayoutInfo.attrs.label) !== null && _d !== void 0 ? _d : fieldMetadata.displayName;
+    var fieldDescription = (_e = fieldLayoutInfo.attrs.description) !== null && _e !== void 0 ? _e : fieldMetadata.description;
+    var solidFormViewMetaData = fieldContext.solidFormViewMetaData;
+    var showFieldLabel = (_f = fieldLayoutInfo === null || fieldLayoutInfo === void 0 ? void 0 : fieldLayoutInfo.attrs) === null || _f === void 0 ? void 0 : _f.showLabel;
+    var readOnlyPermission = fieldContext.readOnly;
+    var isFormFieldValid = function (formik, fieldName) { return formik.touched[fieldName] && formik.errors[fieldName]; };
+    var fieldDisabled = (_g = fieldLayoutInfo.attrs) === null || _g === void 0 ? void 0 : _g.disabled;
+    var fieldReadonly = (_h = fieldLayoutInfo.attrs) === null || _h === void 0 ? void 0 : _h.readonly;
+    var formDisabled = (_l = (_k = (_j = solidFormViewMetaData.data.solidView) === null || _j === void 0 ? void 0 : _j.layout) === null || _k === void 0 ? void 0 : _k.attrs) === null || _l === void 0 ? void 0 : _l.disabled;
+    var formReadonly = (_p = (_o = (_m = solidFormViewMetaData.data.solidView) === null || _m === void 0 ? void 0 : _m.layout) === null || _o === void 0 ? void 0 : _o.attrs) === null || _p === void 0 ? void 0 : _p.readonly;
+    return (_jsxs(_Fragment, { children: [includeWrapper === 'yes' &&
+                _jsxs("div", { className: "relative", children: [_jsxs("div", { className: "flex flex-column gap-2 mt-4", children: [showFieldLabel != false &&
+                                    _jsxs("label", { htmlFor: fieldLayoutInfo.attrs.name, className: "form-field-label", children: [fieldLabel, fieldMetadata.required && _jsx("span", { className: "text-red-500", children: " *" })] }), _jsx(InputText, { readOnly: formReadonly || fieldReadonly || readOnlyPermission, disabled: formDisabled || fieldDisabled, id: fieldLayoutInfo.attrs.name, name: fieldMetadata.name, "aria-describedby": "".concat(fieldLayoutInfo.attrs.name, "-help"), 
+                                    // onChange={formik.handleChange}
+                                    onChange: function (e) { return fieldContext.onChange(e, 'onFieldChange'); }, onBlur: function (e) { return fieldContext.onBlur(e, 'onFieldBlur'); }, value: formik.values[fieldLayoutInfo.attrs.name] || '' })] }), isFormFieldValid(formik, fieldLayoutInfo.attrs.name) && (_jsx("div", { className: "absolute mt-1", children: _jsx(Message, { severity: "error", text: (_q = formik === null || formik === void 0 ? void 0 : formik.errors[fieldLayoutInfo.attrs.name]) === null || _q === void 0 ? void 0 : _q.toString() }) }))] }), includeWrapper === 'no' &&
+                _jsxs(_Fragment, { children: [showFieldLabel != false &&
+                            _jsxs("label", { htmlFor: fieldLayoutInfo.attrs.name, className: "form-field-label", children: [fieldLabel, fieldMetadata.required && _jsx("span", { className: "text-red-500", children: " *" })] }), _jsx(InputText, { readOnly: formReadonly || fieldReadonly || readOnlyPermission, disabled: formDisabled || fieldDisabled, id: fieldLayoutInfo.attrs.name, name: fieldMetadata.name, "aria-describedby": "".concat(fieldLayoutInfo.attrs.name, "-help"), 
+                            // onChange={formik.handleChange}
+                            onChange: function (e) { return fieldContext.onChange(e, 'onFieldChange'); }, onBlur: function (e) { return fieldContext.onBlur(e, 'onFieldBlur'); }, value: formik.values[fieldLayoutInfo.attrs.name] || '' })] })] }));
+};
+export var DefaultShortTextFormViewWidget = function (_a) {
+    var _b;
+    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;
+    console.log("formik.values[fieldLayoutInfo.attrs.name]", formik.values[fieldLayoutInfo.attrs.name]);
+    return (_jsxs("div", { className: "mt-2 flex-column gap-2", children: [_jsx("p", { className: "m-0 form-field-label font-medium", children: fieldLabel }), _jsx("p", { className: "m-0", children: formik.values[fieldLayoutInfo.attrs.name] })] }));
+};
 //# sourceMappingURL=SolidShortTextField.js.map

package/dist/components/core/form/fields/SolidShortTextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"SolidShortTextField.js","sourceRoot":"","sources":["../../../../../src/components/core/form/fields/SolidShortTextField.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"SolidShortTextField.js","sourceRoot":"","sources":["../../../../../src/components/core/form/fields/SolidShortTextField.tsx"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,208 @@
+'use client';
+import { InputText } from "primereact/inputtext";
+import { Message } from "primereact/message";
+import * as Yup from 'yup';
+import { Schema } from "yup";
+import { FormikObject, ISolidField, SolidFieldProps } from "./ISolidField";
+import { getExtensionComponent } from "@/helpers/registry";
+import { SolidFormFieldWidgetProps } from "@/types/solid-core";
+
+export class SolidShortTextField implements ISolidField {
+
+    private fieldContext: SolidFieldProps;
+
+    constructor(fieldContext: SolidFieldProps) {
+        this.fieldContext = fieldContext;
+    }
+
+    updateFormData(value: any, formData: FormData): any {
+        const fieldLayoutInfo = this.fieldContext.field;
+        if (value) {
+            formData.append(fieldLayoutInfo.attrs.name, value);
+        }
+    }
+
+    initialValue(): any {
+        const fieldName = this.fieldContext.field.attrs.name;
+        const fieldDefaultValue = this.fieldContext?.fieldMetadata?.defaultValue;
+
+        const existingValue = this.fieldContext.data[fieldName];
+
+        return existingValue !== undefined && existingValue !== null ? existingValue : fieldDefaultValue || '';
+    }
+
+    validationSchema(): Schema {
+        let schema: Yup.StringSchema<string | null | undefined> = Yup.string();
+
+        const fieldMetadata = this.fieldContext.fieldMetadata;
+        const fieldLayoutInfo = this.fieldContext.field;
+        const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;
+
+        // 1. required 
+        // 1. required
+        if (fieldMetadata.required) {
+            schema = schema.required(`${fieldLabel} is required.`);
+        } else {
+            schema = schema.nullable(); // Allow null when not required
+        }
+
+        // 2. length (min/max)
+        if (fieldMetadata.min && fieldMetadata.min > 0) {
+            schema = schema.min(fieldMetadata.min, `${fieldLabel} should be at-least ${fieldMetadata.min} characters long.`);
+        }
+        if (fieldMetadata.max && fieldMetadata.max > 0) {
+            schema = schema.max(fieldMetadata.max, `${fieldLabel} should not be more than ${fieldMetadata.max} characters long.`);
+        }
+        // 3. regular expression
+        if (fieldMetadata.regexPattern) {
+            const regexPatternNotMatchingErrorMsg = fieldMetadata.regexPatternNotMatchingErrorMsg ?? `${fieldLabel} has invalid data.`
+            schema = schema.matches(fieldMetadata.regexPattern, regexPatternNotMatchingErrorMsg);
+        }
+
+        return schema;
+    }
+
+    render(formik: FormikObject) {
+        const fieldMetadata = this.fieldContext.fieldMetadata;
+        const fieldLayoutInfo = this.fieldContext.field;
+        const solidFormViewMetaData = this.fieldContext.solidFormViewMetaData;
+        const className = fieldLayoutInfo.attrs?.className || 'field col-12';
+        const isFormFieldValid = (formik: any, fieldName: string) => formik.touched[fieldName] && formik.errors[fieldName];
+
+        let viewWidget = fieldLayoutInfo.attrs.viewWidget;
+        let editWidget = fieldLayoutInfo.attrs.editWidget;
+        if (!editWidget) {
+            editWidget = 'DefaultShortTextFormEditWidget';
+        }
+        if (!viewWidget) {
+            viewWidget = 'DefaultShortTextFormViewWidget';
+        }
+        const viewMode: string = this.fieldContext.viewMode;
+        return (
+            <>
+                <div className={className}>
+                    {viewMode === "view" &&
+                        this.renderExtensionRenderMode(viewWidget, formik)
+                    }
+                    {viewMode === "edit" &&
+                        <>
+                            {editWidget &&
+                                this.renderExtensionRenderMode(editWidget, formik)
+                            }
+                            {isFormFieldValid(formik, fieldLayoutInfo.attrs.name) && (
+                                <div className="absolute mt-1">
+                                    <Message severity="error" text={formik?.errors[fieldLayoutInfo.attrs.name]?.toString()} />
+                                </div>
+                            )}
+                        </>
+                    }
+                </div>
+            </>
+
+        );
+    }
+
+    renderExtensionRenderMode(widget: string, formik: FormikObject) {
+        let DynamicWidget = getExtensionComponent(widget);
+        const widgetProps: SolidFormFieldWidgetProps = {
+            formik: formik,
+            fieldContext: this.fieldContext,
+        }
+        return (
+            <>
+                {DynamicWidget && <DynamicWidget {...widgetProps} />}
+            </>
+        )
+    }
+}
+
+
+export const DefaultShortTextFormEditWidget = ({ formik, fieldContext }: SolidFormFieldWidgetProps) => {
+    const fieldMetadata = fieldContext.fieldMetadata;
+    const fieldLayoutInfo = fieldContext.field;
+    const className = fieldLayoutInfo.attrs?.className || 'field col-12';
+    const includeWrapper = fieldLayoutInfo.attrs?.includeWrapper || 'yes';
+    const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;
+    const fieldDescription = fieldLayoutInfo.attrs.description ?? fieldMetadata.description;
+    const solidFormViewMetaData = fieldContext.solidFormViewMetaData;
+    const showFieldLabel = fieldLayoutInfo?.attrs?.showLabel;
+    const readOnlyPermission = fieldContext.readOnly;
+
+    const isFormFieldValid = (formik: any, fieldName: string) => formik.touched[fieldName] && formik.errors[fieldName];
+
+    const fieldDisabled = fieldLayoutInfo.attrs?.disabled;
+    const fieldReadonly = fieldLayoutInfo.attrs?.readonly;
+
+    const formDisabled = solidFormViewMetaData.data.solidView?.layout?.attrs?.disabled;
+    const formReadonly = solidFormViewMetaData.data.solidView?.layout?.attrs?.readonly;
+    return (
+        <>
+            {includeWrapper === 'yes' && 
+                <div className="relative">
+                    <div className="flex flex-column gap-2 mt-4">
+                        {showFieldLabel != false &&
+                            <label htmlFor={fieldLayoutInfo.attrs.name} className="form-field-label">{fieldLabel}
+                                {fieldMetadata.required && <span className="text-red-500"> *</span>}
+                                {/* &nbsp;   {fieldDescription && <span className="form_field_help">({fieldDescription}) </span>} */}
+                            </label>
+                        }
+                        <InputText
+                            readOnly={formReadonly || fieldReadonly || readOnlyPermission}
+                            disabled={formDisabled || fieldDisabled}
+                            id={fieldLayoutInfo.attrs.name}
+                            name={fieldMetadata.name}
+                            aria-describedby={`${fieldLayoutInfo.attrs.name}-help`}
+                            // onChange={formik.handleChange}
+                            onChange={(e) => fieldContext.onChange(e, 'onFieldChange')}
+                            onBlur={(e) => fieldContext.onBlur(e, 'onFieldBlur')}
+                            value={formik.values[fieldLayoutInfo.attrs.name] || ''}
+                        />
+                    </div>
+                    {isFormFieldValid(formik, fieldLayoutInfo.attrs.name) && (
+                        <div className="absolute mt-1">
+                            <Message severity="error" text={formik?.errors[fieldLayoutInfo.attrs.name]?.toString()} />
+                        </div>
+                    )}
+                </div>
+            }
+            {includeWrapper === 'no' &&
+                <>
+                    {showFieldLabel != false &&
+                        <label htmlFor={fieldLayoutInfo.attrs.name} className="form-field-label">{fieldLabel}
+                            {fieldMetadata.required && <span className="text-red-500"> *</span>}
+                            {/* &nbsp;   {fieldDescription && <span className="form_field_help">({fieldDescription}) </span>} */}
+                        </label>
+                    }
+                    <InputText
+                        readOnly={formReadonly || fieldReadonly || readOnlyPermission}
+                        disabled={formDisabled || fieldDisabled}
+                        id={fieldLayoutInfo.attrs.name}
+                        name={fieldMetadata.name}
+                        aria-describedby={`${fieldLayoutInfo.attrs.name}-help`}
+                        // onChange={formik.handleChange}
+                        onChange={(e) => fieldContext.onChange(e, 'onFieldChange')}
+                        onBlur={(e) => fieldContext.onBlur(e, 'onFieldBlur')}
+                        value={formik.values[fieldLayoutInfo.attrs.name] || ''}
+                    />
+                </>
+            }
+        </>
+    );
+}
+
+export const DefaultShortTextFormViewWidget = ({ formik, fieldContext }: SolidFormFieldWidgetProps) => {
+
+    const fieldMetadata = fieldContext.fieldMetadata;
+    const fieldLayoutInfo = fieldContext.field;
+    const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;
+    console.log("formik.values[fieldLayoutInfo.attrs.name]", formik.values[fieldLayoutInfo.attrs.name]);
+    
+    return (
+        <div className="mt-2 flex-column gap-2">
+            <p className="m-0 form-field-label font-medium">{fieldLabel}</p>
+            <p className="m-0">{formik.values[fieldLayoutInfo.attrs.name]}</p>
+        </div>
+    );
+}
+
+