@solidxai/core-ui 0.1.9-beta.20 → 0.1.9-beta.21

package/dist/components/common/CancelButton.tsx

@@ -20,7 +20,7 @@ export const CancelButton = () => {
     };
     return (
         <div>
-            <SolidButton variant="outline" size="small" type="button" onClick={handleGoBack} className='bg-primary-reverse' style={{ minWidth: 66 }}>
+            <SolidButton variant="outline" size="small" type="button" onClick={handleGoBack} className='bg-[var(--primary-color-text)]' style={{ minWidth: 66 }}>
                 Close
             </SolidButton>
         </div>
@@ -55,12 +55,12 @@ export const SolidCancelButton = () => {
         <>
             {/* <div className="hidden lg:flex"> */}
             {/* <div> */}
-            <SolidButton variant="outline" size="small" type="button" onClick={handleGoBack} className='bg-primary-reverse hidden lg:flex' style={{ minWidth: 66 }}>
+            <SolidButton variant="outline" size="small" type="button" onClick={handleGoBack} className='hidden bg-[var(--primary-color-text)] lg:flex' style={{ minWidth: 66 }}>
                 Close
             </SolidButton>
             {/* </div> */}
             {/* </div> */}
-            <SolidButton size="small" type="button" leftIcon={<X size={14} />} onClick={handleGoBack} className='bg-primary-reverse solid-icon-button flex lg:hidden' />
+            <SolidButton size="small" type="button" leftIcon={<X size={14} />} onClick={handleGoBack} className='solid-icon-button flex bg-[var(--primary-color-text)] lg:hidden' />
         </>
     )
 }

package/dist/components/common/GeneralSettings.js

@@ -409,7 +409,7 @@ export var GeneralSettings = function () {
     var handleAiConfigChange = function (newConfig) {
         formik.setFieldValue("solidXGenAiCodeBuilderConfig", newConfig);
     };
-    return (_jsx("div", { className: "page-parent-wrapper", children: _jsx("div", { className: "solid-form-wrapper", children: _jsx("div", { className: "solid-form-section", children: _jsxs("form", { onSubmit: formik.handleSubmit, children: [_jsxs("div", { className: "page-header secondary-border-bottom", children: [_jsx("div", { className: "form-wrapper-title ", children: "Settings" }), _jsx("div", { className: "gap-3 flex", children: formik.dirty && (_jsx(SolidButton, { size: "sm", type: "submit", loading: formik.isSubmitting, onClick: function () { return showError(); }, children: "Save" })) })] }), _jsxs("div", { className: "px-3 py-3 md:p-4 solid-form-content", children: [pathname.includes("app-settings") && (_jsxs(_Fragment, { children: [_jsx("div", { className: "formgrid grid", children: _jsx("div", { className: "col-12 lg:col-10 xl:col-8", children: _jsxs("div", { className: "formgrid grid", children: [_jsxs("div", { className: "col-12 md:col-6", children: [_jsx("p", { className: "solid-settings-subheading", children: "App Logo" }), _jsxs("div", { children: [_jsxs("div", __assign({}, getAppLogoRootProps(), { className: "solid-dropzone-wrapper", style: { borderRadius: 8 }, children: [_jsx("input", __assign({}, getAppLogoInputProps())), _jsx(SettingDropzoneActivePlaceholder, {})] })), _jsx("div", { className: "mt-2", children: (function () {
+    return (_jsx("div", { className: "page-parent-wrapper", children: _jsx("div", { className: "solid-form-wrapper", children: _jsx("div", { className: "solid-form-section", children: _jsxs("form", { onSubmit: formik.handleSubmit, children: [_jsxs("div", { className: "page-header secondary-border-bottom", children: [_jsx("div", { className: "form-wrapper-title ", children: "Settings" }), _jsx("div", { className: "flex gap-4", children: formik.dirty && (_jsx(SolidButton, { size: "sm", type: "submit", loading: formik.isSubmitting, onClick: function () { return showError(); }, children: "Save" })) })] }), _jsxs("div", { className: "px-3 py-3 md:p-4 solid-form-content", children: [pathname.includes("app-settings") && (_jsxs(_Fragment, { children: [_jsx("div", { className: "flex flex-wrap -mx-2 -mt-2", children: _jsx("div", { className: "w-full lg:w-[83.333333%] xl:w-[66.666667%] px-2 pt-2", children: _jsxs("div", { className: "flex flex-wrap -mx-2 -mt-2", children: [_jsxs("div", { className: "w-full md:w-1/2 px-2 pt-2", children: [_jsx("p", { className: "solid-settings-subheading", children: "App Logo" }), _jsxs("div", { children: [_jsxs("div", __assign({}, getAppLogoRootProps(), { className: "solid-dropzone-wrapper", style: { borderRadius: 8 }, children: [_jsx("input", __assign({}, getAppLogoInputProps())), _jsx(SettingDropzoneActivePlaceholder, {})] })), _jsx("div", { className: "mt-2", children: (function () {
                                                                                 var logoSrc = SolidLogo.src || SolidLogo;
                                                                                 var src = appLogoPreview
                                                                                     ? appLogoPreview
@@ -422,7 +422,7 @@ export var GeneralSettings = function () {
                                                                                     src = "".concat(env("API_URL"), "/").concat(src);
                                                                                 }
                                                                                 return (_jsx(SolidUploadedImage, { src: src, className: "solid-app-logo" }));
-                                                                            })() }), formik.values.appLogo && (_jsx(SettingsImageRemoveButton, { onClick: removeAppLogo }))] })] }), _jsxs("div", { className: "col-12 md:col-6", children: [_jsx("p", { className: "solid-settings-subheading", children: "Company Logo" }), _jsxs("div", { children: [_jsxs("div", __assign({}, getCompanyLogoRootProps(), { className: "solid-dropzone-wrapper", style: { borderRadius: 8 }, children: [_jsx("input", __assign({}, getCompanyLogoInputProps())), _jsx(SettingDropzoneActivePlaceholder, {})] })), _jsx("div", { className: "mt-2", children: (function () {
+                                                                            })() }), formik.values.appLogo && (_jsx(SettingsImageRemoveButton, { onClick: removeAppLogo }))] })] }), _jsxs("div", { className: "w-full md:w-1/2 px-2 pt-2", children: [_jsx("p", { className: "solid-settings-subheading", children: "Company Logo" }), _jsxs("div", { children: [_jsxs("div", __assign({}, getCompanyLogoRootProps(), { className: "solid-dropzone-wrapper", style: { borderRadius: 8 }, children: [_jsx("input", __assign({}, getCompanyLogoInputProps())), _jsx(SettingDropzoneActivePlaceholder, {})] })), _jsx("div", { className: "mt-2", children: (function () {
                                                                                 var logoSrc = SolidLogo.src || SolidLogo;
                                                                                 var src = companyLogoPreview
                                                                                     ? companyLogoPreview
@@ -435,36 +435,36 @@ export var GeneralSettings = function () {
                                                                                     src = "".concat(env("API_URL"), "/").concat(src);
                                                                                 }
                                                                                 return (_jsx(SolidUploadedImage, { src: src, className: "solid-compony-logo" }));
-                                                                            })() }), formik.values.companylogo && (_jsx(SettingsImageRemoveButton, { onClick: removeCompanyLogo }))] })] })] }) }) }), _jsx("p", { className: "solid-settings-heading", children: "App Logo Position" }), _jsx("div", { className: "formgrid grid", children: _jsx("div", { className: "col-12 lg:col-10 xl:col-8", children: _jsx("div", { className: "flex", children: _jsx(SolidSegmentedControl, { className: "solid-settings-segmented", value: formik.values.appLogoPosition, options: [
+                                                                            })() }), formik.values.companylogo && (_jsx(SettingsImageRemoveButton, { onClick: removeCompanyLogo }))] })] })] }) }) }), _jsx("p", { className: "solid-settings-heading", children: "App Logo Position" }), _jsx("div", { className: "flex flex-wrap -mx-2 -mt-2", children: _jsx("div", { className: "w-full lg:w-[83.333333%] xl:w-[66.666667%] px-2 pt-2", children: _jsx("div", { className: "flex", children: _jsx(SolidSegmentedControl, { className: "solid-settings-segmented", value: formik.values.appLogoPosition, options: [
                                                             { value: "in_form_view", label: "In Form View" },
                                                             { value: "in_image_view", label: "In Image View" },
-                                                        ], onChange: function (value) { return formik.setFieldValue("appLogoPosition", value); } }) }) }) }), _jsx(SolidDivider, { className: "my-4" }), _jsx("p", { className: "solid-settings-heading", children: "Title & Description Details" }), _jsx("div", { className: 'formgrid grid', children: _jsx("div", { className: 'col-12 lg:col-10 xl:col-8', children: _jsxs("div", { className: "formgrid grid", children: [_jsx("div", { className: "col-12 md:col-6", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-10 sm:col-9 lg:col-5 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "Show Details on Authentication Screen" }) }), _jsx("div", { className: "col-2 sm:col-3 lg:col-7", children: _jsx(SolidSwitch, { name: "showAuthContent", checked: formik.values.showAuthContent, onChange: function (checked) {
+                                                        ], onChange: function (value) { return formik.setFieldValue("appLogoPosition", value); } }) }) }) }), _jsx(SolidDivider, { className: "my-6" }), _jsx("p", { className: "solid-settings-heading", children: "Title & Description Details" }), _jsx("div", { className: 'flex flex-wrap -mx-2 -mt-2', children: _jsx("div", { className: 'w-full lg:w-[83.333333%] xl:w-[66.666667%] px-2 pt-2', children: _jsxs("div", { className: "flex flex-wrap -mx-2 -mt-2", children: [_jsx("div", { className: "w-full md:w-1/2 px-2 pt-2", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-[83.333333%] sm:w-[75%] lg:w-[41.666667%] px-2 pt-2 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "Show Details on Authentication Screen" }) }), _jsx("div", { className: "w-[16.666667%] sm:w-1/4 lg:w-[58.333333%] px-2 pt-2", children: _jsx(SolidSwitch, { name: "showAuthContent", checked: formik.values.showAuthContent, onChange: function (checked) {
                                                                                 return formik.setFieldValue("showAuthContent", checked);
-                                                                            } }) })] }) }), _jsx("div", { className: "col-12 md:col-6", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-12 md:col-5 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "App Title" }) }), _jsx("div", { className: "col-12 md:col-7", children: _jsx(SolidInput, { type: "text", id: "appTitle", name: "appTitle", onChange: formik.handleChange, value: (_38 = formik.values.appTitle) !== null && _38 !== void 0 ? _38 : '', className: "w-full" }) })] }) }), _jsx("div", { className: "col-12 md:col-6 mt-4", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-12 md:col-5 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "App Subtitle" }) }), _jsx("div", { className: "col-12 md:col-7", children: _jsx(SolidInput, { type: "text", id: "appSubtitle", name: "appSubtitle", onChange: formik.handleChange, value: (_39 = formik.values.appSubtitle) !== null && _39 !== void 0 ? _39 : '', className: "w-full" }) })] }) }), _jsx("div", { className: "col-12 md:col-6 mt-4", children: _jsxs("div", { className: "formgrid grid align-items-start", children: [_jsx("div", { className: "col-12 md:col-5 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "Description" }) }), _jsx("div", { className: "col-12 md:col-7", children: _jsx(SolidTextarea, { rows: 3, id: "appDescription", name: "appDescription", onChange: formik.handleChange, value: (_40 = formik.values.appDescription) !== null && _40 !== void 0 ? _40 : '', className: 'w-full' }) })] }) }), _jsx("div", { className: "col-12 md:col-6 mt-4", children: _jsxs("div", { className: "formgrid grid align-items-start", children: [_jsx("div", { className: "col-12 md:col-5 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "Copyright" }) }), _jsx("div", { className: "col-12 md:col-7", children: _jsx(SolidTextarea, { rows: 3, id: "copyright", name: "copyright", onChange: formik.handleChange, value: (_41 = formik.values.copyright) !== null && _41 !== void 0 ? _41 : '', className: 'w-full' }) })] }) })] }) }) }), _jsx(SolidDivider, { className: "my-4" }), _jsx("p", { className: "solid-settings-heading", children: "Legal Links" }), _jsx("div", { className: 'formgrid grid', children: _jsx("div", { className: 'col-12 lg:col-10 xl:col-8', children: _jsxs("div", { className: "formgrid grid", children: [_jsx("div", { className: "col-12 md:col-6", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-10 sm:col-9 lg:col-5", children: _jsx("label", { className: "form-field-label", children: "Show Legal Links" }) }), _jsx("div", { className: "col-2 sm:col-3 lg:col-7", children: _jsx(SolidSwitch, { name: "showLegalLinks", checked: formik.values.showLegalLinks, onChange: function (checked) { return formik.setFieldValue("showLegalLinks", checked); } }) })] }) }), _jsx("div", { className: "col-12 md:col-6", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-12 md:col-5 py-2 md:py-0", children: _jsx("label", { className: "form-field-label", children: "Terms and Conditions Link" }) }), _jsx("div", { className: "col-12 md:col-7", children: _jsx(SolidInput, { type: "text", id: "appTnc", name: "appTnc", onChange: formik.handleChange, value: (_42 = formik.values.appTnc) !== null && _42 !== void 0 ? _42 : "", className: "w-full" }) })] }) }), _jsx("div", { className: "col-12 md:col-6 mt-3", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-12 md:col-5 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "Privacy Policy Link" }) }), _jsx("div", { className: "col-12 md:col-7", children: _jsx(SolidInput, { type: "text", id: "appPrivacyPolicy", name: "appPrivacyPolicy", onChange: formik.handleChange, value: (_43 = formik.values.appPrivacyPolicy) !== null && _43 !== void 0 ? _43 : "", className: "w-full" }) })] }) })] }) }) }), _jsx(SolidDivider, { className: "my-4" }), _jsx("p", { className: "solid-settings-heading", children: "Theme" }), _jsx("div", { className: "formgrid grid", children: _jsx("div", { className: "col-12 lg:col-10 xl:col-8", children: _jsx("div", { className: "formgrid grid", children: _jsx("div", { className: "col-12 md:col-6", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-10 sm:col-10 lg:col-5", children: _jsx("label", { className: "form-field-label", children: "Enable Dark Mode" }) }), _jsx("div", { className: "col-2 sm:col-3 lg:col-7", children: _jsx(SolidSwitch, { name: "enableDarkMode", checked: formik.values.enableDarkMode, onChange: function (checked) { return formik.setFieldValue("enableDarkMode", checked); } }) })] }) }) }) }) })] })), pathname.includes("authentication-settings") && (_jsxs(_Fragment, { children: [_jsx("p", { className: "solid-settings-heading", children: "User Authentication" }), _jsx("div", { className: "formgrid grid", children: _jsx("div", { className: "col-12 lg:col-10 xl:col-8", children: _jsxs("div", { className: "formgrid grid", children: [_jsx("div", { className: "col-12", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-10 sm:col-9 lg:col-5", children: _jsx("label", { className: "form-field-label", children: "Public Registration" }) }), _jsx("div", { className: "col-2 sm:col-3 lg:col-7", children: _jsx(SolidSwitch, { name: "allowPublicRegistration", checked: formik.values.allowPublicRegistration, onChange: function (checked) {
+                                                                            } }) })] }) }), _jsx("div", { className: "w-full md:w-1/2 px-2 pt-2", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-full md:w-[41.666667%] px-2 pt-2 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "App Title" }) }), _jsx("div", { className: "w-full md:w-[58.333333%] px-2 pt-2", children: _jsx(SolidInput, { type: "text", id: "appTitle", name: "appTitle", onChange: formik.handleChange, value: (_38 = formik.values.appTitle) !== null && _38 !== void 0 ? _38 : '', className: "w-full" }) })] }) }), _jsx("div", { className: "w-full md:w-1/2 px-2 pt-2 mt-6", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-full md:w-[41.666667%] px-2 pt-2 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "App Subtitle" }) }), _jsx("div", { className: "w-full md:w-[58.333333%] px-2 pt-2", children: _jsx(SolidInput, { type: "text", id: "appSubtitle", name: "appSubtitle", onChange: formik.handleChange, value: (_39 = formik.values.appSubtitle) !== null && _39 !== void 0 ? _39 : '', className: "w-full" }) })] }) }), _jsx("div", { className: "w-full md:w-1/2 px-2 pt-2 mt-6", children: _jsxs("div", { className: "flex flex-wrap items-start -mx-2 -mt-2", children: [_jsx("div", { className: "w-full md:w-[41.666667%] px-2 pt-2 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "Description" }) }), _jsx("div", { className: "w-full md:w-[58.333333%] px-2 pt-2", children: _jsx(SolidTextarea, { rows: 3, id: "appDescription", name: "appDescription", onChange: formik.handleChange, value: (_40 = formik.values.appDescription) !== null && _40 !== void 0 ? _40 : '', className: 'w-full' }) })] }) }), _jsx("div", { className: "w-full md:w-1/2 px-2 pt-2 mt-6", children: _jsxs("div", { className: "flex flex-wrap items-start -mx-2 -mt-2", children: [_jsx("div", { className: "w-full md:w-[41.666667%] px-2 pt-2 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "Copyright" }) }), _jsx("div", { className: "w-full md:w-[58.333333%] px-2 pt-2", children: _jsx(SolidTextarea, { rows: 3, id: "copyright", name: "copyright", onChange: formik.handleChange, value: (_41 = formik.values.copyright) !== null && _41 !== void 0 ? _41 : '', className: 'w-full' }) })] }) })] }) }) }), _jsx(SolidDivider, { className: "my-6" }), _jsx("p", { className: "solid-settings-heading", children: "Legal Links" }), _jsx("div", { className: 'flex flex-wrap -mx-2 -mt-2', children: _jsx("div", { className: 'w-full lg:w-[83.333333%] xl:w-[66.666667%] px-2 pt-2', children: _jsxs("div", { className: "flex flex-wrap -mx-2 -mt-2", children: [_jsx("div", { className: "w-full md:w-1/2 px-2 pt-2", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-[83.333333%] sm:w-[75%] lg:w-[41.666667%] px-2 pt-2", children: _jsx("label", { className: "form-field-label", children: "Show Legal Links" }) }), _jsx("div", { className: "w-[16.666667%] sm:w-1/4 lg:w-[58.333333%] px-2 pt-2", children: _jsx(SolidSwitch, { name: "showLegalLinks", checked: formik.values.showLegalLinks, onChange: function (checked) { return formik.setFieldValue("showLegalLinks", checked); } }) })] }) }), _jsx("div", { className: "w-full md:w-1/2 px-2 pt-2", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-full md:w-[41.666667%] px-2 pt-2 py-2 md:py-0", children: _jsx("label", { className: "form-field-label", children: "Terms and Conditions Link" }) }), _jsx("div", { className: "w-full md:w-[58.333333%] px-2 pt-2", children: _jsx(SolidInput, { type: "text", id: "appTnc", name: "appTnc", onChange: formik.handleChange, value: (_42 = formik.values.appTnc) !== null && _42 !== void 0 ? _42 : "", className: "w-full" }) })] }) }), _jsx("div", { className: "w-full md:w-1/2 px-2 pt-2 mt-4", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-full md:w-[41.666667%] px-2 pt-2 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "Privacy Policy Link" }) }), _jsx("div", { className: "w-full md:w-[58.333333%] px-2 pt-2", children: _jsx(SolidInput, { type: "text", id: "appPrivacyPolicy", name: "appPrivacyPolicy", onChange: formik.handleChange, value: (_43 = formik.values.appPrivacyPolicy) !== null && _43 !== void 0 ? _43 : "", className: "w-full" }) })] }) })] }) }) }), _jsx(SolidDivider, { className: "my-6" }), _jsx("p", { className: "solid-settings-heading", children: "Theme" }), _jsx("div", { className: "flex flex-wrap -mx-2 -mt-2", children: _jsx("div", { className: "w-full lg:w-[83.333333%] xl:w-[66.666667%] px-2 pt-2", children: _jsx("div", { className: "flex flex-wrap -mx-2 -mt-2", children: _jsx("div", { className: "w-full md:w-1/2 px-2 pt-2", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-[83.333333%] sm:w-[83.333333%] lg:w-[41.666667%] px-2 pt-2", children: _jsx("label", { className: "form-field-label", children: "Enable Dark Mode" }) }), _jsx("div", { className: "w-[16.666667%] sm:w-1/4 lg:w-[58.333333%] px-2 pt-2", children: _jsx(SolidSwitch, { name: "enableDarkMode", checked: formik.values.enableDarkMode, onChange: function (checked) { return formik.setFieldValue("enableDarkMode", checked); } }) })] }) }) }) }) })] })), pathname.includes("authentication-settings") && (_jsxs(_Fragment, { children: [_jsx("p", { className: "solid-settings-heading", children: "User Authentication" }), _jsx("div", { className: "flex flex-wrap -mx-2 -mt-2", children: _jsx("div", { className: "w-full lg:w-[83.333333%] xl:w-[66.666667%] px-2 pt-2", children: _jsxs("div", { className: "flex flex-wrap -mx-2 -mt-2", children: [_jsx("div", { className: "w-full px-2 pt-2", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-[83.333333%] sm:w-[75%] lg:w-[41.666667%] px-2 pt-2", children: _jsx("label", { className: "form-field-label", children: "Public Registration" }) }), _jsx("div", { className: "w-[16.666667%] sm:w-1/4 lg:w-[58.333333%] px-2 pt-2", children: _jsx(SolidSwitch, { name: "allowPublicRegistration", checked: formik.values.allowPublicRegistration, onChange: function (checked) {
                                                                                 return formik.setFieldValue("allowPublicRegistration", checked);
-                                                                            } }) })] }) }), _jsx("div", { className: "col-12 mt-3", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-10 sm:col-9 lg:col-5", children: _jsx("label", { className: "form-field-label", children: "Password Based Authentication" }) }), _jsx("div", { className: "col-2 sm:col-3 lg:col-7", children: _jsx(SolidSwitch, { name: "passwordBasedAuth", checked: formik.values.passwordBasedAuth, onChange: function (checked) {
+                                                                            } }) })] }) }), _jsx("div", { className: "w-full px-2 pt-2 mt-4", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-[83.333333%] sm:w-[75%] lg:w-[41.666667%] px-2 pt-2", children: _jsx("label", { className: "form-field-label", children: "Password Based Authentication" }) }), _jsx("div", { className: "w-[16.666667%] sm:w-1/4 lg:w-[58.333333%] px-2 pt-2", children: _jsx(SolidSwitch, { name: "passwordBasedAuth", checked: formik.values.passwordBasedAuth, onChange: function (checked) {
                                                                                 return formik.setFieldValue("passwordBasedAuth", checked);
-                                                                            } }) })] }) }), _jsx("div", { className: "col-12 mt-3", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-10 sm:col-9 lg:col-5", children: _jsx("label", { className: "form-field-label", children: "Password Less Authentication" }) }), _jsx("div", { className: "col-2 sm:col-3 lg:col-7", children: _jsx(SolidSwitch, { name: "passwordLessAuth", checked: formik.values.passwordLessAuth, onChange: function (checked) {
+                                                                            } }) })] }) }), _jsx("div", { className: "w-full px-2 pt-2 mt-4", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-[83.333333%] sm:w-[75%] lg:w-[41.666667%] px-2 pt-2", children: _jsx("label", { className: "form-field-label", children: "Password Less Authentication" }) }), _jsx("div", { className: "w-[16.666667%] sm:w-1/4 lg:w-[58.333333%] px-2 pt-2", children: _jsx(SolidSwitch, { name: "passwordLessAuth", checked: formik.values.passwordLessAuth, onChange: function (checked) {
                                                                                 return formik.setFieldValue("passwordLessAuth", checked);
-                                                                            } }) })] }) }), _jsx("div", { className: "col-12 mt-3", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-10 sm:col-9 lg:col-5", children: _jsxs("label", { className: "form-field-label", children: ["Auto Activate User on Registration", " "] }) }), _jsx("div", { className: "col-2 sm:col-3 lg:col-7", children: _jsx(SolidSwitch, { name: "activateUserOnRegistration", checked: formik.values.activateUserOnRegistration, onChange: function (checked) {
+                                                                            } }) })] }) }), _jsx("div", { className: "w-full px-2 pt-2 mt-4", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-[83.333333%] sm:w-[75%] lg:w-[41.666667%] px-2 pt-2", children: _jsxs("label", { className: "form-field-label", children: ["Auto Activate User on Registration", " "] }) }), _jsx("div", { className: "w-[16.666667%] sm:w-1/4 lg:w-[58.333333%] px-2 pt-2", children: _jsx(SolidSwitch, { name: "activateUserOnRegistration", checked: formik.values.activateUserOnRegistration, onChange: function (checked) {
                                                                                 return formik.setFieldValue("activateUserOnRegistration", checked);
-                                                                            } }) })] }) }), _jsx("div", { className: "col-12 mt-3", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-10 sm:col-9 lg:col-5", children: _jsxs("label", { className: "form-field-label", children: ["Allow Login/ Signup with Google", " "] }) }), _jsx("div", { className: "col-2 sm:col-3 lg:col-7", children: _jsx(SolidSwitch, { name: "iamGoogleOAuthEnabled", checked: formik.values.iamGoogleOAuthEnabled, onChange: function (checked) {
+                                                                            } }) })] }) }), _jsx("div", { className: "w-full px-2 pt-2 mt-4", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-[83.333333%] sm:w-[75%] lg:w-[41.666667%] px-2 pt-2", children: _jsxs("label", { className: "form-field-label", children: ["Allow Login/ Signup with Google", " "] }) }), _jsx("div", { className: "w-[16.666667%] sm:w-1/4 lg:w-[58.333333%] px-2 pt-2", children: _jsx(SolidSwitch, { name: "iamGoogleOAuthEnabled", checked: formik.values.iamGoogleOAuthEnabled, onChange: function (checked) {
                                                                                 return formik.setFieldValue("iamGoogleOAuthEnabled", checked);
-                                                                            } }) })] }) }), _jsx("div", { className: "col-12 mt-3", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-10 sm:col-9 lg:col-5", children: _jsxs("label", { className: "form-field-label", children: ["Allow Login/ Signup with Microsoft", " "] }) }), _jsx("div", { className: "col-2 sm:col-3 lg:col-7", children: _jsx(SolidSwitch, { name: "iamMicrosoftOAuthEnabled", checked: formik.values.iamMicrosoftOAuthEnabled, onChange: function (checked) {
+                                                                            } }) })] }) }), _jsx("div", { className: "w-full px-2 pt-2 mt-4", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-[83.333333%] sm:w-[75%] lg:w-[41.666667%] px-2 pt-2", children: _jsxs("label", { className: "form-field-label", children: ["Allow Login/ Signup with Microsoft", " "] }) }), _jsx("div", { className: "w-[16.666667%] sm:w-1/4 lg:w-[58.333333%] px-2 pt-2", children: _jsx(SolidSwitch, { name: "iamMicrosoftOAuthEnabled", checked: formik.values.iamMicrosoftOAuthEnabled, onChange: function (checked) {
                                                                                 return formik.setFieldValue("iamMicrosoftOAuthEnabled", checked);
-                                                                            } }) })] }) }), _jsx("div", { className: "col-12 mt-3", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-10 sm:col-9 lg:col-5", children: _jsxs("label", { className: "form-field-label", children: ["Allow Login/ Signup with Facebook", " "] }) }), _jsx("div", { className: "col-2 sm:col-3 lg:col-7", children: _jsx(SolidSwitch, { name: "iamFacebookOAuthEnabled", checked: formik.values.iamFacebookOAuthEnabled, onChange: function (checked) {
+                                                                            } }) })] }) }), _jsx("div", { className: "w-full px-2 pt-2 mt-4", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-[83.333333%] sm:w-[75%] lg:w-[41.666667%] px-2 pt-2", children: _jsxs("label", { className: "form-field-label", children: ["Allow Login/ Signup with Facebook", " "] }) }), _jsx("div", { className: "w-[16.666667%] sm:w-1/4 lg:w-[58.333333%] px-2 pt-2", children: _jsx(SolidSwitch, { name: "iamFacebookOAuthEnabled", checked: formik.values.iamFacebookOAuthEnabled, onChange: function (checked) {
                                                                                 return formik.setFieldValue("iamFacebookOAuthEnabled", checked);
-                                                                            } }) })] }) }), _jsx("div", { className: "col-12 mt-3", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-10 sm:col-9 lg:col-5", children: _jsxs("label", { className: "form-field-label", children: ["Allow Login/ Signup with Apple", " "] }) }), _jsx("div", { className: "col-2 sm:col-3 lg:col-7", children: _jsx(SolidSwitch, { name: "iamAppleOAuthEnabled", checked: formik.values.iamAppleOAuthEnabled, onChange: function (checked) {
+                                                                            } }) })] }) }), _jsx("div", { className: "w-full px-2 pt-2 mt-4", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-[83.333333%] sm:w-[75%] lg:w-[41.666667%] px-2 pt-2", children: _jsxs("label", { className: "form-field-label", children: ["Allow Login/ Signup with Apple", " "] }) }), _jsx("div", { className: "w-[16.666667%] sm:w-1/4 lg:w-[58.333333%] px-2 pt-2", children: _jsx(SolidSwitch, { name: "iamAppleOAuthEnabled", checked: formik.values.iamAppleOAuthEnabled, onChange: function (checked) {
                                                                                 return formik.setFieldValue("iamAppleOAuthEnabled", checked);
-                                                                            } }) })] }) }), _jsx("div", { className: "col-12 mt-3", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-10 sm:col-9 lg:col-5", children: _jsxs("label", { className: "form-field-label", children: ["Force Password change on first Login", " "] }) }), _jsx("div", { className: "col-2 sm:col-3 lg:col-7", children: _jsx(SolidSwitch, { name: "forceChangePasswordOnFirstLogin", checked: formik.values.forceChangePasswordOnFirstLogin, onChange: function (checked) {
+                                                                            } }) })] }) }), _jsx("div", { className: "w-full px-2 pt-2 mt-4", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-[83.333333%] sm:w-[75%] lg:w-[41.666667%] px-2 pt-2", children: _jsxs("label", { className: "form-field-label", children: ["Force Password change on first Login", " "] }) }), _jsx("div", { className: "w-[16.666667%] sm:w-1/4 lg:w-[58.333333%] px-2 pt-2", children: _jsx(SolidSwitch, { name: "forceChangePasswordOnFirstLogin", checked: formik.values.forceChangePasswordOnFirstLogin, onChange: function (checked) {
                                                                                 return formik.setFieldValue("forceChangePasswordOnFirstLogin", checked);
-                                                                            } }) })] }) }), formik.values.passwordLessAuth === true && (_jsx("div", { className: "col-12 mt-3", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-12 sm:col-12 lg:col-5 xl:col-5", children: _jsx("label", { className: "form-field-label", children: "Password Less Registration Method" }) }), _jsx("div", { className: "col-12 sm:col-12 lg:col-6 xl:col-6", children: _jsx(SolidSegmentedControl, { className: "solid-settings-segmented mt-3 lg:mt-0", value: formik.values
+                                                                            } }) })] }) }), formik.values.passwordLessAuth === true && (_jsx("div", { className: "w-full px-2 pt-2 mt-4", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-full sm:w-full lg:w-[41.666667%] xl:w-[41.666667%] px-2 pt-2", children: _jsx("label", { className: "form-field-label", children: "Password Less Registration Method" }) }), _jsx("div", { className: "w-full sm:w-full lg:w-1/2 xl:w-1/2 px-2 pt-2", children: _jsx(SolidSegmentedControl, { className: "solid-settings-segmented mt-4 lg:mt-0", value: formik.values
                                                                                 .passwordlessRegistrationValidateWhat, options: [
                                                                                 { value: "email", label: "Email" },
                                                                                 { value: "mobile", label: "Mobile" },
                                                                             ], onChange: function (value) {
                                                                                 return formik.setFieldValue("passwordlessRegistrationValidateWhat", value);
-                                                                            } }) })] }) })), formik.values.passwordLessAuth === true && (_jsx("div", { className: "col-12 mt-3", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-12 sm:col-12 lg:col-5 xl:col-5", children: _jsx("label", { className: "form-field-label", children: "Password Less Login Method" }) }), _jsx("div", { className: "col-12 sm:col-12 lg:col-6 xl:col-6", children: _jsx(SolidSegmentedControl, { className: "solid-settings-segmented mt-3 lg:mt-0", value: formik.values.passwordlessLoginValidateWhat, options: [
+                                                                            } }) })] }) })), formik.values.passwordLessAuth === true && (_jsx("div", { className: "w-full px-2 pt-2 mt-4", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-full sm:w-full lg:w-[41.666667%] xl:w-[41.666667%] px-2 pt-2", children: _jsx("label", { className: "form-field-label", children: "Password Less Login Method" }) }), _jsx("div", { className: "w-full sm:w-full lg:w-1/2 xl:w-1/2 px-2 pt-2", children: _jsx(SolidSegmentedControl, { className: "solid-settings-segmented mt-4 lg:mt-0", value: formik.values.passwordlessLoginValidateWhat, options: [
                                                                                 { value: "email", label: "Email" },
                                                                                 { value: "mobile", label: "Mobile" },
                                                                                 {
@@ -473,13 +473,13 @@ export var GeneralSettings = function () {
                                                                                 },
                                                                             ], onChange: function (value) {
                                                                                 return formik.setFieldValue("passwordlessLoginValidateWhat", value);
-                                                                            } }) })] }) }))] }) }) }), _jsx(SolidDivider, { className: "my-4" }), _jsx("p", { className: "solid-settings-heading", children: "Authentication Screen Layout" }), _jsx("div", { className: "formgrid grid", children: _jsxs("div", { className: "col-12 lg:col-10 xl:col-8", children: [_jsx(SolidSegmentedControl, { className: "solid-settings-segmented", value: formik.values.authPagesLayout, options: [
+                                                                            } }) })] }) }))] }) }) }), _jsx(SolidDivider, { className: "my-6" }), _jsx("p", { className: "solid-settings-heading", children: "Authentication Screen Layout" }), _jsx("div", { className: "flex flex-wrap -mx-2 -mt-2", children: _jsxs("div", { className: "w-full lg:w-[83.333333%] xl:w-[66.666667%] px-2 pt-2", children: [_jsx(SolidSegmentedControl, { className: "solid-settings-segmented", value: formik.values.authPagesLayout, options: [
                                                             { value: "left", label: "Left" },
                                                             { value: "center", label: "Center" },
                                                             { value: "right", label: "Right" },
                                                         ], onChange: function (value) {
                                                             return formik.setFieldValue("authPagesLayout", value);
-                                                        } }), _jsxs("p", { className: "mt-3 text-sm font-bold", children: ["Note :", " ", positionMap[formik.values.authPagesLayout]] })] }) }), formik.values.authPagesLayout === "center" && _jsx(_Fragment, {}), _jsx("div", { className: "formgrid grid", children: _jsx("div", { className: "col-12 lg:col-10 xl:col-8", children: _jsx("div", { className: "formgrid grid", children: _jsxs("div", { className: "col-12 md:col-8 lg:col-6", children: [_jsxs("p", { className: "solid-settings-subheading", children: [formik.values.authPagesLayout === "center"
+                                                        } }), _jsxs("p", { className: "mt-4 text-sm font-bold", children: ["Note :", " ", positionMap[formik.values.authPagesLayout]] })] }) }), formik.values.authPagesLayout === "center" && _jsx(_Fragment, {}), _jsx("div", { className: "flex flex-wrap -mx-2 -mt-2", children: _jsx("div", { className: "w-full lg:w-[83.333333%] xl:w-[66.666667%] px-2 pt-2", children: _jsx("div", { className: "flex flex-wrap -mx-2 -mt-2", children: _jsxs("div", { className: "w-full md:w-[66.666667%] lg:w-1/2 px-2 pt-2", children: [_jsxs("p", { className: "solid-settings-subheading", children: [formik.values.authPagesLayout === "center"
                                                                         ? "Background"
                                                                         : "Banner", " ", "Image"] }), formik.values.authPagesLayout === "left" && (_jsxs("div", { children: [_jsxs("div", __assign({}, getAuthScreenLeftBackgroundImageRootProps(), { className: "solid-dropzone-wrapper", style: { borderRadius: 8 }, children: [_jsx("input", __assign({}, getAuthScreenLeftBackgroundImageInputProps())), _jsx(SettingDropzoneActivePlaceholder, { note: "Recommended: 724×724px | Aspect ratio: 1:1" })] })), _jsx("div", { className: "mt-2", children: (function () {
                                                                             var logoSrc = AuthScreenLeftBackgroundImage
@@ -531,7 +531,7 @@ export var GeneralSettings = function () {
                                                                                 src = "".concat(env("API_URL"), "/").concat(src);
                                                                             }
                                                                             return (_jsx(SolidUploadedImage, { src: src, height: 300, width: 600, maxHeight: 300 }));
-                                                                        })() }), formik.values.authScreenCenterBackgroundImage && (_jsx(SettingsImageRemoveButton, { onClick: removeAuthScreenCenterBackgroundImage }))] }))] }) }) }) }), _jsx(SolidDivider, { className: "my-4" })] })), pathname.includes("misc-settings") && (_jsxs(_Fragment, { children: [_jsx("p", { className: "solid-settings-heading", children: "Contact Support" }), _jsx("div", { className: 'formgrid grid', children: _jsx("div", { className: "col-12 lg:col-10 xl:col-8", children: _jsxs("div", { className: 'formgrid grid', children: [_jsx("div", { className: "col-12 md:col-6 pb-3 md:pb-0", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-12 md:col-5 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "Contact Support Email" }) }), _jsx("div", { className: "col-12 md:col-7", children: _jsx(SolidInput, { type: "text", id: "contactSupportEmail", name: "contactSupportEmail", onChange: formik.handleChange, value: (_44 = formik.values.contactSupportEmail) !== null && _44 !== void 0 ? _44 : '', className: 'w-full' }) })] }) }), _jsx("div", { className: "col-12 md:col-6", children: _jsxs("div", { className: "formgrid grid align-items-center", children: [_jsx("div", { className: "col-12 md:col-5 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "Display Name" }) }), _jsx("div", { className: "col-12 md:col-7", children: _jsx(SolidInput, { type: "text", id: "contactSupportDisplayName", name: "contactSupportDisplayName", onChange: formik.handleChange, value: (_45 = formik.values.contactSupportDisplayName) !== null && _45 !== void 0 ? _45 : '', className: 'w-full' }) })] }) })] }) }) })] })), pathname.includes("ai-settings") &&
+                                                                        })() }), formik.values.authScreenCenterBackgroundImage && (_jsx(SettingsImageRemoveButton, { onClick: removeAuthScreenCenterBackgroundImage }))] }))] }) }) }) }), _jsx(SolidDivider, { className: "my-6" })] })), pathname.includes("misc-settings") && (_jsxs(_Fragment, { children: [_jsx("p", { className: "solid-settings-heading", children: "Contact Support" }), _jsx("div", { className: 'flex flex-wrap -mx-2 -mt-2', children: _jsx("div", { className: "w-full lg:w-[83.333333%] xl:w-[66.666667%] px-2 pt-2", children: _jsxs("div", { className: 'flex flex-wrap -mx-2 -mt-2', children: [_jsx("div", { className: "w-full md:w-1/2 px-2 pt-2 pb-4 md:pb-0", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-full md:w-[41.666667%] px-2 pt-2 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "Contact Support Email" }) }), _jsx("div", { className: "w-full md:w-[58.333333%] px-2 pt-2", children: _jsx(SolidInput, { type: "text", id: "contactSupportEmail", name: "contactSupportEmail", onChange: formik.handleChange, value: (_44 = formik.values.contactSupportEmail) !== null && _44 !== void 0 ? _44 : '', className: 'w-full' }) })] }) }), _jsx("div", { className: "w-full md:w-1/2 px-2 pt-2", children: _jsxs("div", { className: "flex flex-wrap items-center -mx-2 -mt-2", children: [_jsx("div", { className: "w-full md:w-[41.666667%] px-2 pt-2 pb-2 md:pb-0", children: _jsx("label", { className: "form-field-label", children: "Display Name" }) }), _jsx("div", { className: "w-full md:w-[58.333333%] px-2 pt-2", children: _jsx(SolidInput, { type: "text", id: "contactSupportDisplayName", name: "contactSupportDisplayName", onChange: formik.handleChange, value: (_45 = formik.values.contactSupportDisplayName) !== null && _45 !== void 0 ? _45 : '', className: 'w-full' }) })] }) })] }) }) })] })), pathname.includes("ai-settings") &&
                                     _jsx(AiSettingsSection, { aiConfig: formik.values.solidXGenAiCodeBuilderConfig, onAiConfigChange: handleAiConfigChange }), pathname.includes("api-keys") && ((_46 = session === null || session === void 0 ? void 0 : session.user) === null || _46 === void 0 ? void 0 : _46.id) &&
                                     _jsx(ApiKeysTab, { userId: session.user.id, canCreate: (_48 = (_47 = session === null || session === void 0 ? void 0 : session.user) === null || _47 === void 0 ? void 0 : _47.isAllowedToGenerateApiKeys) !== null && _48 !== void 0 ? _48 : false })] })] }) }) }) }));
 };