@solidxai/core-ui 0.1.12-beta.5 → 0.1.12-beta.7

package/dist/components/core/model/FieldMetaDataForm.tsx

@@ -868,7 +868,27 @@ const createValidationSchema = (currentFields: any, selectedType: any, allFields
   return Yup.object(schema);
 };
 
-const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldMetaData, allFields, deleteModelFunction, setVisiblePopup, params, setIsRequiredPopUp, showToaster }: any) => {
+const FieldMetaDataForm = ({
+  setIsDirty,
+  modelMetaData,
+  fieldMetaData,
+  setFieldMetaData,
+  allFields,
+  deleteModelFunction,
+  setVisiblePopup,
+  params,
+  setIsRequiredPopUp,
+  showToaster,
+  onDraftSubmit,
+  onClose,
+  availableFieldTypes,
+  forceShowTypeSelector = false,
+  selectorRequireContinue = false,
+  selectorContinueLabel = "Next",
+  selectorInitialFieldType = null,
+  disableIdentityEditingForExisting = true,
+  submitLabel = "Finish",
+}: any) => {
   const booleanOptions = ["false", "true"];
   const booleanSegmentedOptions = booleanOptions.map((value) => ({
     label: capitalize(value),
@@ -898,9 +918,13 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
   const [markdownText, setMarkdownText] = useState<string>();
   const [encryptState, setEncryptState] = useState<boolean>(Boolean(fieldMetaData?.encrypt));
 
-  const [showTypeFilter, setShowTypeFilter] = useState(fieldMetaData ? false : true);
+  const [showTypeFilter, setShowTypeFilter] = useState(forceShowTypeSelector || !fieldMetaData);
   const [selectedType, setSelectedType] = useState<{ label: string; value: string } | null>(
-    fieldMetaData?.type ? { label: fieldMetaData.type, value: fieldMetaData.type } : null
+    fieldMetaData?.type
+      ? { label: fieldMetaData.type, value: fieldMetaData.type }
+      : selectorInitialFieldType
+        ? { label: selectorInitialFieldType, value: selectorInitialFieldType }
+        : null
   );
   const selectedTypeValue = selectedType?.value || "";
   const [selectedComputedFieldValueType, setSelectedComputedFieldValueType] = useState(fieldMetaData?.computedFieldValueType && { label: fieldMetaData.computedFieldValueType, value: fieldMetaData.computedFieldValueType });
@@ -939,6 +963,18 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
   const showOrmOptions = currentFields.includes("ormType") && Boolean(ormTypeOptions && ormTypeOptions.length);
   const showValidationSection =
     selectedTypeValue !== "relation" && (showRegexFields || showMinFields || showMaxFields || showOrmOptions);
+  const isExistingFieldReadOnly = disableIdentityEditingForExisting && Boolean(fieldMetaData?.id);
+
+  const closeForm = useCallback(() => {
+    if (typeof onClose === "function") {
+      onClose();
+      return;
+    }
+
+    if (typeof setVisiblePopup === "function") {
+      setVisiblePopup(false);
+    }
+  }, [onClose, setVisiblePopup]);
 
   const searchMediaStorageProvIderId = async (event: any) => {
     try {
@@ -1395,34 +1431,37 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
     enableReinitialize: true,
     onSubmit: async (values) => {
       try {
-        setFieldMetaData((prevItems: any) => {
-          const newFieldData = { ...values, isSystem: values.isSystem == true ? true : '' }
-          const formtatedFieldPayload = fieldBasedPayloadFormating(newFieldData, currentFields, fieldMetaData);
-          const existingIndex = prevItems.findIndex((item: any) => item.identifier === formtatedFieldPayload.identifier);
-          let updatedItems;
-          if (existingIndex !== -1) {
-            updatedItems = [...prevItems];
-            updatedItems[existingIndex] = formtatedFieldPayload;
-            return updatedItems
-          }
-          else {
-            updatedItems = [...prevItems, formtatedFieldPayload];
-            if (params?.id !== 'new' && formtatedFieldPayload?.required && !formtatedFieldPayload?.defaultValue) {
-              setIsRequiredPopUp(true);
+        const newFieldData = { ...values, isSystem: values.isSystem == true ? true : '' }
+        const formtatedFieldPayload = fieldBasedPayloadFormating(newFieldData, currentFields, fieldMetaData);
+
+        if (typeof onDraftSubmit === "function") {
+          onDraftSubmit(formtatedFieldPayload);
+        } else {
+          setFieldMetaData((prevItems: any) => {
+            const existingIndex = prevItems.findIndex((item: any) => item.identifier === formtatedFieldPayload.identifier);
+            let updatedItems;
+            if (existingIndex !== -1) {
+              updatedItems = [...prevItems];
+              updatedItems[existingIndex] = formtatedFieldPayload;
+              return updatedItems
             }
-            // return [...prevItems, formtatedFieldPayload]
-          }
-          return updatedItems;
-        });
-        if (values.userKey) {
-          const data = {
-            modelName: values.relationCoModelSingularName,
-            fieldName: values.userKey
+            else {
+              updatedItems = [...prevItems, formtatedFieldPayload];
+              if (params?.id !== 'new' && formtatedFieldPayload?.required && !formtatedFieldPayload?.defaultValue) {
+                setIsRequiredPopUp(true);
+              }
+            }
+            return updatedItems;
+          });
+          if (values.userKey) {
+            const data = {
+              modelName: values.relationCoModelSingularName,
+              fieldName: values.userKey
+            }
+            updateUserKey(data);
           }
-          updateUserKey(data);
         }
-        // nextTab()
-        setVisiblePopup(false);
+        closeForm();
 
       } catch (err) {
         console.error(ERROR_MESSAGES.CREATE_MODEL, err);
@@ -1773,6 +1812,10 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
             <FieldSelector
               handleTypeSelect={handleTypeSelect}
               modelMetaData={modelMetaData}
+              availableFieldTypes={availableFieldTypes}
+              initialSelectedValue={selectedType?.value ?? selectorInitialFieldType}
+              requireExplicitContinue={selectorRequireContinue}
+              continueLabel={selectorContinueLabel}
             ></FieldSelector>
             :
             <div className="p-3" style={{ maxHeight: '80vh', overflowY: 'auto', overflowX: 'hidden' }}>
@@ -1795,7 +1838,7 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
                             </label>
                             <SolidInput
                               type="text"
-                              disabled={fieldMetaData?.id}
+                              disabled={isExistingFieldReadOnly}
                               id="displayName"
                               name="displayName"
                               onChange={(e) => {
@@ -1823,7 +1866,7 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
                               Name
                             </label>
                             <SolidInput
-                              disabled={fieldMetaData?.id}
+                              disabled={isExistingFieldReadOnly}
                               type="text"
                               id="name"
                               name="name"
@@ -1878,7 +1921,7 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
                                   }
                                 }}
                                 checked={showColumnName}
-                                disabled={fieldMetaData?.id}
+                                disabled={isExistingFieldReadOnly}
                               />
                               <label htmlFor="ingredient1" className="form-field-label">
                                 Set Column Name
@@ -1890,7 +1933,7 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
                                   Column Name
                                 </label>
                                 <SolidInput
-                                  disabled={fieldMetaData?.id}
+                                  disabled={isExistingFieldReadOnly}
                                   type="text"
                                   id="columnName"
                                   name="columnName"
@@ -2389,7 +2432,7 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
                                 id="relationCoModelColumnName"
                                 name="relationCoModelColumnName"
                                 onChange={formik.handleChange}
-                                disabled={fieldMetaData?.id}
+                                disabled={isExistingFieldReadOnly}
                                 value={formik.values.relationCoModelColumnName}
                                 className={classNames(styles.fieldInput, {
                                   "p-invalid": isFormFieldValid(
@@ -2528,7 +2571,7 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
                                 id="relationCoModelFieldName"
                                 name="relationCoModelFieldName"
                                 onChange={formik.handleChange}
-                                disabled={fieldMetaData?.id}
+                                disabled={isExistingFieldReadOnly}
                                 value={formik.values.relationCoModelFieldName}
                                 className={classNames(styles.fieldInput, {
                                   "p-invalid": isFormFieldValid(
@@ -2598,7 +2641,7 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
                                 id="relationJoinTableName"
                                 name="relationJoinTableName"
                                 onChange={formik.handleChange}
-                                disabled={fieldMetaData?.id}
+                                disabled={isExistingFieldReadOnly}
                                 value={formik.values.relationJoinTableName}
                                 className={classNames(styles.fieldInput, {
                                   "p-invalid": isFormFieldValid(
@@ -3050,7 +3093,7 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
                                             "min"
                                           ),
                                         })}
-                                        disabled={fieldMetaData?.id}
+                                        disabled={isExistingFieldReadOnly}
                                       />
                                     </div>
                                     {isFormFieldValid(formik, "min") && (
@@ -3088,7 +3131,7 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
                                             "max"
                                           ),
                                         })}
-                                        disabled={fieldMetaData?.id}
+                                        disabled={isExistingFieldReadOnly}
                                       />
                                     </div>
 
@@ -3447,10 +3490,10 @@ const FieldMetaDataForm = ({ setIsDirty, modelMetaData, fieldMetaData, setFieldM
                   </TabView>
                   <div className="mt-4 flex gap-4">
                     <div>
-                      <SolidButton label="Finish" size="small" onClick={() => showError()} type="submit" />
+                      <SolidButton label={submitLabel} size="small" onClick={() => showError()} type="submit" />
                     </div>
                     <div>
-                      <SolidButton label="Cancel" size="small" severity="secondary" type="reset" onClick={() => setVisiblePopup(false)} outlined />
+                      <SolidButton label="Cancel" size="small" severity="secondary" type="reset" onClick={closeForm} outlined />
                     </div>
                   </div>
                 </div>

package/dist/components/core/model/FieldSelector.d.ts

@@ -1,7 +1,11 @@
 type FieldSelectorProps = {
     handleTypeSelect: (value: string, label: string) => void;
     modelMetaData?: any;
+    availableFieldTypes?: string[];
+    initialSelectedValue?: string | null;
+    requireExplicitContinue?: boolean;
+    continueLabel?: string;
 };
-declare const FieldSelector: ({ handleTypeSelect }: FieldSelectorProps) => import("react/jsx-runtime").JSX.Element;
+declare const FieldSelector: ({ handleTypeSelect, availableFieldTypes, initialSelectedValue, requireExplicitContinue, continueLabel, }: FieldSelectorProps) => import("react/jsx-runtime").JSX.Element;
 export default FieldSelector;
 //# sourceMappingURL=FieldSelector.d.ts.map

package/dist/components/core/model/FieldSelector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldSelector.d.ts","sourceRoot":"","sources":["../../../../src/components/core/model/FieldSelector.tsx"],"names":[],"mappings":"AA0BA,KAAK,kBAAkB,GAAG;IACxB,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,aAAa,CAAC,EAAE,GAAG,CAAC;CACrB,CAAC;AAwDF,QAAA,MAAM,aAAa,yBAA0B,kBAAkB,4CAoC9D,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"FieldSelector.d.ts","sourceRoot":"","sources":["../../../../src/components/core/model/FieldSelector.tsx"],"names":[],"mappings":"AA4BA,KAAK,kBAAkB,GAAG;IACxB,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,aAAa,CAAC,EAAE,GAAG,CAAC;IACpB,mBAAmB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC/B,oBAAoB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAwDF,QAAA,MAAM,aAAa,6GAMhB,kBAAkB,4CAqEpB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/core/model/FieldSelector.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { AlignLeft, Calculator, Calendar, Clock9, Code2, Feather, Fingerprint, FunctionSquare, Hash, Image, Images, ListChecks, ListFilter, Mail, Share2, Shield, Sigma, Timer, ToggleLeft, Type, } from "lucide-react";
+import { useEffect, useMemo, useState } from "react";
+import { AlignLeft, Calculator, Calendar, Clock9, Code2, Feather, Fingerprint, FunctionSquare, Hash, Image, Images, ListChecks, ListFilter, Mail, Share2, Shield, Sigma, Timer, ToggleLeft, Type, ArrowRight, } from "lucide-react";
+import { SolidButton } from "../../shad-cn-ui";
 var fieldToneMap = {
     int: "blue",
     bigint: "blue",
@@ -46,13 +47,31 @@ var solidFieldOptions = [
     { label: "UUID", description: "Unique identifier", Icon: Fingerprint, value: "uuid", tone: fieldToneMap.uuid },
 ];
 var FieldSelector = function (_a) {
-    var handleTypeSelect = _a.handleTypeSelect;
-    var _b = useState(null), selectedField = _b[0], setSelectedField = _b[1];
+    var handleTypeSelect = _a.handleTypeSelect, availableFieldTypes = _a.availableFieldTypes, _b = _a.initialSelectedValue, initialSelectedValue = _b === void 0 ? null : _b, _c = _a.requireExplicitContinue, requireExplicitContinue = _c === void 0 ? false : _c, _d = _a.continueLabel, continueLabel = _d === void 0 ? "Next" : _d;
+    var _e = useState(initialSelectedValue), selectedField = _e[0], setSelectedField = _e[1];
+    useEffect(function () {
+        setSelectedField(initialSelectedValue);
+    }, [initialSelectedValue]);
+    var visibleFieldOptions = useMemo(function () {
+        if (!(availableFieldTypes === null || availableFieldTypes === void 0 ? void 0 : availableFieldTypes.length)) {
+            return solidFieldOptions;
+        }
+        var allowedTypes = new Set(availableFieldTypes);
+        return solidFieldOptions.filter(function (option) { return allowedTypes.has(option.value); });
+    }, [availableFieldTypes]);
     var handleSelect = function (option) {
         setSelectedField(option.value);
-        handleTypeSelect(option.value, option.label);
+        if (!requireExplicitContinue) {
+            handleTypeSelect(option.value, option.label);
+        }
     };
-    return (_jsxs("div", { className: "solid-field-selector-container", children: [_jsxs("div", { className: "solid-field-selector-header", children: [_jsx("p", { className: "form-wrapper-heading", children: "Select Field Type" }), _jsx("p", { className: "solid-field-selector-subheading", children: "Choose the data type you want to add to the model." })] }), _jsx("div", { className: "solid-field-selector-grid", children: solidFieldOptions.map(function (option) { return (_jsx("button", { type: "button", className: "solid-field-selector-card ".concat(selectedField === option.value ? "is-active" : ""), onClick: function () { return handleSelect(option); }, children: _jsxs("div", { className: "solid-field-selector-card-inner", children: [_jsx("span", { className: "solid-field-selector-icon solid-field-selector-icon-".concat(option.tone), children: _jsx(option.Icon, { size: 18, strokeWidth: 1.8 }) }), _jsxs("div", { className: "solid-field-selector-text", children: [_jsx("span", { className: "solid-field-selector-title", children: option.label }), _jsx("span", { className: "solid-field-selector-description", children: option.description })] })] }) }, option.value)); }) })] }));
+    var handleContinue = function () {
+        var selectedOption = visibleFieldOptions.find(function (option) { return option.value === selectedField; });
+        if (!selectedOption)
+            return;
+        handleTypeSelect(selectedOption.value, selectedOption.label);
+    };
+    return (_jsxs("div", { className: "solid-field-selector-container", children: [_jsxs("div", { className: "solid-field-selector-header", children: [_jsx("p", { className: "form-wrapper-heading", children: "Select Field Type" }), _jsx("p", { className: "solid-field-selector-subheading", children: "Choose the data type you want to add to the model." })] }), _jsx("div", { className: "solid-field-selector-grid", children: visibleFieldOptions.map(function (option) { return (_jsx("button", { type: "button", className: "solid-field-selector-card ".concat(selectedField === option.value ? "is-active" : ""), onClick: function () { return handleSelect(option); }, children: _jsxs("div", { className: "solid-field-selector-card-inner", children: [_jsx("span", { className: "solid-field-selector-icon solid-field-selector-icon-".concat(option.tone), children: _jsx(option.Icon, { size: 18, strokeWidth: 1.8 }) }), _jsxs("div", { className: "solid-field-selector-text", children: [_jsx("span", { className: "solid-field-selector-title", children: option.label }), _jsx("span", { className: "solid-field-selector-description", children: option.description })] })] }) }, option.value)); }) }), requireExplicitContinue ? (_jsx("div", { className: "mt-4 flex justify-end", children: _jsx(SolidButton, { size: "small", leftIcon: _jsx(ArrowRight, { size: 14 }), onClick: handleContinue, disabled: !selectedField, children: continueLabel }) })) : null] }));
 };
 export default FieldSelector;
 //# sourceMappingURL=FieldSelector.js.map

package/dist/components/core/model/FieldSelector.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldSelector.js","sourceRoot":"","sources":["../../../../src/components/core/model/FieldSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport { useState } from \"react\";\nimport type { LucideIcon } from \"lucide-react\";\nimport {\n  AlignLeft,\n  Calculator,\n  Calendar,\n  Clock9,\n  Code2,\n  Feather,\n  Fingerprint,\n  FunctionSquare,\n  Hash,\n  Image,\n  Images,\n  ListChecks,\n  ListFilter,\n  Mail,\n  Share2,\n  Shield,\n  Sigma,\n  Timer,\n  ToggleLeft,\n  Type,\n} from \"lucide-react\";\n\ntype FieldSelectorProps = {\n  handleTypeSelect: (value: string, label: string) => void;\n  modelMetaData?: any;\n};\n\ntype FieldOption = {\n  label: string;\n  description: string;\n  Icon: LucideIcon;\n  value: string;\n  tone: \"blue\" | \"violet\" | \"green\" | \"orange\" | \"cyan\";\n};\n\nconst fieldToneMap: Record<string, FieldOption[\"tone\"]> = {\n  int: \"blue\",\n  bigint: \"blue\",\n  decimal: \"blue\",\n  shortText: \"violet\",\n  longText: \"violet\",\n  richText: \"violet\",\n  json: \"cyan\",\n  boolean: \"green\",\n  date: \"orange\",\n  datetime: \"orange\",\n  time: \"orange\",\n  relation: \"cyan\",\n  mediaSingle: \"violet\",\n  mediaMultiple: \"violet\",\n  email: \"cyan\",\n  password: \"cyan\",\n  selectionStatic: \"green\",\n  selectionDynamic: \"green\",\n  computed: \"blue\",\n  uuid: \"blue\",\n};\n\nconst solidFieldOptions: FieldOption[] = [\n  { label: \"Integer\", description: \"Whole number (int)\", Icon: Hash, value: \"int\", tone: fieldToneMap.int },\n  { label: \"Big Integer\", description: \"Large whole number (bigint)\", Icon: Calculator, value: \"bigint\", tone: fieldToneMap.bigint },\n  { label: \"Decimal\", description: \"64-bit floating-point number\", Icon: Sigma, value: \"decimal\", tone: fieldToneMap.decimal },\n  { label: \"Short Text\", description: \"Small text field\", Icon: Type, value: \"shortText\", tone: fieldToneMap.shortText },\n  { label: \"Long Text\", description: \"Large text field\", Icon: AlignLeft, value: \"longText\", tone: fieldToneMap.longText },\n  { label: \"Rich Text\", description: \"Rich text editor\", Icon: Feather, value: \"richText\", tone: fieldToneMap.richText },\n  { label: \"JSON\", description: \"JSON data format\", Icon: Code2, value: \"json\", tone: fieldToneMap.json },\n  { label: \"Boolean\", description: \"True / False value\", Icon: ToggleLeft, value: \"boolean\", tone: fieldToneMap.boolean },\n  { label: \"Date\", description: \"Date field\", Icon: Calendar, value: \"date\", tone: fieldToneMap.date },\n  { label: \"Datetime\", description: \"Date & time field\", Icon: Clock9, value: \"datetime\", tone: fieldToneMap.datetime },\n  { label: \"Time\", description: \"Time picker\", Icon: Timer, value: \"time\", tone: fieldToneMap.time },\n  { label: \"Relation\", description: \"Reference another entity\", Icon: Share2, value: \"relation\", tone: fieldToneMap.relation },\n  { label: \"Single Media\", description: \"Single file upload\", Icon: Image, value: \"mediaSingle\", tone: fieldToneMap.mediaSingle },\n  { label: \"Multiple Media\", description: \"Multiple file upload\", Icon: Images, value: \"mediaMultiple\", tone: fieldToneMap.mediaMultiple },\n  { label: \"Email\", description: \"Email field\", Icon: Mail, value: \"email\", tone: fieldToneMap.email },\n  { label: \"Password\", description: \"Password input\", Icon: Shield, value: \"password\", tone: fieldToneMap.password },\n  { label: \"Static Selection\", description: \"Predefined values\", Icon: ListChecks, value: \"selectionStatic\", tone: fieldToneMap.selectionStatic },\n  { label: \"Dynamic Selection\", description: \"Dynamic list\", Icon: ListFilter, value: \"selectionDynamic\", tone: fieldToneMap.selectionDynamic },\n  { label: \"Computed\", description: \"Derive value from data\", Icon: FunctionSquare, value: \"computed\", tone: fieldToneMap.computed },\n  { label: \"UUID\", description: \"Unique identifier\", Icon: Fingerprint, value: \"uuid\", tone: fieldToneMap.uuid },\n];\n\nconst FieldSelector = ({ handleTypeSelect }: FieldSelectorProps) => {\n  const [selectedField, setSelectedField] = useState<string | null>(null);\n\n  const handleSelect = (option: FieldOption) => {\n    setSelectedField(option.value);\n    handleTypeSelect(option.value, option.label);\n  };\n\n  return (\n    <div className=\"solid-field-selector-container\">\n      <div className=\"solid-field-selector-header\">\n        <p className=\"form-wrapper-heading\">Select Field Type</p>\n        <p className=\"solid-field-selector-subheading\">Choose the data type you want to add to the model.</p>\n      </div>\n      <div className=\"solid-field-selector-grid\">\n        {solidFieldOptions.map((option) => (\n          <button\n            key={option.value}\n            type=\"button\"\n            className={`solid-field-selector-card ${selectedField === option.value ? \"is-active\" : \"\"}`}\n            onClick={() => handleSelect(option)}\n          >\n            <div className=\"solid-field-selector-card-inner\">\n              <span className={`solid-field-selector-icon solid-field-selector-icon-${option.tone}`}>\n                <option.Icon size={18} strokeWidth={1.8} />\n              </span>\n              <div className=\"solid-field-selector-text\">\n                <span className=\"solid-field-selector-title\">{option.label}</span>\n                <span className=\"solid-field-selector-description\">{option.description}</span>\n              </div>\n            </div>\n          </button>\n        ))}\n      </div>\n    </div>\n  );\n};\n\nexport default FieldSelector;\n"]}
+{"version":3,"file":"FieldSelector.js","sourceRoot":"","sources":["../../../../src/components/core/model/FieldSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport { useEffect, useMemo, useState } from \"react\";\nimport type { LucideIcon } from \"lucide-react\";\nimport {\n  AlignLeft,\n  Calculator,\n  Calendar,\n  Clock9,\n  Code2,\n  Feather,\n  Fingerprint,\n  FunctionSquare,\n  Hash,\n  Image,\n  Images,\n  ListChecks,\n  ListFilter,\n  Mail,\n  Share2,\n  Shield,\n  Sigma,\n  Timer,\n  ToggleLeft,\n  Type,\n  ArrowRight,\n} from \"lucide-react\";\nimport { SolidButton } from \"../../shad-cn-ui\";\n\ntype FieldSelectorProps = {\n  handleTypeSelect: (value: string, label: string) => void;\n  modelMetaData?: any;\n  availableFieldTypes?: string[];\n  initialSelectedValue?: string | null;\n  requireExplicitContinue?: boolean;\n  continueLabel?: string;\n};\n\ntype FieldOption = {\n  label: string;\n  description: string;\n  Icon: LucideIcon;\n  value: string;\n  tone: \"blue\" | \"violet\" | \"green\" | \"orange\" | \"cyan\";\n};\n\nconst fieldToneMap: Record<string, FieldOption[\"tone\"]> = {\n  int: \"blue\",\n  bigint: \"blue\",\n  decimal: \"blue\",\n  shortText: \"violet\",\n  longText: \"violet\",\n  richText: \"violet\",\n  json: \"cyan\",\n  boolean: \"green\",\n  date: \"orange\",\n  datetime: \"orange\",\n  time: \"orange\",\n  relation: \"cyan\",\n  mediaSingle: \"violet\",\n  mediaMultiple: \"violet\",\n  email: \"cyan\",\n  password: \"cyan\",\n  selectionStatic: \"green\",\n  selectionDynamic: \"green\",\n  computed: \"blue\",\n  uuid: \"blue\",\n};\n\nconst solidFieldOptions: FieldOption[] = [\n  { label: \"Integer\", description: \"Whole number (int)\", Icon: Hash, value: \"int\", tone: fieldToneMap.int },\n  { label: \"Big Integer\", description: \"Large whole number (bigint)\", Icon: Calculator, value: \"bigint\", tone: fieldToneMap.bigint },\n  { label: \"Decimal\", description: \"64-bit floating-point number\", Icon: Sigma, value: \"decimal\", tone: fieldToneMap.decimal },\n  { label: \"Short Text\", description: \"Small text field\", Icon: Type, value: \"shortText\", tone: fieldToneMap.shortText },\n  { label: \"Long Text\", description: \"Large text field\", Icon: AlignLeft, value: \"longText\", tone: fieldToneMap.longText },\n  { label: \"Rich Text\", description: \"Rich text editor\", Icon: Feather, value: \"richText\", tone: fieldToneMap.richText },\n  { label: \"JSON\", description: \"JSON data format\", Icon: Code2, value: \"json\", tone: fieldToneMap.json },\n  { label: \"Boolean\", description: \"True / False value\", Icon: ToggleLeft, value: \"boolean\", tone: fieldToneMap.boolean },\n  { label: \"Date\", description: \"Date field\", Icon: Calendar, value: \"date\", tone: fieldToneMap.date },\n  { label: \"Datetime\", description: \"Date & time field\", Icon: Clock9, value: \"datetime\", tone: fieldToneMap.datetime },\n  { label: \"Time\", description: \"Time picker\", Icon: Timer, value: \"time\", tone: fieldToneMap.time },\n  { label: \"Relation\", description: \"Reference another entity\", Icon: Share2, value: \"relation\", tone: fieldToneMap.relation },\n  { label: \"Single Media\", description: \"Single file upload\", Icon: Image, value: \"mediaSingle\", tone: fieldToneMap.mediaSingle },\n  { label: \"Multiple Media\", description: \"Multiple file upload\", Icon: Images, value: \"mediaMultiple\", tone: fieldToneMap.mediaMultiple },\n  { label: \"Email\", description: \"Email field\", Icon: Mail, value: \"email\", tone: fieldToneMap.email },\n  { label: \"Password\", description: \"Password input\", Icon: Shield, value: \"password\", tone: fieldToneMap.password },\n  { label: \"Static Selection\", description: \"Predefined values\", Icon: ListChecks, value: \"selectionStatic\", tone: fieldToneMap.selectionStatic },\n  { label: \"Dynamic Selection\", description: \"Dynamic list\", Icon: ListFilter, value: \"selectionDynamic\", tone: fieldToneMap.selectionDynamic },\n  { label: \"Computed\", description: \"Derive value from data\", Icon: FunctionSquare, value: \"computed\", tone: fieldToneMap.computed },\n  { label: \"UUID\", description: \"Unique identifier\", Icon: Fingerprint, value: \"uuid\", tone: fieldToneMap.uuid },\n];\n\nconst FieldSelector = ({\n  handleTypeSelect,\n  availableFieldTypes,\n  initialSelectedValue = null,\n  requireExplicitContinue = false,\n  continueLabel = \"Next\",\n}: FieldSelectorProps) => {\n  const [selectedField, setSelectedField] = useState<string | null>(initialSelectedValue);\n\n  useEffect(() => {\n    setSelectedField(initialSelectedValue);\n  }, [initialSelectedValue]);\n\n  const visibleFieldOptions = useMemo(() => {\n    if (!availableFieldTypes?.length) {\n      return solidFieldOptions;\n    }\n\n    const allowedTypes = new Set(availableFieldTypes);\n    return solidFieldOptions.filter((option) => allowedTypes.has(option.value));\n  }, [availableFieldTypes]);\n\n  const handleSelect = (option: FieldOption) => {\n    setSelectedField(option.value);\n    if (!requireExplicitContinue) {\n      handleTypeSelect(option.value, option.label);\n    }\n  };\n\n  const handleContinue = () => {\n    const selectedOption = visibleFieldOptions.find((option) => option.value === selectedField);\n    if (!selectedOption) return;\n    handleTypeSelect(selectedOption.value, selectedOption.label);\n  };\n\n  return (\n    <div className=\"solid-field-selector-container\">\n      <div className=\"solid-field-selector-header\">\n        <p className=\"form-wrapper-heading\">Select Field Type</p>\n        <p className=\"solid-field-selector-subheading\">Choose the data type you want to add to the model.</p>\n      </div>\n      <div className=\"solid-field-selector-grid\">\n        {visibleFieldOptions.map((option) => (\n          <button\n            key={option.value}\n            type=\"button\"\n            className={`solid-field-selector-card ${selectedField === option.value ? \"is-active\" : \"\"}`}\n            onClick={() => handleSelect(option)}\n          >\n            <div className=\"solid-field-selector-card-inner\">\n              <span className={`solid-field-selector-icon solid-field-selector-icon-${option.tone}`}>\n                <option.Icon size={18} strokeWidth={1.8} />\n              </span>\n              <div className=\"solid-field-selector-text\">\n                <span className=\"solid-field-selector-title\">{option.label}</span>\n                <span className=\"solid-field-selector-description\">{option.description}</span>\n              </div>\n            </div>\n          </button>\n        ))}\n      </div>\n      {requireExplicitContinue ? (\n        <div className=\"mt-4 flex justify-end\">\n          <SolidButton\n            size=\"small\"\n            leftIcon={<ArrowRight size={14} />}\n            onClick={handleContinue}\n            disabled={!selectedField}\n          >\n            {continueLabel}\n          </SolidButton>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default FieldSelector;\n"]}

package/dist/components/core/model/FieldSelector.tsx

@@ -1,5 +1,5 @@
 
-import { useState } from "react";
+import { useEffect, useMemo, useState } from "react";
 import type { LucideIcon } from "lucide-react";
 import {
   AlignLeft,
@@ -22,11 +22,17 @@ import {
   Timer,
   ToggleLeft,
   Type,
+  ArrowRight,
 } from "lucide-react";
+import { SolidButton } from "../../shad-cn-ui";
 
 type FieldSelectorProps = {
   handleTypeSelect: (value: string, label: string) => void;
   modelMetaData?: any;
+  availableFieldTypes?: string[];
+  initialSelectedValue?: string | null;
+  requireExplicitContinue?: boolean;
+  continueLabel?: string;
 };
 
 type FieldOption = {
@@ -83,12 +89,39 @@ const solidFieldOptions: FieldOption[] = [
   { label: "UUID", description: "Unique identifier", Icon: Fingerprint, value: "uuid", tone: fieldToneMap.uuid },
 ];
 
-const FieldSelector = ({ handleTypeSelect }: FieldSelectorProps) => {
-  const [selectedField, setSelectedField] = useState<string | null>(null);
+const FieldSelector = ({
+  handleTypeSelect,
+  availableFieldTypes,
+  initialSelectedValue = null,
+  requireExplicitContinue = false,
+  continueLabel = "Next",
+}: FieldSelectorProps) => {
+  const [selectedField, setSelectedField] = useState<string | null>(initialSelectedValue);
+
+  useEffect(() => {
+    setSelectedField(initialSelectedValue);
+  }, [initialSelectedValue]);
+
+  const visibleFieldOptions = useMemo(() => {
+    if (!availableFieldTypes?.length) {
+      return solidFieldOptions;
+    }
+
+    const allowedTypes = new Set(availableFieldTypes);
+    return solidFieldOptions.filter((option) => allowedTypes.has(option.value));
+  }, [availableFieldTypes]);
 
   const handleSelect = (option: FieldOption) => {
     setSelectedField(option.value);
-    handleTypeSelect(option.value, option.label);
+    if (!requireExplicitContinue) {
+      handleTypeSelect(option.value, option.label);
+    }
+  };
+
+  const handleContinue = () => {
+    const selectedOption = visibleFieldOptions.find((option) => option.value === selectedField);
+    if (!selectedOption) return;
+    handleTypeSelect(selectedOption.value, selectedOption.label);
   };
 
   return (
@@ -98,7 +131,7 @@ const FieldSelector = ({ handleTypeSelect }: FieldSelectorProps) => {
         <p className="solid-field-selector-subheading">Choose the data type you want to add to the model.</p>
       </div>
       <div className="solid-field-selector-grid">
-        {solidFieldOptions.map((option) => (
+        {visibleFieldOptions.map((option) => (
           <button
             key={option.value}
             type="button"
@@ -117,6 +150,18 @@ const FieldSelector = ({ handleTypeSelect }: FieldSelectorProps) => {
           </button>
         ))}
       </div>
+      {requireExplicitContinue ? (
+        <div className="mt-4 flex justify-end">
+          <SolidButton
+            size="small"
+            leftIcon={<ArrowRight size={14} />}
+            onClick={handleContinue}
+            disabled={!selectedField}
+          >
+            {continueLabel}
+          </SolidButton>
+        </div>
+      ) : null}
     </div>
   );
 };

package/dist/components/core/tree/SolidTreeTable.d.ts

@@ -65,9 +65,10 @@ type SolidTreeTableProps = {
         node: SolidTreeNode;
         originalEvent: React.MouseEvent<HTMLTableRowElement>;
     }) => void;
+    rowClassName?: (node: SolidTreeNode) => string | undefined;
 };
 export declare function SolidTreeColumn(_props: SolidTreeColumnProps): null;
 export declare const Column: typeof SolidTreeColumn;
-export declare function SolidTreeTable({ value, children, expandedKeys, onToggle, onExpand, tableClassName, tableStyle, emptyMessage, selectionMode, selectionKeys, onSelectionChange, sortField, sortOrder, removableSort, onSort, onRowClick, }: SolidTreeTableProps): import("react/jsx-runtime").JSX.Element;
+export declare function SolidTreeTable({ value, children, expandedKeys, onToggle, onExpand, tableClassName, tableStyle, emptyMessage, selectionMode, selectionKeys, onSelectionChange, sortField, sortOrder, removableSort, onSort, onRowClick, rowClassName, }: SolidTreeTableProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=SolidTreeTable.d.ts.map

package/dist/components/core/tree/SolidTreeTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidTreeTable.d.ts","sourceRoot":"","sources":["../../../../src/components/core/tree/SolidTreeTable.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"SolidTreeTable.d.ts","sourceRoot":"","sources":["../../../../src/components/core/tree/SolidTreeTable.tsx"],"names":[],"mappings":"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"}

package/dist/components/core/tree/SolidTreeTable.js

@@ -119,7 +119,7 @@ function parseWidthValue(value) {
     return Number.isFinite(parsed) ? parsed : null;
 }
 export function SolidTreeTable(_a) {
-    var _b = _a.value, value = _b === void 0 ? [] : _b, children = _a.children, _c = _a.expandedKeys, expandedKeys = _c === void 0 ? {} : _c, onToggle = _a.onToggle, onExpand = _a.onExpand, tableClassName = _a.tableClassName, tableStyle = _a.tableStyle, emptyMessage = _a.emptyMessage, selectionMode = _a.selectionMode, _d = _a.selectionKeys, selectionKeys = _d === void 0 ? {} : _d, onSelectionChange = _a.onSelectionChange, sortField = _a.sortField, _e = _a.sortOrder, sortOrder = _e === void 0 ? 0 : _e, _f = _a.removableSort, removableSort = _f === void 0 ? true : _f, onSort = _a.onSort, onRowClick = _a.onRowClick;
+    var _b = _a.value, value = _b === void 0 ? [] : _b, children = _a.children, _c = _a.expandedKeys, expandedKeys = _c === void 0 ? {} : _c, onToggle = _a.onToggle, onExpand = _a.onExpand, tableClassName = _a.tableClassName, tableStyle = _a.tableStyle, emptyMessage = _a.emptyMessage, selectionMode = _a.selectionMode, _d = _a.selectionKeys, selectionKeys = _d === void 0 ? {} : _d, onSelectionChange = _a.onSelectionChange, sortField = _a.sortField, _e = _a.sortOrder, sortOrder = _e === void 0 ? 0 : _e, _f = _a.removableSort, removableSort = _f === void 0 ? true : _f, onSort = _a.onSort, onRowClick = _a.onRowClick, rowClassName = _a.rowClassName;
     var columns = useMemo(function () { return normalizeColumns(children); }, [children]);
     var visibleRows = useMemo(function () { return flattenVisibleNodes(value, expandedKeys); }, [value, expandedKeys]);
     var selectionWidth = selectionMode === "checkbox" ? 48 : 0;
@@ -219,7 +219,7 @@ export function SolidTreeTable(_a) {
                                 var node = _a.node, depth = _a.depth;
                                 var key = String((_b = node.key) !== null && _b !== void 0 ? _b : rowIndex);
                                 var isSelected = Boolean((_c = selectionKeys[key]) === null || _c === void 0 ? void 0 : _c.checked);
-                                return (_jsxs("tr", { className: cx("solid-data-table-row solid-tree-table-row", isSelected && "is-selected"), onClick: function (event) {
+                                return (_jsxs("tr", { className: cx("solid-data-table-row solid-tree-table-row", isSelected && "is-selected", rowClassName === null || rowClassName === void 0 ? void 0 : rowClassName(node)), onClick: function (event) {
                                         var target = event.target;
                                         if (target.closest("button,a,input,label,[data-no-row-click='true']"))
                                             return;