"use strict";
exports.id = 4559;
exports.ids = [4559];
exports.modules = {

/***/ 4559:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {


// EXPORTS
__webpack_require__.d(__webpack_exports__, {
  "Z": () => (/* binding */ TableEntryField)
});

// EXTERNAL MODULE: external "react/jsx-runtime"
var jsx_runtime_ = __webpack_require__(997);
// EXTERNAL MODULE: external "react"
var external_react_ = __webpack_require__(6689);
var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
;// CONCATENATED MODULE: ./functions/frontend/generateFormElementsForEntry.js
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} params
 * @param {DSQL_FieldSchemaType} params.fieldObject
 * @param {any} params.dataTypeSchema
 * @param {React.MutableRefObject<any>} params.elementRef
 * @param {any} params.entry
 */ 
function generateFormElementsForEntry({ fieldObject , dataTypeSchema , elementRef , entry ,  }) {
    /**
     * Javascript Variables
     *
     * @abstract Non hook variables and functions
     */ let formElement;
    const titleSlugHandler = (/** @type {any} */ e)=>{
        const parentForm = e.target.closest("form");
        if (!parentForm) return;
        const slug = parentForm?.querySelector("#slug");
        if (slug) {
            slug.value = e.target.value.toLowerCase().replace(/ /g, "-").replace(/[^a-z\-0-9]/g, "");
        }
    };
    /**
     * Javascript Variables
     *
     * @abstract Non hook variables and functions
     */ if (fieldObject.defaultField) {
        formElement = /*#__PURE__*/ jsx_runtime_.jsx("input", {
            ref: elementRef,
            type: "text",
            name: "def_field_" + fieldObject.fieldName,
            id: "def_field_" + fieldObject.fieldName,
            placeholder: fieldObject.fieldName,
            defaultValue: entry && entry[fieldObject.fieldName || ""] ? entry[fieldObject.fieldName || ""] : fieldObject.defaultValue ? fieldObject.defaultValue : "",
            style: {
                borderRadius: "0 5px 5px 5px",
                marginTop: "-1px"
            },
            readOnly: true,
            "data-default": "true"
        });
        return formElement;
    }
    ////////////////////////////////////////
    if (fieldObject.dataType?.match(/varchar/i)) {
        formElement = /*#__PURE__*/ jsx_runtime_.jsx("textarea", {
            ref: elementRef,
            name: fieldObject.fieldName,
            id: fieldObject.fieldName,
            placeholder: fieldObject.fieldName,
            required: fieldObject.notNullValue ? true : false,
            maxLength: fieldObject.dataType?.match(/\d+/)?.[0] ? parseInt(fieldObject.dataType?.match(/\d+/)?.[0] || "") : undefined,
            defaultValue: entry && entry[fieldObject.fieldName || ""] ? entry[fieldObject.fieldName || ""] : fieldObject.defaultValue ? fieldObject.defaultValue : "",
            style: {
                borderRadius: "0 5px 5px 5px",
                marginTop: "-1px"
            },
            onChange: (e)=>{
                if (fieldObject.fieldName?.match(/^title$/)) titleSlugHandler(e);
            }
        });
    }
    ////////////////////////////////////////
    if (fieldObject.dataType?.match(/int$/i)) {
        formElement = /*#__PURE__*/ jsx_runtime_.jsx("input", {
            ref: elementRef,
            type: "number",
            name: fieldObject.fieldName,
            id: fieldObject.fieldName,
            placeholder: fieldObject.fieldName,
            required: fieldObject.notNullValue ? true : false,
            max: dataTypeSchema.maxValue,
            style: {
                borderRadius: "0 5px 5px 5px",
                marginTop: "-1px"
            },
            defaultValue: entry && entry[fieldObject.fieldName || ""] ? entry[fieldObject.fieldName || ""] : fieldObject.defaultValue ? fieldObject.defaultValue : "",
            onChange: (e)=>{}
        });
    }
    ////////////////////////////////////////
    if (fieldObject.dataType?.match(/text$/i)) {
        formElement = /*#__PURE__*/ jsx_runtime_.jsx("textarea", {
            ref: elementRef,
            name: fieldObject.fieldName,
            id: fieldObject.fieldName,
            placeholder: fieldObject.fieldName,
            required: fieldObject.notNullValue ? true : false,
            defaultValue: entry && entry[fieldObject.fieldName || ""] ? entry[fieldObject.fieldName || ""] : fieldObject.defaultValue ? fieldObject.defaultValue : "",
            style: {
                borderRadius: "0 5px 5px 5px",
                marginTop: "-1px"
            },
            rows: 10,
            onChange: (e)=>{}
        });
    }
    ////////////////////////////////////////
    if (fieldObject.fieldName?.match(/password|^pass$|^key$/i)) {
        formElement = /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
            className: "w-full relative",
            children: [
                /*#__PURE__*/ jsx_runtime_.jsx("input", {
                    ref: elementRef,
                    type: "password",
                    name: fieldObject.fieldName,
                    id: fieldObject.fieldName,
                    placeholder: fieldObject.fieldName,
                    required: fieldObject.notNullValue ? true : false,
                    max: dataTypeSchema.maxValue,
                    style: {
                        borderRadius: "0 5px 5px 5px",
                        marginTop: "-1px"
                    },
                    defaultValue: entry && entry[fieldObject.fieldName] ? entry[fieldObject.fieldName] : fieldObject.defaultValue ? fieldObject.defaultValue : "",
                    onChange: (e)=>{}
                }),
                /*#__PURE__*/ jsx_runtime_.jsx("span", {
                    className: "absolute right-4 cursor-pointer",
                    onClick: (e)=>{
                        let input = e.target// @ts-ignore
                        .closest("div").querySelector("input");
                        if (input.type === "password") {
                            input.type = "text";
                            // @ts-ignore
                            e.target.innerText = "Hide";
                        } else {
                            input.type = "password";
                            // @ts-ignore
                            e.target.innerText = "Reveal";
                        }
                    },
                    children: "Reveal"
                })
            ]
        });
    }
    ////////////////////////////////////////
    if (!formElement) formElement = /*#__PURE__*/ jsx_runtime_.jsx("input", {
        ref: elementRef,
        type: "text",
        name: fieldObject.fieldName,
        id: fieldObject.fieldName,
        style: {
            borderRadius: "0 5px 5px 5px",
            marginTop: "-1px"
        },
        defaultValue: entry && entry[fieldObject.fieldName || ""] ? entry[fieldObject.fieldName || ""] : fieldObject.defaultValue ? fieldObject.defaultValue : "",
        onChange: (e)=>{}
    });
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    return formElement;
} /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */ 

// EXTERNAL MODULE: ./components/general/LoadingBlock.jsx
var LoadingBlock = __webpack_require__(5264);
// EXTERNAL MODULE: external "@mui/icons-material/LockOutlined"
var LockOutlined_ = __webpack_require__(399);
var LockOutlined_default = /*#__PURE__*/__webpack_require__.n(LockOutlined_);
// EXTERNAL MODULE: external "@tinymce/tinymce-react"
var tinymce_react_ = __webpack_require__(6451);
// EXTERNAL MODULE: external "react-dom/client"
var client_ = __webpack_require__(7849);
var client_default = /*#__PURE__*/__webpack_require__.n(client_);
;// CONCATENATED MODULE: ./components/general/EmbedPopupContent.jsx
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 

/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} props
 * @param {import("tinymce").Editor} props.editor
 * @param {HTMLElement} props.rootElement
 */ function EmbedPopupContent({ editor , rootElement  }) {
    /**
     * Get Contexts
     *
     * @abstract { React.useContext }
     */ ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Javascript Variables
     *
     * @abstract Non hook variables and functions
     */ ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * React Hooks
     *
     * @abstract { useState, useEffect, useRef, etc ... }
     */ ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Function Return
     *
     * @abstract Main Function Return
     */ return /*#__PURE__*/ jsx_runtime_.jsx("div", {
        className: "embed-popup-form-content-wrapper text-sm mt-2 flex-wrap bg-white p-10 rounded max-w-2xl w-full",
        children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)("form", {
            onSubmit: (e)=>{
                e.preventDefault();
                /** @type {HTMLFormElement} */ // @ts-ignore
                const formEl = e.target;
                const htmlText = formEl["embed-text-area"].value;
                if (!htmlText?.match(/./)) return alert("Please Enter HTML Text to continue.");
                editor.insertContent(htmlText);
                document.body.removeChild(rootElement);
            },
            className: "w-full flex flex-col items-stretch gap-2",
            children: [
                /*#__PURE__*/ jsx_runtime_.jsx("h3", {
                    className: "m-0 text-center text-lg",
                    children: "Enter HTML code"
                }),
                /*#__PURE__*/ jsx_runtime_.jsx("textarea", {
                    name: "embed-text-area",
                    id: "embed-text-area",
                    cols: 30,
                    rows: 10,
                    placeholder: "Paste Code here ..."
                }),
                /*#__PURE__*/ jsx_runtime_.jsx("button", {
                    type: "submit",
                    children: "Embed"
                })
            ]
        })
    });
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */ 

;// CONCATENATED MODULE: ./functions/frontend/handleCopyHTML.js
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 


/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * ==============================================================================
 * Auth user on client side
 * ==============================================================================
 * @param {object} params
 * @param {import("tinymce").Editor} [params.editor]
 *
 * @requires search-field name attribute
 */ function handleCopyHTML({ editor  }) {
    /**
     * Check for user in local storage
     *
     * @description Preventdefault, declare variables
     */ navigator.clipboard.writeText(editor?.getContent() || "").then(()=>{
        alert("Html Copied to Clipboard!");
    });
} ////////////////////////////////////////
 ////////////////////////////////////////
 ////////////////////////////////////////

// EXTERNAL MODULE: external "lucide-react"
var external_lucide_react_ = __webpack_require__(2423);
// EXTERNAL MODULE: external "html-prettify"
var external_html_prettify_ = __webpack_require__(2329);
var external_html_prettify_default = /*#__PURE__*/__webpack_require__.n(external_html_prettify_);
;// CONCATENATED MODULE: ./components/general/EditHTMLPopupContent.jsx
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 



/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} props
 * @param {import("tinymce").Editor} props.editor
 * @param {HTMLElement} props.rootElement
 */ function EditHTMLPopupContent({ editor , rootElement  }) {
    /**
     * Get Contexts
     *
     * @abstract { React.useContext }
     */ ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Javascript Variables
     *
     * @abstract Non hook variables and functions
     */ const html = editor.getContent();
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * React Hooks
     *
     * @abstract { useState, useEffect, useRef, etc ... }
     */ /** @type {React.RefObject<any>} */ const editorRef = external_react_default().useRef();
    /** @type {React.RefObject<HTMLButtonElement>} */ // @ts-ignore
    const saveButtonRef = external_react_default().useRef();
    /** @type {[state: AceAjax.Editor | null, setState: React.Dispatch<React.SetStateAction<AceAjax.Editor | null>>]} */ // @ts-ignore
    const [aceEditor, setAceEditor] = external_react_default().useState(null);
    external_react_default().useEffect(()=>{
        try {
            if (!ace?.edit || !editorRef.current) {
                console.log("Ace Editor not found!");
                return;
            }
            const editor = ace.edit(editorRef.current);
            editor.setOptions({
                mode: "ace/mode/html",
                value: external_html_prettify_default()(html)
            });
            setAceEditor(editor);
            try {
                const beautify = ace.require("ace/ext/beautify");
                beautify.beautify(editor.session);
            } catch (/** @type {any} */ error) {}
        } catch (/** @type {any} */ error1) {
            console.log("JSON Editor ERROR =>", error1.message);
        }
    }, []);
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Function Return
     *
     * @abstract Main Function Return
     */ return /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
        onKeyUp: (e)=>{
            if (e.ctrlKey && e.key == "Enter") {
                saveButtonRef.current?.click();
            }
        },
        children: [
            /*#__PURE__*/ jsx_runtime_.jsx("div", {
                className: "embed-popup-form-content-wrapper relative flex flex-col items-center justify-center",
                children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                    className: "max-w-[1200px] rounded-md overflow-hidden bg-white w-[90vw] items-start justify-start relative",
                    children: [
                        /*#__PURE__*/ jsx_runtime_.jsx("div", {
                            ref: editorRef,
                            className: "w-full h-[80vh] text-[18px]"
                        }),
                        /*#__PURE__*/ jsx_runtime_.jsx("button", {
                            className: "absolute bottom-4 right-4",
                            onClick: (e)=>{
                                if (aceEditor) {
                                    /** @type {AceAjax.Editor} */ const finalAceEditor = aceEditor;
                                    const content = finalAceEditor.getValue();
                                    editor.setContent(content);
                                    setTimeout(()=>{
                                        document.body.removeChild(rootElement);
                                    }, 200);
                                }
                            },
                            ref: saveButtonRef,
                            children: "Save"
                        })
                    ]
                })
            }),
            /*#__PURE__*/ jsx_runtime_.jsx("button", {
                className: "absolute top-4 right-8 rounded-full white",
                onClick: ()=>{
                    try {
                        document.body.removeChild(rootElement);
                    } catch (error) {}
                },
                style: {
                    width: "40px",
                    height: "40px",
                    padding: "0",
                    zIndex: "12039800000"
                },
                children: /*#__PURE__*/ jsx_runtime_.jsx(external_lucide_react_.X, {})
            })
        ]
    });
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */ 

;// CONCATENATED MODULE: ./functions/frontend/handleEditHTML.js
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 




/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * ==============================================================================
 * Auth user on client side
 * ==============================================================================
 * @param {object} params
 * @param {import("tinymce").Editor} [params.editor]
 *
 * @requires search-field name attribute
 */ function handleEditHTML({ editor  }) {
    /**
     * Check for user in local storage
     *
     * @description Preventdefault, declare variables
     */ const popupWrapper = document.createElement("div");
    popupWrapper.style.position = "fixed";
    popupWrapper.style.width = "100vw";
    popupWrapper.style.height = "100vh";
    popupWrapper.style.zIndex = "123000000000000000";
    popupWrapper.style.backgroundColor = "rgba(0,0,0,0.8)";
    popupWrapper.style.display = "flex";
    popupWrapper.style.alignItems = "center";
    popupWrapper.style.justifyContent = "center";
    popupWrapper.style.top = "0";
    popupWrapper.style.left = "0";
    document.body.append(popupWrapper);
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    popupWrapper.onclick = (e)=>{
        /** @type {HTMLElement} */ // @ts-ignore
        const el = e.target;
        if (el.closest(".embed-popup-form-content-wrapper")) {
            return;
        }
        document.body.removeChild(popupWrapper);
    };
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    if (editor) {
        const root = client_default().createRoot(popupWrapper);
        root.render(/*#__PURE__*/ jsx_runtime_.jsx(EditHTMLPopupContent, {
            editor: editor,
            rootElement: popupWrapper
        }));
    }
} ////////////////////////////////////////
 ////////////////////////////////////////
 ////////////////////////////////////////

;// CONCATENATED MODULE: ./functions/frontend/handleEmbed.js
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 



/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * ==============================================================================
 * Auth user on client side
 * ==============================================================================
 * @param {object} params
 * @param {import("tinymce").Editor} [params.editor]
 *
 * @requires search-field name attribute
 */ function handleEmbed({ editor  }) {
    /**
     * Check for user in local storage
     *
     * @description Preventdefault, declare variables
     */ const popupWrapper = document.createElement("div");
    popupWrapper.style.position = "fixed";
    popupWrapper.style.width = "100vw";
    popupWrapper.style.height = "100vh";
    popupWrapper.style.zIndex = "123000000000000000";
    popupWrapper.style.backgroundColor = "rgba(0,0,0,0.8)";
    popupWrapper.style.display = "flex";
    popupWrapper.style.alignItems = "center";
    popupWrapper.style.justifyContent = "center";
    popupWrapper.style.top = "0";
    popupWrapper.style.left = "0";
    document.body.append(popupWrapper);
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    popupWrapper.onclick = (e)=>{
        /** @type {HTMLElement} */ // @ts-ignore
        const el = e.target;
        if (el.closest(".embed-popup-form-content-wrapper")) {
            console.log("Still In Form");
            return;
        }
        document.body.removeChild(popupWrapper);
    };
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    if (editor) {
        const root = client_default().createRoot(popupWrapper);
        root.render(/*#__PURE__*/ jsx_runtime_.jsx(EmbedPopupContent, {
            editor: editor,
            rootElement: popupWrapper
        }));
    }
} ////////////////////////////////////////
 ////////////////////////////////////////
 ////////////////////////////////////////

;// CONCATENATED MODULE: ./functions/frontend/tinyMCEEditorSetup.js
// @ts-check



/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * @param {object} params
 * @param {import("tinymce").Editor} params.editor
 * @param {string} [params.formButtonId]
 */ function tinyMCEEditorSetup({ editor , formButtonId  }) {
    editor.addShortcut("meta+13", "Save Entry.", ()=>{
        const confirm = window.confirm("Update this Form?");
        if (!confirm) return;
        if (formButtonId) document.getElementById(formButtonId)?.click();
    });
    editor.addShortcut("meta+shift+e", "Edit Code.", ()=>{
        handleEditHTML({
            editor
        });
    });
    editor.addShortcut("meta+shift+d", "Embed Code.", ()=>{
        handleEmbed({
            editor
        });
    });
    editor.addShortcut("meta+shift+c", "Copy Code.", ()=>{
        handleCopyHTML({
            editor
        });
    });
    editor.ui.registry.addButton("editCode", {
        icon: "edit-block",
        onAction: (_)=>handleEditHTML({
                editor
            }),
        tooltip: "Edit HTML Code"
    });
    editor.ui.registry.addButton("embedCode", {
        icon: "sourcecode",
        onAction: (_)=>handleEmbed({
                editor
            }),
        tooltip: "Embed Code"
    });
    editor.ui.registry.addButton("copyCode", {
        icon: "copy",
        onAction: (_)=>handleCopyHTML({
                editor
            }),
        tooltip: "Copy HTML"
    });
} ////////////////////////////////////////
 ////////////////////////////////////////
 ////////////////////////////////////////

;// CONCATENATED MODULE: ./components/admin/databases/TableRichTextEntryField.jsx
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 





/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} props - Server props
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType} props.fieldObject
 * @param {any} [props.dataTypeSchema]
 * @param {React.MutableRefObject<import("@/package-shared/types").RichTextEditorsRefArray[]>} props.richTextEditors
 * @param {React.MutableRefObject<import("@/package-shared/types").RichTextEditorsRefArray[]>} props.currentRichTextEditorForms
 * @param {any} props.entry
 * @param {boolean} [props.entryPage]
 * @param {string} [props.formButtonId]
 */ function TableRichTextEntryField({ fieldObject , dataTypeSchema , richTextEditors , entry , currentRichTextEditorForms , entryPage , formButtonId ,  }) {
    /**
     * Get Contexts
     *
     * @abstract { React.useContext }
     */ ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Javascript Variables
     *
     * @abstract Non hook variables and functions
     */ ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * React Hooks
     *
     * @abstract { useState, useEffect, useRef, etc ... }
     */ const [ready, setReady] = external_react_default().useState(false);
    const elementRef = external_react_default().useRef();
    /** @type {React.MutableRefObject<import("tinymce").Editor | undefined>} */ const editorRef = external_react_default().useRef();
    const log = ()=>{
        if (editorRef.current) {
            console.log(editorRef.current.getContent());
        }
    };
    external_react_default().useEffect(()=>{
        setReady(true);
    }, []);
    external_react_default().useEffect(()=>{
        if (ready) {
            richTextEditors.current.push({
                fieldName: fieldObject.fieldName || "",
                // @ts-ignore
                ref: editorRef
            });
            currentRichTextEditorForms.current.push({
                fieldName: fieldObject.fieldName || "",
                // @ts-ignore
                ref: editorRef
            });
        }
    }, [
        ready
    ]);
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Function Return
     *
     * @abstract Main Function Return
     */ return /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
        className: "flex flex-col items-start gap-0 w-full rich-text-editor-wrapper",
        children: [
            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("label", {
                className: "font-bold text-slate-700 dark:text-slate-300 text-base px-3 py-1 bg-slate-100 dark:bg-slate-700 rounded-t-md border border-solid border-slate-300 dark:border-slate-300/20 flex items-center gap-2",
                htmlFor: fieldObject.fieldName,
                children: [
                    fieldObject.encrypted && /*#__PURE__*/ jsx_runtime_.jsx((LockOutlined_default()), {
                        fontSize: "small",
                        className: "opacity-50"
                    }),
                    /*#__PURE__*/ jsx_runtime_.jsx("span", {
                        children: fieldObject.fieldName
                    })
                ]
            }),
            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                // @ts-ignore
                ref: elementRef,
                id: fieldObject.fieldName,
                className: "w-full p-0 sm:p-4 flex-col items-stretch bg-slate-100 relative dark:bg-slate-700 border border-solid border-slate-300 dark:border-slate-300/20",
                style: {
                    borderRadius: "0 5px 5px 5px",
                    marginTop: "-1px"
                },
                children: [
                    !ready && /*#__PURE__*/ jsx_runtime_.jsx(LoadingBlock/* default */.Z, {}),
                    ready && /*#__PURE__*/ jsx_runtime_.jsx((external_react_default()).Fragment, {
                        children: /*#__PURE__*/ jsx_runtime_.jsx(tinymce_react_.Editor, {
                            tinymceScriptSrc: "/tinymce/tinymce.min.js",
                            onInit: (evt, editor)=>{
                                editorRef.current = editor;
                            },
                            initialValue: fieldObject.defaultValue || (entry && fieldObject.fieldName && entry[fieldObject.fieldName] ? entry[fieldObject.fieldName] : ""),
                            init: {
                                height: entryPage ? 400 : 300,
                                width: "100%",
                                convert_urls: false,
                                menubar: false,
                                plugins: [
                                    "advlist",
                                    "lists",
                                    "link",
                                    "image",
                                    "charmap",
                                    "anchor",
                                    "searchreplace",
                                    "visualblocks",
                                    "code",
                                    "fullscreen",
                                    "insertdatetime",
                                    "media",
                                    "table",
                                    "preview",
                                    "help",
                                    "wordcount", 
                                ],
                                toolbar: "undo redo | blocks | " + "bold italic forecolor | link image | alignleft aligncenter " + "alignright alignjustify | bullist numlist outdent indent | " + "removeformat help | editCode embedCode copyCode",
                                placeholder: "Type something ...",
                                document_base_url: "/",
                                content_css: fieldObject.cssFiles || undefined,
                                setup: (editor)=>{
                                    tinyMCEEditorSetup({
                                        editor,
                                        formButtonId
                                    });
                                }
                            }
                        })
                    })
                ]
            })
        ]
    });
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */ 

// EXTERNAL MODULE: ./functions/frontend/fetchApi.js
var fetchApi = __webpack_require__(6729);
// EXTERNAL MODULE: external "@monaco-editor/react"
var react_ = __webpack_require__(2587);
;// CONCATENATED MODULE: ./components/admin/databases/fields/text/ace-editor.js
// @ts-check
/**
 * # Setup ACE Editor
 * @param {object} param0
 * @param {React.MutableRefObject<HTMLDivElement | undefined>} param0.jsonEditorRef
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType} param0.fieldObject
 * @param {React.Dispatch<React.SetStateAction<number>>} param0.setRefresh
 * @param {import("./JSONEditor").AceTextType} param0.typeFinal
 * @param {any} param0.entry
 * @param {React.MutableRefObject<import("@/package-shared/types").JSONTextEditorsRefArray[]>} param0.jsonTextEditors
 * @param {React.MutableRefObject<AceAjax.Editor>} param0.editorRef
 */ function aceEditorSetup({ jsonEditorRef , fieldObject , setRefresh , typeFinal , entry , jsonTextEditors , editorRef ,  }) {
    try {
        if (!ace?.edit || !jsonEditorRef.current || !fieldObject.fieldName) {
            console.log("Ace Editor not found!");
            setTimeout(()=>{
                setRefresh((prev)=>prev + 1);
            }, 1000);
            return;
        }
        const editor = ace.edit(jsonEditorRef.current);
        editor.setOptions({
            mode: "ace/mode/" + typeFinal,
            // theme: "ace/theme/twilight",
            value: fieldObject.defaultValue ? fieldObject.defaultValue : entry?.[fieldObject.fieldName] ? (()=>{
                if (typeFinal !== "json") return entry[fieldObject.fieldName];
                try {
                    return JSON.stringify(JSON.parse(entry[fieldObject.fieldName]), null, 4);
                } catch (error) {
                    return entry[fieldObject.fieldName];
                }
            })() : "",
            placeholder: typeFinal == "json" ? "{} ..." : "",
            enableBasicAutocompletion: true,
            enableLiveAutocompletion: true
        });
        jsonTextEditors.current.push({
            fieldName: fieldObject.fieldName,
            ref: editorRef
        });
        editorRef.current = editor;
        try {
            const beautify = ace.require("ace/ext/beautify");
            beautify.beautify(editor.session);
        } catch (/** @type {any} */ error) {}
    } catch (/** @type {any} */ error1) {
        console.log("JSON Editor ERROR =>", error1.message);
    }
}

;// CONCATENATED MODULE: ./components/admin/databases/fields/text/JSONEditorHeader.jsx
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 






/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * # JSON editor Header
 * @param {Object} props
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType} props.fieldObject
 * @param {import("./JSONEditor").AceTextType} props.typeFinal
 * @param {boolean} props.isExpanded
 * @param {React.Dispatch<React.SetStateAction<number>>} props.setHeight
 * @param {number} props.COLLAPSED_HEIGHT
 * @param {number} props.EXPANDED_HEIGHT
 * @returns
 */ function JSONEditorHeader({ fieldObject , typeFinal , isExpanded , setHeight , COLLAPSED_HEIGHT , EXPANDED_HEIGHT ,  }) {
    return /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
        className: "gap-2 w-full",
        children: [
            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("label", {
                className: "font-bold text-slate-700 dark:text-slate-300 text-base px-3 py-1 bg-slate-100 dark:bg-slate-700 rounded-t-md border border-solid border-slate-300 dark:border-slate-300/20 flex items-center gap-2",
                htmlFor: fieldObject.fieldName,
                children: [
                    fieldObject.encrypted && /*#__PURE__*/ jsx_runtime_.jsx((LockOutlined_default()), {
                        fontSize: "small",
                        className: "opacity-50"
                    }),
                    /*#__PURE__*/ jsx_runtime_.jsx("span", {
                        children: fieldObject.fieldName
                    })
                ]
            }),
            /*#__PURE__*/ jsx_runtime_.jsx("div", {
                className: "px-4 py-1 bg-secondary text-white rounded-full text-sm font-bold -mt-2",
                children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
                    children: typeFinal
                })
            }),
            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                className: "ml-auto cursor-pointer gap-1 text-slate-400 hover:text-slate-800 -mt-2 items-center flex",
                onClick: (e)=>{
                    if (isExpanded) {
                        setHeight(COLLAPSED_HEIGHT);
                    } else {
                        setHeight(EXPANDED_HEIGHT);
                    }
                },
                children: [
                    /*#__PURE__*/ jsx_runtime_.jsx("span", {
                        className: "font-semibold text-sm",
                        children: isExpanded ? "Collapse" : "Expand"
                    }),
                    isExpanded ? /*#__PURE__*/ jsx_runtime_.jsx(external_lucide_react_.CircleMinus, {
                        size: 18,
                        className: "mt-[-1px]"
                    }) : /*#__PURE__*/ jsx_runtime_.jsx(external_lucide_react_.CirclePlus, {
                        size: 18,
                        className: "mt-[-1px]"
                    })
                ]
            })
        ]
    });
}

;// CONCATENATED MODULE: ./components/admin/databases/fields/text/JSONEditor.jsx
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 







/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * @typedef {"yaml" | "json" | "html" | "css" | "javascript" | "shell"} AceTextType
 */ const COLLAPSED_HEIGHT = 300;
const EXPANDED_HEIGHT = 600;
/**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} props - Server props
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType} props.fieldObject
 * @param {any} [props.dataTypeSchema]
 * @param {any | undefined} props.entry
 * @param {boolean} [props.entryPage]
 * @param {React.MutableRefObject<import("@/package-shared/types").JSONTextEditorsRefArray[]>} props.jsonTextEditors
 * @param {AceTextType} [props.type]
 */ function JSONEditor({ fieldObject , dataTypeSchema , entry , entryPage , jsonTextEditors , type ,  }) {
    /**
     * Get Contexts
     *
     * @abstract { React.useContext }
     */ /** @type {AceTextType} */ const typeFinal = type || "json";
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    try {
        /**
         * Javascript Variables
         *
         * @abstract Non hook variables and functions
         */ ////////////////////////////////////////
        ////////////////////////////////////////
        ////////////////////////////////////////
        /**
         * React Hooks
         *
         * @abstract { useState, useEffect, useRef, etc ... }
         */ const [refresh, setRefresh] = external_react_default().useState(0);
        const [height, setHeight] = external_react_default().useState(COLLAPSED_HEIGHT);
        const isExpanded = height !== COLLAPSED_HEIGHT;
        /** @type {React.MutableRefObject<HTMLDivElement | undefined>} */ const jsonEditorRef = external_react_default().useRef();
        /** @type {React.MutableRefObject<AceAjax.Editor>} */ // @ts-ignore
        const editorRef = external_react_default().useRef();
        external_react_default().useEffect(()=>{
            aceEditorSetup({
                editorRef,
                entry,
                fieldObject,
                jsonEditorRef,
                jsonTextEditors,
                setRefresh,
                typeFinal
            });
        }, [
            refresh
        ]);
        ////////////////////////////////////////
        ////////////////////////////////////////
        ////////////////////////////////////////
        /**
         * Function Return
         *
         * @abstract Main Function Return
         */ return /*#__PURE__*/ jsx_runtime_.jsx((external_react_default()).Fragment, {
            children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                className: "flex flex-col items-start gap-0 w-full rich-text-editor-wrapper",
                children: [
                    /*#__PURE__*/ jsx_runtime_.jsx(JSONEditorHeader, {
                        fieldObject,
                        isExpanded,
                        setHeight,
                        typeFinal,
                        COLLAPSED_HEIGHT,
                        EXPANDED_HEIGHT
                    }),
                    /*#__PURE__*/ jsx_runtime_.jsx(JSONContent, {
                        height: height,
                        jsonEditorRef: jsonEditorRef
                    })
                ]
            })
        });
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    } catch (/** @type {any} */ error) {
        external_react_default().useEffect(()=>{
            (0,fetchApi/* default */.Z)("/api/admin/clientError", {
                method: "post",
                body: {
                    component: "DatabaseShellContent/catch-error-return",
                    message: error.message
                }
            });
        }, []);
        return /*#__PURE__*/ jsx_runtime_.jsx((external_react_default()).Fragment, {
            children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
                children: "Editor Load Error"
            })
        });
    }
}
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 *
 * @param {Object} props
 * @param {number} props.height
 * @param {React.MutableRefObject<HTMLDivElement | undefined>} props.jsonEditorRef
 * @returns
 */ function JSONContent({ height , jsonEditorRef  }) {
    return /*#__PURE__*/ jsx_runtime_.jsx("div", {
        className: "w-full p-0 sm:p-4 flex-col relative dark:bg-slate-700 border border-solid border-slate-300 dark:border-slate-300/20 overflow-hidden",
        style: {
            borderRadius: "0 5px 5px 5px",
            marginTop: "-1px",
            height: `${height}px`
        },
        children: /*#__PURE__*/ jsx_runtime_.jsx("div", {
            // @ts-ignore
            ref: jsonEditorRef,
            className: `w-full text-[18px] h-full`
        })
    });
}

;// CONCATENATED MODULE: ./components/admin/databases/TableEntryField.jsx
// @ts-check
/** # MODULE TRACE 
======================================================================
 * Detected 2 files that call this module. The files are listed below:
======================================================================
 * `import` Statement Found in [TableEntryForm.jsx] => file:///d:\GitHub\datasquirel\components\admin\databases\TableEntryForm.jsx
 * `import` Statement Found in [UpdateEntryForm.jsx] => file:///d:\GitHub\datasquirel\components\admin\databases\UpdateEntryForm.jsx
==== MODULE TRACE END ==== */ /**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 





/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} props - Server props
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType} props.fieldObject
 * @param {Object} props.dataTypeSchema
 * @param {React.MutableRefObject<import("@/package-shared/types").RichTextEditorsRefArray[]>} props.richTextEditors
 * @param {React.MutableRefObject<import("@/package-shared/types").JSONTextEditorsRefArray[]>} props.jsonTextEditors
 * @param {any} [props.entry]
 * @param {React.MutableRefObject<import("@/package-shared/types").RichTextEditorsRefArray[]>} props.currentRichTextEditorForms
 * @param {any} props.confirmedDelegetedUser
 * @param {any} [props.query]
 * @param {boolean} [props.entryPage]
 * @param {string} [props.formButtonId]
 */ function TableEntryField({ fieldObject , dataTypeSchema , richTextEditors , jsonTextEditors , entry , currentRichTextEditorForms , confirmedDelegetedUser , query , entryPage , formButtonId ,  }) {
    /**
     * Get Contexts
     *
     * @abstract { React.useContext }
     */ ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Javascript Variables
     *
     * @abstract Non hook variables and functions
     */ const isDelegated = confirmedDelegetedUser?.delegated;
    const isTableEditable = confirmedDelegetedUser?.priviledges?.match(/Edit Tables/i);
    const isTableDeletable = confirmedDelegetedUser?.priviledges?.match(/Delete Tables/i);
    const isTableCreatable = confirmedDelegetedUser?.priviledges?.match(/Create Tables/i);
    const areEntriesEditable = confirmedDelegetedUser?.priviledges?.match(/Edit Entries/i);
    const areEntriesDeletable = confirmedDelegetedUser?.priviledges?.match(/Delete Entries/i);
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * React Hooks
     *
     * @abstract { useState, useEffect, useRef, etc ... }
     */ const elementRef = external_react_default().useRef();
    const formElement = generateFormElementsForEntry({
        fieldObject,
        dataTypeSchema,
        elementRef,
        entry
    });
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Function Return
     *
     * @abstract Main Function Return
     */ if (fieldObject.dataType?.match(/text$/i) && fieldObject.richText && !fieldObject.plainText && !fieldObject.fieldName?.match(/^pass|^key$/i) && !fieldObject.encrypted || fieldObject.encrypted && fieldObject.richText) return /*#__PURE__*/ jsx_runtime_.jsx((external_react_default()).Fragment, {
        children: /*#__PURE__*/ jsx_runtime_.jsx(TableRichTextEntryField, {
            fieldObject: fieldObject,
            dataTypeSchema: dataTypeSchema,
            richTextEditors: richTextEditors,
            currentRichTextEditorForms: currentRichTextEditorForms,
            entry: entry,
            entryPage: entryPage,
            formButtonId: formButtonId
        })
    });
    const isAceEditor = fieldObject.json || fieldObject.yaml || fieldObject.html || fieldObject.css || fieldObject.javascript || fieldObject.shell;
    /**
     * JSON Return
     *
     * @abstract Return if Datatype is JSON
     */ if (fieldObject.dataType?.match(/text$/i) && isAceEditor && !fieldObject.plainText && !fieldObject.fieldName?.match(/^pass|^key$/i) && !fieldObject.encrypted || fieldObject.encrypted && isAceEditor) {
        return /*#__PURE__*/ jsx_runtime_.jsx(JSONEditor, {
            fieldObject: fieldObject,
            dataTypeSchema: dataTypeSchema,
            entry: entry,
            entryPage: entryPage,
            jsonTextEditors: jsonTextEditors,
            type: (()=>{
                if (fieldObject.json) return "json";
                if (fieldObject.yaml) return "yaml";
                if (fieldObject.html) return "html";
                if (fieldObject.css) return "css";
                if (fieldObject.javascript) return "javascript";
                if (fieldObject.shell) return "shell";
                return "json";
            })()
        });
    }
    ////////////////////////////////////////
    return /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
        className: "flex flex-col items-start gap-0 w-full" + (fieldObject.defaultField ? " opacity-50" : ""),
        children: [
            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("label", {
                className: "font-bold text-slate-700 dark:text-slate-300 text-base px-3 py-1 bg-slate-100 dark:bg-slate-700 rounded-t-md border border-solid border-slate-300 dark:border-slate-300/20 flex items-center gap-2",
                htmlFor: fieldObject.fieldName,
                children: [
                    fieldObject.encrypted && /*#__PURE__*/ jsx_runtime_.jsx((external_react_default()).Fragment, {
                        children: /*#__PURE__*/ jsx_runtime_.jsx((LockOutlined_default()), {
                            fontSize: "small",
                            className: "opacity-50"
                        })
                    }),
                    /*#__PURE__*/ jsx_runtime_.jsx("span", {
                        children: fieldObject.fieldName
                    }),
                    fieldObject.defaultField && /*#__PURE__*/ jsx_runtime_.jsx("span", {
                        className: "bg-white dark:bg-slate-900 text-primary dark:text-slate-300 font-semibold text-xs px-2 py-0.5 rounded-xs",
                        children: "Default Field"
                    })
                ]
            }),
            formElement
        ]
    });
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */ 


/***/ })

};
;