@uxf/cms 14.0.0 → 14.1.0

package/content-builder/forms/content-builder-seo-form.js

@@ -4,6 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ContentBuilderSeoForm = ContentBuilderSeoForm;
+const compiler_runtime_1 = require("react/compiler-runtime");
 const translations_1 = require("@uxf/core-react/translations");
 const file_input_1 = require("@uxf/form/file-input");
 const text_input_1 = require("@uxf/form/text-input");
@@ -11,13 +12,96 @@ const react_1 = __importDefault(require("react"));
 const api_1 = require("../../api");
 // eslint-disable-next-line complexity
 function ContentBuilderSeoForm(props) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
+    var _a, _b, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30;
+    const $ = (0, compiler_runtime_1.c)(33);
     const t = (0, translations_1.useUxfTranslation)();
-    return (react_1.default.createElement("div", { className: props.className },
-        !((_c = (_b = (_a = props.fields) === null || _a === void 0 ? void 0 : _a.seo) === null || _b === void 0 ? void 0 : _b.name) === null || _c === void 0 ? void 0 : _c.isHidden) && (react_1.default.createElement(text_input_1.TextInput, { control: props.formApi.control, helperText: t("uxf-cms-content-builder:seo-form.slug-helper"), isRequired: true, label: t("uxf-cms-content-builder:seo-form.slug"), name: "seo.name", type: "text" })),
-        !((_f = (_e = (_d = props.fields) === null || _d === void 0 ? void 0 : _d.seo) === null || _e === void 0 ? void 0 : _e.title) === null || _f === void 0 ? void 0 : _f.isHidden) && (react_1.default.createElement(text_input_1.TextInput, { control: props.formApi.control, label: t("uxf-cms-content-builder:seo-form.title"), name: "seo.title", type: "text" })),
-        !((_j = (_h = (_g = props.fields) === null || _g === void 0 ? void 0 : _g.seo) === null || _h === void 0 ? void 0 : _h.description) === null || _j === void 0 ? void 0 : _j.isHidden) && (react_1.default.createElement(text_input_1.TextInput, { control: props.formApi.control, label: t("uxf-cms-content-builder:seo-form.description"), name: "seo.description", type: "text" })),
-        !((_m = (_l = (_k = props.fields) === null || _k === void 0 ? void 0 : _k.seo) === null || _l === void 0 ? void 0 : _l.ogTitle) === null || _m === void 0 ? void 0 : _m.isHidden) && (react_1.default.createElement(text_input_1.TextInput, { control: props.formApi.control, helperText: t("uxf-cms-content-builder:seo-form.og-title-helper"), label: "OG nadpis", name: "seo.ogTitle", type: "text" })),
-        !((_q = (_p = (_o = props.fields) === null || _o === void 0 ? void 0 : _o.seo) === null || _p === void 0 ? void 0 : _p.ogDescription) === null || _q === void 0 ? void 0 : _q.isHidden) && (react_1.default.createElement(text_input_1.TextInput, { control: props.formApi.control, helperText: t("uxf-cms-content-builder:seo-form.og-description-helper"), label: "OG popis", name: "seo.ogDescription", type: "text" })),
-        !((_t = (_s = (_r = props.fields) === null || _r === void 0 ? void 0 : _r.seo) === null || _s === void 0 ? void 0 : _s.ogImage) === null || _t === void 0 ? void 0 : _t.isHidden) && (react_1.default.createElement(file_input_1.FileInput, { control: props.formApi.control, helperText: t("uxf-cms-content-builder:seo-form.og-image-helper"), id: "seo.ogImage", label: t("uxf-cms-content-builder:seo-form.og-image"), name: "seo.ogImage", onUploadFile: (file) => (0, api_1.uploadFile)(file, props.uploadNamespace) }))));
+    let t0;
+    if ($[0] !== ((_d = (_b = (_a = props.fields) === null || _a === void 0 ? void 0 : _a.seo) === null || _b === void 0 ? void 0 : _b.name) === null || _d === void 0 ? void 0 : _d.isHidden) || $[1] !== props.formApi || $[2] !== t) {
+        t0 = !((_g = (_f = (_e = props.fields) === null || _e === void 0 ? void 0 : _e.seo) === null || _f === void 0 ? void 0 : _f.name) === null || _g === void 0 ? void 0 : _g.isHidden) && react_1.default.createElement(text_input_1.TextInput, { control: props.formApi.control, helperText: t("uxf-cms-content-builder:seo-form.slug-helper"), isRequired: true, label: t("uxf-cms-content-builder:seo-form.slug"), name: "seo.name", type: "text" });
+        $[0] = (_k = (_j = (_h = props.fields) === null || _h === void 0 ? void 0 : _h.seo) === null || _j === void 0 ? void 0 : _j.name) === null || _k === void 0 ? void 0 : _k.isHidden;
+        $[1] = props.formApi;
+        $[2] = t;
+        $[3] = t0;
+    }
+    else {
+        t0 = $[3];
+    }
+    let t1;
+    if ($[4] !== ((_o = (_m = (_l = props.fields) === null || _l === void 0 ? void 0 : _l.seo) === null || _m === void 0 ? void 0 : _m.title) === null || _o === void 0 ? void 0 : _o.isHidden) || $[5] !== props.formApi || $[6] !== t) {
+        t1 = !((_r = (_q = (_p = props.fields) === null || _p === void 0 ? void 0 : _p.seo) === null || _q === void 0 ? void 0 : _q.title) === null || _r === void 0 ? void 0 : _r.isHidden) && react_1.default.createElement(text_input_1.TextInput, { control: props.formApi.control, label: t("uxf-cms-content-builder:seo-form.title"), name: "seo.title", type: "text" });
+        $[4] = (_u = (_t = (_s = props.fields) === null || _s === void 0 ? void 0 : _s.seo) === null || _t === void 0 ? void 0 : _t.title) === null || _u === void 0 ? void 0 : _u.isHidden;
+        $[5] = props.formApi;
+        $[6] = t;
+        $[7] = t1;
+    }
+    else {
+        t1 = $[7];
+    }
+    let t2;
+    if ($[8] !== ((_x = (_w = (_v = props.fields) === null || _v === void 0 ? void 0 : _v.seo) === null || _w === void 0 ? void 0 : _w.description) === null || _x === void 0 ? void 0 : _x.isHidden) || $[9] !== props.formApi || $[10] !== t) {
+        t2 = !((_0 = (_z = (_y = props.fields) === null || _y === void 0 ? void 0 : _y.seo) === null || _z === void 0 ? void 0 : _z.description) === null || _0 === void 0 ? void 0 : _0.isHidden) && react_1.default.createElement(text_input_1.TextInput, { control: props.formApi.control, label: t("uxf-cms-content-builder:seo-form.description"), name: "seo.description", type: "text" });
+        $[8] = (_3 = (_2 = (_1 = props.fields) === null || _1 === void 0 ? void 0 : _1.seo) === null || _2 === void 0 ? void 0 : _2.description) === null || _3 === void 0 ? void 0 : _3.isHidden;
+        $[9] = props.formApi;
+        $[10] = t;
+        $[11] = t2;
+    }
+    else {
+        t2 = $[11];
+    }
+    let t3;
+    if ($[12] !== ((_6 = (_5 = (_4 = props.fields) === null || _4 === void 0 ? void 0 : _4.seo) === null || _5 === void 0 ? void 0 : _5.ogTitle) === null || _6 === void 0 ? void 0 : _6.isHidden) || $[13] !== props.formApi || $[14] !== t) {
+        t3 = !((_9 = (_8 = (_7 = props.fields) === null || _7 === void 0 ? void 0 : _7.seo) === null || _8 === void 0 ? void 0 : _8.ogTitle) === null || _9 === void 0 ? void 0 : _9.isHidden) && react_1.default.createElement(text_input_1.TextInput, { control: props.formApi.control, helperText: t("uxf-cms-content-builder:seo-form.og-title-helper"), label: "OG nadpis", name: "seo.ogTitle", type: "text" });
+        $[12] = (_12 = (_11 = (_10 = props.fields) === null || _10 === void 0 ? void 0 : _10.seo) === null || _11 === void 0 ? void 0 : _11.ogTitle) === null || _12 === void 0 ? void 0 : _12.isHidden;
+        $[13] = props.formApi;
+        $[14] = t;
+        $[15] = t3;
+    }
+    else {
+        t3 = $[15];
+    }
+    let t4;
+    if ($[16] !== ((_15 = (_14 = (_13 = props.fields) === null || _13 === void 0 ? void 0 : _13.seo) === null || _14 === void 0 ? void 0 : _14.ogDescription) === null || _15 === void 0 ? void 0 : _15.isHidden) || $[17] !== props.formApi || $[18] !== t) {
+        t4 = !((_18 = (_17 = (_16 = props.fields) === null || _16 === void 0 ? void 0 : _16.seo) === null || _17 === void 0 ? void 0 : _17.ogDescription) === null || _18 === void 0 ? void 0 : _18.isHidden) && react_1.default.createElement(text_input_1.TextInput, { control: props.formApi.control, helperText: t("uxf-cms-content-builder:seo-form.og-description-helper"), label: "OG popis", name: "seo.ogDescription", type: "text" });
+        $[16] = (_21 = (_20 = (_19 = props.fields) === null || _19 === void 0 ? void 0 : _19.seo) === null || _20 === void 0 ? void 0 : _20.ogDescription) === null || _21 === void 0 ? void 0 : _21.isHidden;
+        $[17] = props.formApi;
+        $[18] = t;
+        $[19] = t4;
+    }
+    else {
+        t4 = $[19];
+    }
+    let t5;
+    if ($[20] !== ((_24 = (_23 = (_22 = props.fields) === null || _22 === void 0 ? void 0 : _22.seo) === null || _23 === void 0 ? void 0 : _23.ogImage) === null || _24 === void 0 ? void 0 : _24.isHidden) || $[21] !== props.formApi || $[22] !== props.uploadNamespace || $[23] !== t) {
+        t5 = !((_27 = (_26 = (_25 = props.fields) === null || _25 === void 0 ? void 0 : _25.seo) === null || _26 === void 0 ? void 0 : _26.ogImage) === null || _27 === void 0 ? void 0 : _27.isHidden) && react_1.default.createElement(file_input_1.FileInput, { control: props.formApi.control, helperText: t("uxf-cms-content-builder:seo-form.og-image-helper"), id: "seo.ogImage", label: t("uxf-cms-content-builder:seo-form.og-image"), name: "seo.ogImage", onUploadFile: file => (0, api_1.uploadFile)(file, props.uploadNamespace) });
+        $[20] = (_30 = (_29 = (_28 = props.fields) === null || _28 === void 0 ? void 0 : _28.seo) === null || _29 === void 0 ? void 0 : _29.ogImage) === null || _30 === void 0 ? void 0 : _30.isHidden;
+        $[21] = props.formApi;
+        $[22] = props.uploadNamespace;
+        $[23] = t;
+        $[24] = t5;
+    }
+    else {
+        t5 = $[24];
+    }
+    let t6;
+    if ($[25] !== props.className || $[26] !== t0 || $[27] !== t1 || $[28] !== t2 || $[29] !== t3 || $[30] !== t4 || $[31] !== t5) {
+        t6 = react_1.default.createElement("div", { className: props.className },
+            t0,
+            t1,
+            t2,
+            t3,
+            t4,
+            t5);
+        $[25] = props.className;
+        $[26] = t0;
+        $[27] = t1;
+        $[28] = t2;
+        $[29] = t3;
+        $[30] = t4;
+        $[31] = t5;
+        $[32] = t6;
+    }
+    else {
+        t6 = $[32];
+    }
+    return t6;
 }

package/forms/change-password-form/change-password-form.js

@@ -4,6 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ChangePasswordForm = void 0;
+const compiler_runtime_1 = require("react/compiler-runtime");
 const translations_1 = require("@uxf/core-react/translations");
 const form_1 = require("@uxf/form/form");
 const text_input_1 = require("@uxf/form/text-input");
@@ -11,21 +12,157 @@ const button_1 = require("@uxf/ui/button");
 const react_1 = __importDefault(require("react"));
 const react_hook_form_1 = require("react-hook-form");
 const widget_1 = require("../../ui/widget");
-const ChangePasswordForm = (props) => {
-    // eslint-disable-next-line react/destructuring-assignment
-    const { defaultValues, ...formProps } = props;
+const ChangePasswordForm = props => {
+    const $ = (0, compiler_runtime_1.c)(39);
+    let defaultValues;
+    let formProps;
+    if ($[0] !== props) {
+        ({
+            defaultValues,
+            ...formProps
+        } = props);
+        $[0] = props;
+        $[1] = defaultValues;
+        $[2] = formProps;
+    }
+    else {
+        defaultValues = $[1];
+        formProps = $[2];
+    }
     const t = (0, translations_1.useUxfTranslation)();
-    const formApi = (0, react_hook_form_1.useForm)({
-        defaultValues,
-    });
-    return (react_1.default.createElement(form_1.Form, { formApi: formApi, id: "change-password-form", ...formProps },
-        react_1.default.createElement(widget_1.Widget, { className: "[&>*]:p-4", footer: react_1.default.createElement("div", { className: "text-right" },
-                react_1.default.createElement(button_1.Button, { isDisabled: formApi.formState.isSubmitting, type: "submit" }, t("uxf-cms-change-password-form:save"))), withDividers: true },
-            react_1.default.createElement(text_input_1.TextInput, { control: formApi.control, isRequired: true, label: t("uxf-cms-change-password-form:original-password"), name: "originalPassword", type: "password" }),
-            react_1.default.createElement(text_input_1.TextInput, { control: formApi.control, isRequired: true, label: t("uxf-cms-change-password-form:new-password"), name: "newPassword", rules: props.passwordRules, type: "password" }),
-            react_1.default.createElement(text_input_1.TextInput, { control: formApi.control, isRequired: true, label: t("uxf-cms-change-password-form:new-password-again"), name: "newPasswordAgain", rules: {
-                    validate: (v) => v === formApi.getValues("newPassword") ||
-                        t("uxf-cms-change-password-form:passwords-must-match"),
-                }, type: "password" }))));
+    let t0;
+    if ($[3] !== defaultValues) {
+        t0 = {
+            defaultValues
+        };
+        $[3] = defaultValues;
+        $[4] = t0;
+    }
+    else {
+        t0 = $[4];
+    }
+    const formApi = (0, react_hook_form_1.useForm)(t0);
+    const t1 = formApi.formState.isSubmitting;
+    let t2;
+    if ($[5] !== t) {
+        t2 = t("uxf-cms-change-password-form:save");
+        $[5] = t;
+        $[6] = t2;
+    }
+    else {
+        t2 = $[6];
+    }
+    let t3;
+    if ($[7] !== formApi.formState.isSubmitting || $[8] !== t2) {
+        t3 = react_1.default.createElement("div", { className: "text-right" },
+            react_1.default.createElement(button_1.Button, { isDisabled: t1, type: "submit" }, t2));
+        $[7] = formApi.formState.isSubmitting;
+        $[8] = t2;
+        $[9] = t3;
+    }
+    else {
+        t3 = $[9];
+    }
+    const t4 = formApi.control;
+    let t5;
+    if ($[10] !== t) {
+        t5 = t("uxf-cms-change-password-form:original-password");
+        $[10] = t;
+        $[11] = t5;
+    }
+    else {
+        t5 = $[11];
+    }
+    let t6;
+    if ($[12] !== formApi.control || $[13] !== t5) {
+        t6 = react_1.default.createElement(text_input_1.TextInput, { control: t4, isRequired: true, label: t5, name: "originalPassword", type: "password" });
+        $[12] = formApi.control;
+        $[13] = t5;
+        $[14] = t6;
+    }
+    else {
+        t6 = $[14];
+    }
+    const t7 = formApi.control;
+    let t8;
+    if ($[15] !== t) {
+        t8 = t("uxf-cms-change-password-form:new-password");
+        $[15] = t;
+        $[16] = t8;
+    }
+    else {
+        t8 = $[16];
+    }
+    let t9;
+    if ($[17] !== formApi.control || $[18] !== props.passwordRules || $[19] !== t8) {
+        t9 = react_1.default.createElement(text_input_1.TextInput, { control: t7, isRequired: true, label: t8, name: "newPassword", rules: props.passwordRules, type: "password" });
+        $[17] = formApi.control;
+        $[18] = props.passwordRules;
+        $[19] = t8;
+        $[20] = t9;
+    }
+    else {
+        t9 = $[20];
+    }
+    const t10 = formApi.control;
+    let t11;
+    if ($[21] !== t) {
+        t11 = t("uxf-cms-change-password-form:new-password-again");
+        $[21] = t;
+        $[22] = t11;
+    }
+    else {
+        t11 = $[22];
+    }
+    let t12;
+    if ($[23] !== formApi || $[24] !== t) {
+        t12 = {
+            validate: v => v === formApi.getValues("newPassword") || t("uxf-cms-change-password-form:passwords-must-match")
+        };
+        $[23] = formApi;
+        $[24] = t;
+        $[25] = t12;
+    }
+    else {
+        t12 = $[25];
+    }
+    let t13;
+    if ($[26] !== formApi.control || $[27] !== t11 || $[28] !== t12) {
+        t13 = react_1.default.createElement(text_input_1.TextInput, { control: t10, isRequired: true, label: t11, name: "newPasswordAgain", rules: t12, type: "password" });
+        $[26] = formApi.control;
+        $[27] = t11;
+        $[28] = t12;
+        $[29] = t13;
+    }
+    else {
+        t13 = $[29];
+    }
+    let t14;
+    if ($[30] !== t13 || $[31] !== t3 || $[32] !== t6 || $[33] !== t9) {
+        t14 = react_1.default.createElement(widget_1.Widget, { className: "[&>*]:p-4", footer: t3, withDividers: true },
+            t6,
+            t9,
+            t13);
+        $[30] = t13;
+        $[31] = t3;
+        $[32] = t6;
+        $[33] = t9;
+        $[34] = t14;
+    }
+    else {
+        t14 = $[34];
+    }
+    let t15;
+    if ($[35] !== formApi || $[36] !== formProps || $[37] !== t14) {
+        t15 = react_1.default.createElement(form_1.Form, { formApi: formApi, id: "change-password-form", ...formProps }, t14);
+        $[35] = formApi;
+        $[36] = formProps;
+        $[37] = t14;
+        $[38] = t15;
+    }
+    else {
+        t15 = $[38];
+    }
+    return t15;
 };
 exports.ChangePasswordForm = ChangePasswordForm;

package/forms/components/wysiwyg-input/wysiwyg-input.js

@@ -34,6 +34,7 @@ var __importStar = (this && this.__importStar) || (function () {
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.WysiwygInput = WysiwygInput;
+const compiler_runtime_1 = require("react/compiler-runtime");
 const classes_1 = require("@uxf/core/constants/classes");
 const cx_1 = require("@uxf/core/utils/cx");
 const file_1 = require("@uxf/core/utils/file");
@@ -47,59 +48,196 @@ const react_1 = __importStar(require("react"));
 const react_hook_form_1 = require("react-hook-form");
 const api_1 = require("../../../api");
 function WysiwygInput(props) {
-    var _a, _b, _c, _d;
+    var _a, _b, _d, _e, _f;
+    const $ = (0, compiler_runtime_1.c)(65);
     const t = (0, translations_1.useUxfTranslation)();
-    const { field, fieldState } = (0, react_hook_form_1.useController)({
-        control: props.control,
-        defaultValue: props.defaultValue,
-        name: props.name,
-        rules: {
-            required: props.isRequired
-                ? props.requiredMessage || t("uxf-cms-wysiwyg-input:validation.required")
-                : undefined,
-            ...props.rules,
-        },
-        shouldUnregister: props.shouldUnregister,
-    });
-    const plugins = (0, react_1.useMemo)(() => {
-        var _a;
-        return props.plugins && props.plugins.length > 0
-            ? (0, wysiwyg_1.createPluginsWithUi)(props.plugins)
-            : (0, create_all_plugins_with_ui_1.createAllPluginsWithUi)((_a = props.allPluginsOptions) !== null && _a !== void 0 ? _a : { image: { getImageUrl: file_1.getFileUrl, uploadImage: api_1.uploadFile } });
-    }, [props.allPluginsOptions, props.plugins]);
+    let t0;
+    if ($[0] !== props.isRequired || $[1] !== props.requiredMessage || $[2] !== t) {
+        t0 = props.isRequired ? props.requiredMessage || t("uxf-cms-wysiwyg-input:validation.required") : undefined;
+        $[0] = props.isRequired;
+        $[1] = props.requiredMessage;
+        $[2] = t;
+        $[3] = t0;
+    }
+    else {
+        t0 = $[3];
+    }
+    let t1;
+    if ($[4] !== props.rules || $[5] !== t0) {
+        t1 = {
+            required: t0,
+            ...props.rules
+        };
+        $[4] = props.rules;
+        $[5] = t0;
+        $[6] = t1;
+    }
+    else {
+        t1 = $[6];
+    }
+    let t2;
+    if ($[7] !== props.control || $[8] !== props.defaultValue || $[9] !== props.name || $[10] !== props.shouldUnregister || $[11] !== t1) {
+        t2 = {
+            control: props.control,
+            defaultValue: props.defaultValue,
+            name: props.name,
+            rules: t1,
+            shouldUnregister: props.shouldUnregister
+        };
+        $[7] = props.control;
+        $[8] = props.defaultValue;
+        $[9] = props.name;
+        $[10] = props.shouldUnregister;
+        $[11] = t1;
+        $[12] = t2;
+    }
+    else {
+        t2 = $[12];
+    }
+    const { field, fieldState } = (0, react_hook_form_1.useController)(t2);
+    let t3;
+    if ($[13] !== props.allPluginsOptions || $[14] !== props.plugins) {
+        t3 = props.plugins && props.plugins.length > 0 ? (0, wysiwyg_1.createPluginsWithUi)(props.plugins) : (0, create_all_plugins_with_ui_1.createAllPluginsWithUi)((_a = props.allPluginsOptions) !== null && _a !== void 0 ? _a : {
+            image: {
+                getImageUrl: file_1.getFileUrl,
+                uploadImage: api_1.uploadFile
+            }
+        });
+        $[13] = props.allPluginsOptions;
+        $[14] = props.plugins;
+        $[15] = t3;
+    }
+    else {
+        t3 = $[15];
+    }
+    const plugins = t3;
     const generatedId = (0, react_1.useId)();
-    const id = (_a = props.id) !== null && _a !== void 0 ? _a : generatedId;
+    const id = (_b = props.id) !== null && _b !== void 0 ? _b : generatedId;
     const innerRef = (0, react_1.useRef)(null);
     const editorRef = (0, react_1.useRef)(null);
     const input = (0, use_input_focus_1.useInputFocus)(innerRef, props.onBlur, props.onFocus);
-    const isInvalid = (0, is_not_nil_1.isNotNil)(fieldState.error);
-    const errorId = isInvalid ? `${props.id}--error-message` : undefined;
-    const rootClassName = (0, cx_1.cx)("uxf-text-input", ((_b = props._isFocused) !== null && _b !== void 0 ? _b : input.focused) && classes_1.CLASSES.IS_FOCUSED, props.isDisabled && classes_1.CLASSES.IS_DISABLED, isInvalid && classes_1.CLASSES.IS_INVALID, props.isReadOnly && classes_1.CLASSES.IS_READONLY, props.isRequired && classes_1.CLASSES.IS_REQUIRED, props.className);
-    const onFocus = (0, react_1.useCallback)((e) => {
-        var _a, _b;
-        input.onFocus(e);
-        (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, e);
-        // Trigger editor focus via ref
-        (_b = editorRef.current) === null || _b === void 0 ? void 0 : _b.focus();
-    }, [input, props]);
-    const onBlur = (0, react_1.useCallback)((e) => {
-        var _a;
-        field.onBlur();
-        input.onBlur(e);
-        (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, e);
-    }, [field, input, props]);
-    return (react_1.default.createElement(form_component_1.FormComponent, { className: rootClassName, errorId: errorId, form: props.form, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, inputId: id, isRequired: props.isRequired, label: props.label, name: props.name },
-        react_1.default.createElement(wysiwyg_1.WysiwygEditor, { customPluginsToolbarButtons: props.customPluginsToolbarButtons, editableProps: {
-                "aria-describedby": errorId,
-                "aria-invalid": isInvalid,
-                autoComplete: props.autoComplete,
-                disabled: props.isDisabled,
-                form: props.form,
-                onBlur,
-                onFocus,
-                onKeyDown: props.onKeyDown,
-                placeholder: props.placeholder,
-                readOnly: props.isReadOnly,
-                required: props.isRequired,
-            }, id: id, initialValue: field.value, onChange: field.onChange, plugins: plugins, ref: editorRef, ...props.editorProps })));
+    let errorId;
+    let isInvalid;
+    let t4;
+    if ($[16] !== fieldState.error || $[17] !== input || $[18] !== props._isFocused || $[19] !== props.className || $[20] !== props.id || $[21] !== props.isDisabled || $[22] !== props.isReadOnly || $[23] !== props.isRequired) {
+        isInvalid = (0, is_not_nil_1.isNotNil)(fieldState.error);
+        errorId = isInvalid ? `${props.id}--error-message` : undefined;
+        t4 = (0, cx_1.cx)("uxf-text-input", ((_d = props._isFocused) !== null && _d !== void 0 ? _d : input.focused) && classes_1.CLASSES.IS_FOCUSED, props.isDisabled && classes_1.CLASSES.IS_DISABLED, isInvalid && classes_1.CLASSES.IS_INVALID, props.isReadOnly && classes_1.CLASSES.IS_READONLY, props.isRequired && classes_1.CLASSES.IS_REQUIRED, props.className);
+        $[16] = fieldState.error;
+        $[17] = input;
+        $[18] = props._isFocused;
+        $[19] = props.className;
+        $[20] = props.id;
+        $[21] = props.isDisabled;
+        $[22] = props.isReadOnly;
+        $[23] = props.isRequired;
+        $[24] = errorId;
+        $[25] = isInvalid;
+        $[26] = t4;
+    }
+    else {
+        errorId = $[24];
+        isInvalid = $[25];
+        t4 = $[26];
+    }
+    const rootClassName = t4;
+    let t5;
+    if ($[27] !== input || $[28] !== props) {
+        t5 = e => {
+            var _a, _b;
+            input.onFocus(e);
+            (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, e);
+            (_b = editorRef.current) === null || _b === void 0 ? void 0 : _b.focus();
+        };
+        $[27] = input;
+        $[28] = props;
+        $[29] = t5;
+    }
+    else {
+        t5 = $[29];
+    }
+    const onFocus = t5;
+    let t6;
+    if ($[30] !== field || $[31] !== input || $[32] !== props) {
+        t6 = e_0 => {
+            var _a;
+            field.onBlur();
+            input.onBlur(e_0);
+            (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, e_0);
+        };
+        $[30] = field;
+        $[31] = input;
+        $[32] = props;
+        $[33] = t6;
+    }
+    else {
+        t6 = $[33];
+    }
+    const onBlur = t6;
+    const t7 = (_f = (_e = fieldState.error) === null || _e === void 0 ? void 0 : _e.message) !== null && _f !== void 0 ? _f : props.helperText;
+    let t8;
+    if ($[34] !== errorId || $[35] !== isInvalid || $[36] !== onBlur || $[37] !== onFocus || $[38] !== props.autoComplete || $[39] !== props.form || $[40] !== props.isDisabled || $[41] !== props.isReadOnly || $[42] !== props.isRequired || $[43] !== props.onKeyDown || $[44] !== props.placeholder) {
+        t8 = {
+            "aria-describedby": errorId,
+            "aria-invalid": isInvalid,
+            autoComplete: props.autoComplete,
+            disabled: props.isDisabled,
+            form: props.form,
+            onBlur,
+            onFocus,
+            onKeyDown: props.onKeyDown,
+            placeholder: props.placeholder,
+            readOnly: props.isReadOnly,
+            required: props.isRequired
+        };
+        $[34] = errorId;
+        $[35] = isInvalid;
+        $[36] = onBlur;
+        $[37] = onFocus;
+        $[38] = props.autoComplete;
+        $[39] = props.form;
+        $[40] = props.isDisabled;
+        $[41] = props.isReadOnly;
+        $[42] = props.isRequired;
+        $[43] = props.onKeyDown;
+        $[44] = props.placeholder;
+        $[45] = t8;
+    }
+    else {
+        t8 = $[45];
+    }
+    let t9;
+    if ($[46] !== field.onChange || $[47] !== field.value || $[48] !== id || $[49] !== plugins || $[50] !== props.customPluginsToolbarButtons || $[51] !== props.editorProps || $[52] !== t8) {
+        t9 = react_1.default.createElement(wysiwyg_1.WysiwygEditor, { customPluginsToolbarButtons: props.customPluginsToolbarButtons, editableProps: t8, id: id, initialValue: field.value, onChange: field.onChange, plugins: plugins, ref: editorRef, ...props.editorProps });
+        $[46] = field.onChange;
+        $[47] = field.value;
+        $[48] = id;
+        $[49] = plugins;
+        $[50] = props.customPluginsToolbarButtons;
+        $[51] = props.editorProps;
+        $[52] = t8;
+        $[53] = t9;
+    }
+    else {
+        t9 = $[53];
+    }
+    let t10;
+    if ($[54] !== errorId || $[55] !== id || $[56] !== props.form || $[57] !== props.hiddenLabel || $[58] !== props.isRequired || $[59] !== props.label || $[60] !== props.name || $[61] !== rootClassName || $[62] !== t7 || $[63] !== t9) {
+        t10 = react_1.default.createElement(form_component_1.FormComponent, { className: rootClassName, errorId: errorId, form: props.form, helperText: t7, hiddenLabel: props.hiddenLabel, inputId: id, isRequired: props.isRequired, label: props.label, name: props.name }, t9);
+        $[54] = errorId;
+        $[55] = id;
+        $[56] = props.form;
+        $[57] = props.hiddenLabel;
+        $[58] = props.isRequired;
+        $[59] = props.label;
+        $[60] = props.name;
+        $[61] = rootClassName;
+        $[62] = t7;
+        $[63] = t9;
+        $[64] = t10;
+    }
+    else {
+        t10 = $[64];
+    }
+    return t10;
 }