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

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


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

// 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_);
// EXTERNAL MODULE: external "gsap"
var external_gsap_ = __webpack_require__(4287);
var external_gsap_default = /*#__PURE__*/__webpack_require__.n(external_gsap_);
;// CONCATENATED MODULE: ./functions/frontend/addNewTempField.js
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * ==============================================================================
 * Auth user on client side
 * ==============================================================================
 * @param {object} params
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType[]} params.tableFields
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType[]>>} params.setTableFields
 * @param {React.Dispatch<React.SetStateAction<number>>} [params.setRefresh]
 * @param {React.Dispatch<React.SetStateAction<number>>} [params.setPageRefresh]
 * @param {React.MutableRefObject<React.Dispatch<React.SetStateAction<number>> | undefined>} params.refreshFieldsListRef
 *
 * @requires search-field name attribute
 */ function addNewTempField({ tableFields , setTableFields , setRefresh , setPageRefresh , refreshFieldsListRef ,  }) {
    /**
     * Check for user in local storage
     *
     * @description Preventdefault, declare variables
     */ let newArray = tableFields;
    let spliceIndex = newArray.findIndex((field)=>field.fieldName === "date_created");
    newArray.splice(spliceIndex, 0, {
        newTempField: true
    });
    setTableFields(newArray);
    // setRefresh && setRefresh((prev) => prev + 1);
    // setPageRefresh && setPageRefresh((prev) => prev + 1);
    if (refreshFieldsListRef?.current) refreshFieldsListRef.current((prev)=>prev + 1);
} ////////////////////////////////////////
 ////////////////////////////////////////
 ////////////////////////////////////////

// EXTERNAL MODULE: ./components/general/ExpandBlock.jsx
var ExpandBlock = __webpack_require__(6169);
// EXTERNAL MODULE: ./components/general/LoadingBlock.jsx
var LoadingBlock = __webpack_require__(5264);
// EXTERNAL MODULE: ./functions/frontend/defaultFieldsRegexp.js
var defaultFieldsRegexp = __webpack_require__(3907);
// EXTERNAL MODULE: external "lodash"
var external_lodash_ = __webpack_require__(6517);
var external_lodash_default = /*#__PURE__*/__webpack_require__.n(external_lodash_);
;// CONCATENATED MODULE: ./functions/frontend/reorderField.js
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} params
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType[]} params.tableFields
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType[]>>} params.setTableFields
 * @param {React.MutableRefObject<React.Dispatch<React.SetStateAction<number>> | undefined>} params.refreshFieldsListRef
 * @param {"up" | "down"} params.order
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType} params.field
 * @param {any} params.e
 */ function reorderField({ tableFields , setTableFields , refreshFieldsListRef , order , field , e ,  }) {
    /**
     * Javascript Variables
     *
     * @abstract Non hook variables and functions
     */ let newFields = external_lodash_default().cloneDeep(tableFields);
    let targetFieldIndex = newFields.findIndex((_field)=>_field.fieldName === field.fieldName);
    if (targetFieldIndex < 0) {
        return;
    }
    let targetField = newFields[targetFieldIndex];
    if (order === "up" && targetFieldIndex && targetFieldIndex <= 1) {
        console.log("Min Reached =>", targetFieldIndex);
        return;
    } else if (order === "down" && targetFieldIndex && targetFieldIndex >= newFields.length - 7) {
        console.log("Max Reached =>", targetFieldIndex);
        return;
    }
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    try {
        /** @type {HTMLDivElement} */ const targetFieldElement = e.target.closest(".table-field-wrapper");
        const previousElement = targetFieldElement.previousElementSibling;
        const nextElement = targetFieldElement.nextElementSibling;
        // @ts-ignore
        const Flip = window.DSQL.Flip;
        const state = Flip.getState(targetFieldElement);
        let nextState;
        if (order === "up") {
            nextState = Flip.getState(previousElement);
            targetFieldElement.parentNode?.insertBefore(targetFieldElement, previousElement);
        } else if (nextElement?.nextElementSibling) {
            nextState = Flip.getState(nextElement);
            targetFieldElement.parentNode?.insertBefore(targetFieldElement, nextElement.nextElementSibling);
        }
        Flip.from(state, {
            duration: 0.3,
            ease: "power1.inOut"
        });
        Flip.from(nextState, {
            duration: 0.3,
            ease: "power1.inOut"
        });
    } catch (/** @type {any} */ error) {
        console.log("Error =>", error.message);
    }
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    if (!targetFieldIndex) {
        console.log("No target Field Index =>", targetFieldIndex);
        return;
    }
    newFields.splice(targetFieldIndex, 1);
    if (order === "up") {
        newFields.splice(targetFieldIndex - 1, 0, targetField);
    } else {
        newFields.splice(targetFieldIndex + 1, 0, targetField);
    }
    setTimeout(()=>{
        setTableFields([
            ...newFields
        ]);
        if (refreshFieldsListRef.current) refreshFieldsListRef.current((prev)=>prev + 1);
    }, 500);
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */ 

// EXTERNAL MODULE: ./components/admin/databases/ExistingFieldEdit.jsx
var ExistingFieldEdit = __webpack_require__(9967);
// EXTERNAL MODULE: ./components/admin/databases/fields/fields-inputs/ForeignKey.jsx
var ForeignKey = __webpack_require__(3699);
// EXTERNAL MODULE: ./functions/frontend/fetchApi.js
var fetchApi = __webpack_require__(6729);
;// CONCATENATED MODULE: ./components/admin/databases/ClonedSingleTableFieldCard.jsx
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 






/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ let timeout;
/** ****************************************************************************** */ /**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} props - Server props
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType} props.field
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType | null>>} [props.setTargetField]
 * @param {Object} [props.fieldIndex]
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType[]} props.tableFields
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType[]>>} props.setTableFields
 * @param {any} [props.refreshFieldsListRef]
 * @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
 * @param {import("@/package-shared/types").DSQL_TableSchemaType} props.currentTable
 * @param {import("@/package-shared/types").UserType} props.user
 * @param {boolean} props.isDelegated
 * @param {React.Dispatch<React.SetStateAction<boolean>>} props.setLoading
 */ function ClonedSingleTableFieldCard({ field , setTargetField , fieldIndex , tableFields , setTableFields , refreshFieldsListRef , database , currentTable , user , isDelegated , setLoading ,  }) {
    /**
     * Get Contexts
     *
     * @abstract { React.useContext }
     */ ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Javascript Variables
     *
     * @abstract Non hook variables and functions
     */ ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * React Hooks
     *
     * @abstract { useState, useEffect, useRef, etc ... }
     */ const [fieldData, setFieldData] = external_react_default().useState(field);
    const [activeEdit, setActiveEdit] = external_react_default().useState(false);
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Function Return
     *
     * @abstract Main Function Return
     */ return /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
        className: "flex-col w-full table-field-wrapper" + (activeEdit ? " shadow-2xl shadow-slate-700/40 relative z-50" : ""),
        children: [
            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                className: "card no-hover items-center w-full py-4" + (activeEdit ? " rounded-t" : " rounded") + (fieldData.fieldName?.match(defaultFieldsRegexp/* default */.Z) ? " text-slate-400 pointer-events-none border-slate-200 border" : " light-gray"),
                children: [
                    /*#__PURE__*/ jsx_runtime_.jsx("span", {
                        className: "font-bold" + (fieldData.fieldName?.match(defaultFieldsRegexp/* default */.Z) ? " dark:text-slate-500" : " dark:text-white"),
                        children: fieldData.fieldName
                    }),
                    /*#__PURE__*/ jsx_runtime_.jsx("span", {
                        className: "text-xs py-1 px-2 bg-slate-100 dark:bg-slate-700 dark:text-slate-200 rounded ",
                        children: fieldData.dataType
                    }),
                    fieldData?.foreignKey && /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                        className: "text-xs bg-primary text-white px-2 py-0.5 rounded-full",
                        children: [
                            /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                children: "Foreign Key: "
                            }),
                            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("span", {
                                children: [
                                    fieldData.foreignKey.destinationTableName,
                                    " (",
                                    " ",
                                    /*#__PURE__*/ jsx_runtime_.jsx("b", {
                                        children: fieldData.foreignKey.destinationTableColumnName
                                    }),
                                    " ",
                                    ")"
                                ]
                            })
                        ]
                    }),
                    fieldData.fieldName?.match(defaultFieldsRegexp/* default */.Z) && /*#__PURE__*/ jsx_runtime_.jsx("span", {
                        className: "text-slate-300 text-sm font-semibold ml-0 md:ml-auto",
                        children: "Default Field"
                    }),
                    !isDelegated && !fieldData.fieldName?.match(defaultFieldsRegexp/* default */.Z) && fieldData.dataType?.match(/INT/) && !fieldData.foreignKey && !database?.active_clone?.toString()?.match(/1/) ? /*#__PURE__*/ jsx_runtime_.jsx("div", {
                        className: "ml-0 md:ml-auto flex-wrap",
                        children: /*#__PURE__*/ jsx_runtime_.jsx("div", {
                            className: "button outlined py-1 text-xs gray",
                            onClick: (e)=>{
                                if (activeEdit) {
                                    setActiveEdit(false);
                                } else {
                                    setActiveEdit(true);
                                }
                            },
                            style: {
                                color: "var(--slate-500)"
                            },
                            children: "Add Foreign Key"
                        })
                    }) : !isDelegated && !fieldData.fieldName?.match(defaultFieldsRegexp/* default */.Z) && fieldData.dataType?.match(/INT/) && !database?.active_clone?.toString()?.match(/1/) ? /*#__PURE__*/ jsx_runtime_.jsx("div", {
                        className: "ml-0 md:ml-auto flex-wrap",
                        children: /*#__PURE__*/ jsx_runtime_.jsx("div", {
                            className: "button py-1 text-xs light-gray",
                            onClick: (e)=>{
                                if (window.confirm("Delete this foreign Key?")) {
                                    delete field.foreignKey;
                                    setLoading(true);
                                    (0,fetchApi/* default */.Z)("/api/updateClonedTableForeignKeys", {
                                        method: "post",
                                        body: {
                                            tableData: currentTable,
                                            database: database.db_full_name,
                                            dbSlug: database.db_slug,
                                            delegated: window.location?.search?.match(/delegated=true/i) ? true : false
                                        }
                                    }, true).then((res)=>{
                                        if (res.success) {
                                            window.location.reload();
                                        } else {
                                            window.alert("Update Failed, Please Try again.");
                                        }
                                    });
                                }
                            },
                            style: {
                                color: "var(--slate-500)"
                            },
                            children: "Delete Foreign Key"
                        })
                    }) : /*#__PURE__*/ jsx_runtime_.jsx((external_react_default()).Fragment, {})
                ]
            }),
            activeEdit && !isDelegated && /*#__PURE__*/ jsx_runtime_.jsx("div", {
                className: "card col w-full -mt-5 pt-0 no-hover",
                children: /*#__PURE__*/ jsx_runtime_.jsx(ForeignKey/* default */.Z, {
                    targetField: field,
                    setFieldData: setFieldData,
                    tableFields: tableFields,
                    setTableFields: setTableFields,
                    database: database,
                    currentTable: currentTable,
                    user: user,
                    setActiveEdit: setActiveEdit,
                    activeClonedTable: true
                })
            })
        ]
    });
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */ 

;// CONCATENATED MODULE: ./functions/frontend/addNewField.js
// @ts-check
/** # MODULE TRACE 
======================================================================
 * Detected 2 files that call this module. The files are listed below:
======================================================================
 * `import` Statement Found in [ExistingFieldEdit.jsx] => file:///d:\GitHub\datasquirel\components\admin\databases\ExistingFieldEdit.jsx
 * `import` Statement Found in [NewFieldTemp.jsx] => file:///d:\GitHub\datasquirel\components\admin\databases\NewFieldTemp.jsx
==== MODULE TRACE END ==== */ /**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * ==============================================================================
 * Auth user on client side
 * ==============================================================================
 * @param {object} params
 * @param {number} params.fieldIndex
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType[]>>} params.setTableFields
 * @param {React.MutableRefObject<React.Dispatch<React.SetStateAction<number>>>} params.refreshFieldsListRef
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType} params.payload
 *
 * @requires search-field name attribute
 */ function addNewField({ fieldIndex , setTableFields , refreshFieldsListRef , payload ,  }) {
    /**
     * Check for user in local storage
     *
     * @description Preventdefault, declare variables
     */ setTableFields((prev)=>{
        let newArray = prev;
        newArray.splice(fieldIndex, 1, payload);
        return newArray;
    });
    // setRefresh && setRefresh((prev) => prev + 1);
    // setPageRefresh && setPageRefresh((prev) => prev + 1);
    if (refreshFieldsListRef?.current) refreshFieldsListRef.current((prev)=>prev + 1);
} ////////////////////////////////////////
 ////////////////////////////////////////
 ////////////////////////////////////////

// EXTERNAL MODULE: ./components/admin/databases/MoreOptionsModal.jsx + 5 modules
var MoreOptionsModal = __webpack_require__(4209);
// EXTERNAL MODULE: ./components/admin/databases/fields/text/JSONTextOption.jsx
var JSONTextOption = __webpack_require__(4838);
;// CONCATENATED MODULE: ./components/admin/databases/NewFieldFormContent.jsx
// @ts-check
/** # MODULE TRACE 
======================================================================
 * Detected 1 files that call this module. The files are listed below:
======================================================================
 * `import` Statement Found in [TableFields.jsx] => file:///d:\GitHub\datasquirel\components\admin\databases\TableFields.jsx
==== MODULE TRACE END ==== */ /**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 



/** //////////////////////////////////////////////////////////////////////////////// */ /** //////////////////////////////////////////////////////////////////////////////// */ /** //////////////////////////////////////////////////////////////////////////////// */ /** //////////////////////////////////////////////////////////////////////////////// */ /** //////////////////////////////////////////////////////////////////////////////// */ /** //////////////////////////////////////////////////////////////////////////////// */ let NewFieldFormContent_timeout;
/** //////////////////////////////////////////////////////////////////////////////// */ /**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} props - Server props
 * @param {number} props.fieldIndex
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType[]} [props.tableFields]
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType[]>>} props.setTableFields
 * @param {any} props.refreshFieldsListRef
 * @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
 * @param {import("@/package-shared/types").DSQL_TableSchemaType} [props.currentTable]
 * @param {import("@/package-shared/types").UserType} props.user
 * @param {boolean} props.isNewField
 * @param {string} props.literalValue
 * @param {React.Dispatch<React.SetStateAction<string>>} props.setLiteralValue
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType} props.tempFieldData
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType>>} props.setTempFieldData
 * @param {string} props.dataTypeValue
 * @param {React.Dispatch<React.SetStateAction<string>>} props.setDataTypeValue
 * @param {string} props.dataType
 * @param {React.Dispatch<React.SetStateAction<string>>} props.setDataType
 * @param {string} props.dataTypeDesc
 * @param {React.Dispatch<React.SetStateAction<string>>} props.setDataTypeDesc
 */ function NewFieldFormContent({ fieldIndex , setTableFields , database , user , isNewField , setLiteralValue , tempFieldData , setTempFieldData , dataTypeValue , setDataTypeValue , dataType , setDataType , dataTypeDesc , setDataTypeDesc ,  }) {
    /**
     * Get Contexts
     *
     * @abstract { React.useContext }
     */ /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /**
     * Javascript Variables
     *
     * @abstract Non hook variables and functions
     */ const varcharDesc = "Varchar is simply letters and numbers within the range 0 - 255";
    const dataTypes = __webpack_require__(9594);
    /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /**
     * React Hooks
     *
     * @abstract { useState, useEffect, useRef, etc ... }
     */ /** @type {React.LegacyRef<HTMLDivElement | undefined>} */ const newFieldRef = external_react_default().useRef();
    external_react_default().useEffect(()=>{
        if (!newFieldRef.current) return;
        newFieldRef.current.scrollIntoView({
            block: "center",
            behavior: "smooth"
        });
        newFieldRef.current.querySelector("input")?.focus();
    }, []);
    const isLiteral = Boolean(dataType.match(/uuid/i));
    /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /**
     * Function Return
     *
     * @abstract Main Function Return
     */ return /*#__PURE__*/ (0,jsx_runtime_.jsxs)((external_react_default()).Fragment, {
        children: [
            isNewField && /*#__PURE__*/ jsx_runtime_.jsx("span", {
                className: "absolute -top-4 text-sm bg-fuchsia-600 dark:bg-white text-white dark:text-fuchsia-800 px-3 py-1 rounded-full",
                children: "New Field"
            }),
            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                className: "gap-4 flex-wrap xl:flex-nowrap flex-col xl:flex-row items-stretch w-full xl:w-auto",
                children: [
                    /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                        className: "flex flex-col items-start gap-0.5",
                        children: [
                            /*#__PURE__*/ jsx_runtime_.jsx("label", {
                                htmlFor: "new_field_name",
                                children: "Field Name"
                            }),
                            /*#__PURE__*/ jsx_runtime_.jsx("input", {
                                type: "text",
                                name: "new_field_name",
                                id: "new_field_name",
                                placeholder: "Eg. post_title",
                                onInput: async (e)=>{
                                    /** @type {HTMLInputElement} */ // @ts-ignore
                                    const inputEl = e.target;
                                    const parsedValue = inputEl.value.toLowerCase().replace(/ /g, "_");
                                    inputEl.value = parsedValue;
                                },
                                required: true
                            })
                        ]
                    }),
                    /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                        className: "flex flex-col items-start gap-4 xl:gap-0.5",
                        children: [
                            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                                className: "items-start flex-wrap xl:flex-nowrap",
                                children: [
                                    /*#__PURE__*/ jsx_runtime_.jsx("label", {
                                        htmlFor: "new_field_data_type",
                                        children: "Data Type"
                                    }),
                                    /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                                        className: "dropdown-wrapper reversed text-sm w-full items-start gap-2",
                                        children: [
                                            /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                                className: "px-2 bg-slate-200 dark:bg-slate-700 rounded-full hover:bg-slate-100 dark:hover:bg-slate-600 hidden xl:flex",
                                                children: "Info"
                                            }),
                                            /*#__PURE__*/ jsx_runtime_.jsx("div", {
                                                className: "dropdown mt-0 xl:-mt-2",
                                                children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                                    children: dataTypeDesc
                                                })
                                            })
                                        ]
                                    })
                                ]
                            }),
                            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                                className: "w-full xl:w-auto",
                                children: [
                                    /*#__PURE__*/ jsx_runtime_.jsx("select", {
                                        name: "new_field_data_type",
                                        id: "new_field_data_type",
                                        className: "w-full xl:w-auto",
                                        onChange: (e)=>{
                                            /** @type {HTMLSelectElement} */ // @ts-ignore
                                            const selectEl = e.target;
                                            setDataType(selectEl.value);
                                            selectEl.childNodes.forEach((/** @type {any} */ option)=>{
                                                if (option.value === selectEl.value) {
                                                    setDataTypeDesc(option.dataset.desc);
                                                }
                                                if (option.value === selectEl.value && option.dataset.literal) {
                                                    setLiteralValue(option.dataset.literal);
                                                }
                                            });
                                        },
                                        children: dataTypes.map((type, index)=>{
                                            if (type.name.match(/VARCHAR/)) {
                                                return /*#__PURE__*/ jsx_runtime_.jsx("option", {
                                                    value: type.name,
                                                    "data-desc": type.description,
                                                    children: type.title + "(" + (dataTypeValue ? dataTypeValue : 200) + ")"
                                                }, index + 1);
                                            } else {
                                                return /*#__PURE__*/ jsx_runtime_.jsx("option", {
                                                    value: type.name,
                                                    "data-desc": type.description,
                                                    "data-literal": type.valueLiteral || undefined,
                                                    children: type.title
                                                }, index + 1);
                                            }
                                        })
                                    }),
                                    dataType.match(/VARCHAR/) && /*#__PURE__*/ jsx_runtime_.jsx("input", {
                                        type: "number",
                                        defaultValue: dataTypeValue,
                                        className: "px-2",
                                        style: {
                                            maxWidth: "60px"
                                        },
                                        max: 255,
                                        min: 5,
                                        onChange: (e)=>{
                                            setDataTypeValue(e.target.value);
                                        }
                                    })
                                ]
                            })
                        ]
                    }),
                    dataType?.match(/text/i) && /*#__PURE__*/ jsx_runtime_.jsx((external_react_default()).Fragment, {
                        children: /*#__PURE__*/ jsx_runtime_.jsx(JSONTextOption/* default */.Z, {
                            targetField: tempFieldData
                        })
                    }),
                    !isLiteral && /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                        className: "flex flex-col items-start gap-0.5",
                        style: {
                            minWidth: "70px"
                        },
                        children: [
                            /*#__PURE__*/ jsx_runtime_.jsx("label", {
                                htmlFor: "new_field_required",
                                children: "Required?"
                            }),
                            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("select", {
                                name: "new_field_required",
                                id: "new_field_required",
                                className: "px-2",
                                children: [
                                    /*#__PURE__*/ jsx_runtime_.jsx("option", {
                                        value: "No",
                                        children: "No"
                                    }),
                                    /*#__PURE__*/ jsx_runtime_.jsx("option", {
                                        value: "Yes",
                                        children: "Yes"
                                    })
                                ]
                            })
                        ]
                    }),
                    !isLiteral && /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                        className: "flex flex-col items-start gap-0.5",
                        children: [
                            /*#__PURE__*/ jsx_runtime_.jsx("label", {
                                htmlFor: "new_field_default_value",
                                children: "Default Value (optional)"
                            }),
                            /*#__PURE__*/ jsx_runtime_.jsx("input", {
                                type: "text",
                                name: "new_field_default_value",
                                id: "new_field_default_value",
                                placeholder: "Default Value"
                            })
                        ]
                    }),
                    !isLiteral && /*#__PURE__*/ jsx_runtime_.jsx(MoreOptionsModal/* default */.Z, {
                        database,
                        setFieldData: setTempFieldData,
                        targetField: tempFieldData,
                        user,
                        fieldIndex
                    })
                ]
            }),
            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                className: "secondary mt-auto flex-wrap xl:flex-nowrap w-full xl:w-auto",
                children: [
                    /*#__PURE__*/ jsx_runtime_.jsx("button", {
                        type: "submit",
                        className: "secondary mt-auto py-3 w-full sm:w-auto justify-center grow",
                        children: "Add Field"
                    }),
                    /*#__PURE__*/ jsx_runtime_.jsx("div", {
                        className: "button outlined-gray mt-auto py-2.5 w-full sm:w-auto justify-center grow",
                        onClick: (e)=>{
                            setTableFields((prev)=>prev.filter((field, index)=>index != fieldIndex));
                        },
                        children: "Cancel"
                    })
                ]
            })
        ]
    });
/** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ } /** //////////////////////////////////////////////////////////////////////////////// */  /** //////////////////////////////////////////////////////////////////////////////// */  /** //////////////////////////////////////////////////////////////////////////////// */  /** //////////////////////////////////////////////////////////////////////////////// */  /** //////////////////////////////////////////////////////////////////////////////// */  /** //////////////////////////////////////////////////////////////////////////////// */ 

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



/** //////////////////////////////////////////////////////////////////////////////// */ /** //////////////////////////////////////////////////////////////////////////////// */ /** //////////////////////////////////////////////////////////////////////////////// */ /** //////////////////////////////////////////////////////////////////////////////// */ /** //////////////////////////////////////////////////////////////////////////////// */ /** //////////////////////////////////////////////////////////////////////////////// */ let NewFieldTemp_timeout;
/** //////////////////////////////////////////////////////////////////////////////// */ /**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} props - Server props
 * @param {number} props.fieldIndex
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType[]} [props.tableFields]
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType[]>>} props.setTableFields
 * @param {any} props.refreshFieldsListRef
 * @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
 * @param {import("@/package-shared/types").DSQL_TableSchemaType} [props.currentTable]
 * @param {import("@/package-shared/types").UserType} props.user
 */ function NewFieldTemp({ fieldIndex , tableFields , setTableFields , refreshFieldsListRef , database , currentTable , user ,  }) {
    /**
     * Get Contexts
     *
     * @abstract { React.useContext }
     */ /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /**
     * Javascript Variables
     *
     * @abstract Non hook variables and functions
     */ const varcharDesc = "Varchar is simply letters and numbers within the range 0 - 255";
    const dataTypes = __webpack_require__(9594);
    /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /**
     * React Hooks
     *
     * @abstract { useState, useEffect, useRef, etc ... }
     */ const [dataType, setDataType] = external_react_default().useState("VARCHAR");
    const [dataTypeValue, setDataTypeValue] = external_react_default().useState("200");
    // const dataTypeDescState = React.useState();
    const [dataTypeDesc, setDataTypeDesc] = external_react_default().useState(varcharDesc);
    /** @type {any} */ const tempFieldDataState = external_react_default().useState({});
    /** @type { [tempFieldData: import("@/package-shared/types").DSQL_FieldSchemaType, setTempFieldData: React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType>>] } */ const [tempFieldData, setTempFieldData] = tempFieldDataState;
    /** @type {React.LegacyRef<HTMLDivElement | undefined>} */ const newFieldRef = external_react_default().useRef();
    const [literalValue, setLiteralValue] = external_react_default().useState("");
    external_react_default().useEffect(()=>{
        if (!newFieldRef.current) return;
        newFieldRef.current.scrollIntoView({
            block: "center",
            behavior: "smooth"
        });
        newFieldRef.current.querySelector("input")?.focus();
    }, []);
    const isLiteral = Boolean(dataType.match(/uuid/i));
    /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /**
     * Function Return
     *
     * @abstract Main Function Return
     */ return /*#__PURE__*/ jsx_runtime_.jsx("div", {
        className: "w-full mt-1 flex-wrap relative z-0 hover:z-20",
        // @ts-ignore
        ref: newFieldRef,
        children: /*#__PURE__*/ jsx_runtime_.jsx("form", {
            className: "flex flex-row items-start gap-4 w-full justify-between border border-solid p-4 pt-6 border-slate-400 rounded focus:shadow-lg shadow-slate-400/40 dark:shadow-black/30 relative flex-wrap xl:flex-nowrap shadow-xl",
            onSubmit: (e)=>{
                e.preventDefault();
                /** @type {import("@/package-shared/types").DSQL_ForeignKeyType | undefined} */ const targetForeignKey = tempFieldData.foreignKey;
                if (targetForeignKey && !targetForeignKey.destinationTableName) {
                    delete tempFieldData.foreignKey;
                }
                /** @type {HTMLFormElement} */ // @ts-ignore
                const formEl = e.target;
                let new_field_name = formEl["new_field_name"].value;
                let new_field_data_type = formEl["new_field_data_type"].value;
                let new_field_required = formEl["new_field_required"]?.value;
                let new_field_default_value = formEl["new_field_default_value"]?.value;
                let new_field_encryption = formEl["encryption_field"]?.value;
                let rich_text_option = formEl["rich_text_option"]?.value;
                const foreignKeyElement = formEl["foreign_key_field"];
                const foreignKeyDestinationTableElement = formEl["foreign_key_destination_table_name"];
                const foreignKeyDestinationTableColumnElement = formEl["foreign_key_destination_table_column_name"];
                let foreign_key_field = foreignKeyElement?.value;
                let newFieldObject = {
                    ...tempFieldData,
                    fieldName: new_field_name,
                    dataType: tempFieldData?.dataType && tempFieldData?.foreignKey ? tempFieldData.dataType : new_field_data_type?.match(/VARCHAR/) ? `${new_field_data_type}(${dataTypeValue})` : new_field_data_type
                };
                if (new_field_required?.match(/yes/i)) {
                    newFieldObject.notNullValue = true;
                } else if (!new_field_default_value?.match(/./)) {
                    newFieldObject.nullValue = true;
                }
                if (new_field_default_value?.match(/./)) {
                    newFieldObject.defaultValue = new_field_default_value;
                }
                if (new_field_encryption?.match(/yes/i)) {
                    newFieldObject.encrypted = true;
                }
                if (foreignKeyDestinationTableColumnElement?.value?.match(/./i) && !foreignKeyDestinationTableColumnElement?.value?.match(/^--$/i)) {
                    newFieldObject.dataType = foreignKeyDestinationTableColumnElement.dataset.dataType;
                    newFieldObject.foreignKey = {
                        foreignKeyName: foreignKeyDestinationTableColumnElement.dataset.foreignKeyName,
                        destinationTableName: foreignKeyDestinationTableElement.dataset.destinationTableName,
                        destinationTableColumnName: foreignKeyDestinationTableColumnElement.dataset.destinationTableColumnName,
                        cascadeDelete: true
                    };
                }
                if (rich_text_option?.match(/yes/i)) {
                    newFieldObject.richText = true;
                }
                if (isLiteral) {
                    newFieldObject.defaultValueLiteral = literalValue;
                    newFieldObject.nullValue = false;
                } else {
                    delete newFieldObject.defaultValueLiteral;
                }
                console.log("newFieldObject", newFieldObject);
                addNewField({
                    fieldIndex,
                    setTableFields,
                    refreshFieldsListRef,
                    payload: newFieldObject
                });
            },
            children: /*#__PURE__*/ jsx_runtime_.jsx(NewFieldFormContent, {
                database,
                fieldIndex,
                isNewField: true,
                literalValue,
                refreshFieldsListRef,
                setLiteralValue,
                setTableFields,
                user,
                currentTable,
                tableFields,
                tempFieldData,
                setTempFieldData,
                dataTypeValue,
                setDataTypeValue,
                dataType,
                setDataType,
                dataTypeDesc,
                setDataTypeDesc
            })
        })
    });
/** //////////////////////////////////////// */ /** //////////////////////////////////////// */ /** //////////////////////////////////////// */ } /** //////////////////////////////////////////////////////////////////////////////// */  /** //////////////////////////////////////////////////////////////////////////////// */  /** //////////////////////////////////////////////////////////////////////////////// */  /** //////////////////////////////////////////////////////////////////////////////// */  /** //////////////////////////////////////////////////////////////////////////////// */  /** //////////////////////////////////////////////////////////////////////////////// */ 

// EXTERNAL MODULE: ./components/general/ui/ButtonGroup.jsx
var ButtonGroup = __webpack_require__(5449);
// EXTERNAL MODULE: external "lucide-react"
var external_lucide_react_ = __webpack_require__(2423);
;// CONCATENATED MODULE: ./components/admin/databases/SingleTableFieldCard.jsx
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 






/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ let SingleTableFieldCard_timeout;
/** ****************************************************************************** */ /**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} props
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType} props.field
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType | null>>} props.setTargetField
 * @param {number} props.fieldIndex
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType[]} props.tableFields
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType[]>>} props.setTableFields
 * @param {React.MutableRefObject<React.Dispatch<React.SetStateAction<number>> | undefined>} props.refreshFieldsListRef
 * @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
 * @param {import("@/package-shared/types").DSQL_TableSchemaType} [props.currentTable]
 * @param {any} props.confirmedDelegetedUser
 * @param {import("@/package-shared/types").UserType} props.user
 */ function SingleTableFieldCard({ field , setTargetField , fieldIndex , tableFields , setTableFields , refreshFieldsListRef , database , currentTable , confirmedDelegetedUser , user ,  }) {
    /**
     * 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 { active_clone , active_clone_parent_db , remote_connected  } = database;
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * React Hooks
     *
     * @abstract { useState, useEffect, useRef, etc ... }
     */ const [fieldData, setFieldData] = external_react_default().useState(field);
    const [activeEdit, setActiveEdit] = external_react_default().useState(false);
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Function Return
     *
     * @abstract Main Function Return
     */ return /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
        className: "flex-col w-full table-field-wrapper" + (activeEdit ? " shadow-2xl shadow-slate-300/40 dark:shadow-black/30 relative z-50" : ""),
        children: [
            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                className: "card no-hover items-center w-full py-4" + (activeEdit ? " rounded-t" : " rounded") + (fieldData.fieldName?.match(defaultFieldsRegexp/* default */.Z) ? " text-slate-400 pointer-events-none border-slate-200 border" : " light-gray"),
                children: [
                    /*#__PURE__*/ jsx_runtime_.jsx("span", {
                        className: "font-bold" + (fieldData.fieldName?.match(defaultFieldsRegexp/* default */.Z) ? " dark:text-slate-500" : " dark:text-white"),
                        children: fieldData.fieldName
                    }),
                    /*#__PURE__*/ jsx_runtime_.jsx("span", {
                        className: "text-xs py-1 px-2 bg-slate-100 dark:bg-slate-700 dark:text-slate-200 rounded ",
                        children: fieldData.dataType
                    }),
                    fieldData?.foreignKey && /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                        className: "text-xs bg-primary text-white px-2 py-0.5 rounded-full",
                        children: [
                            /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                children: "Foreign Key: "
                            }),
                            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("span", {
                                children: [
                                    fieldData.foreignKey.destinationTableName,
                                    " (",
                                    " ",
                                    /*#__PURE__*/ jsx_runtime_.jsx("b", {
                                        children: fieldData.foreignKey.destinationTableColumnName
                                    }),
                                    " ",
                                    ")"
                                ]
                            })
                        ]
                    }),
                    fieldData.fieldName?.match(defaultFieldsRegexp/* default */.Z) && /*#__PURE__*/ jsx_runtime_.jsx("span", {
                        className: "text-slate-300 text-sm font-semibold ml-0 md:ml-auto",
                        children: "Default Field"
                    }),
                    !fieldData.fieldName?.match(defaultFieldsRegexp/* default */.Z) && !active_clone_parent_db && !remote_connected && /*#__PURE__*/ jsx_runtime_.jsx("div", {
                        className: "ml-0 md:ml-auto flex-wrap",
                        children: (!isDelegated || isDelegated && isTableEditable) && /*#__PURE__*/ (0,jsx_runtime_.jsxs)((external_react_default()).Fragment, {
                            children: [
                                /*#__PURE__*/ (0,jsx_runtime_.jsxs)(ButtonGroup/* default */.Z, {
                                    children: [
                                        /*#__PURE__*/ jsx_runtime_.jsx("div", {
                                            className: "button outlined py-1 text-xs gray",
                                            onClick: (e)=>{
                                                if (activeEdit) {
                                                    setActiveEdit(false);
                                                } else {
                                                    setActiveEdit(true);
                                                }
                                            },
                                            style: {
                                                color: "var(--slate-500)"
                                            },
                                            children: "Edit"
                                        }),
                                        !active_clone_parent_db && !remote_connected && /*#__PURE__*/ jsx_runtime_.jsx("div", {
                                            className: "button outlined py-1 text-xs gray",
                                            onClick: (e)=>{
                                                if (window.confirm(`Delete "${field.fieldName}"?`)) {
                                                    setTableFields((prev)=>prev.filter((field, index)=>index != fieldIndex));
                                                }
                                            },
                                            style: {
                                                color: "var(--slate-500)"
                                            },
                                            children: "Delete"
                                        })
                                    ]
                                }),
                                /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                                    children: [
                                        /*#__PURE__*/ jsx_runtime_.jsx("div", {
                                            className: "button outlined gray p-2 w-8 h-8 rounded-full rotate-180",
                                            onClick: (e)=>{
                                                reorderField({
                                                    tableFields,
                                                    setTableFields,
                                                    refreshFieldsListRef,
                                                    order: "up",
                                                    field,
                                                    e
                                                });
                                            },
                                            children: /*#__PURE__*/ jsx_runtime_.jsx(external_lucide_react_.ChevronDown, {
                                                size: 20
                                            })
                                        }),
                                        /*#__PURE__*/ jsx_runtime_.jsx("div", {
                                            className: "button outlined gray p-2 w-8 h-8 rounded-full",
                                            onClick: (e)=>{
                                                reorderField({
                                                    tableFields,
                                                    setTableFields,
                                                    refreshFieldsListRef,
                                                    order: "down",
                                                    field,
                                                    e
                                                });
                                            },
                                            children: /*#__PURE__*/ jsx_runtime_.jsx(external_lucide_react_.ChevronDown, {
                                                size: 20
                                            })
                                        })
                                    ]
                                })
                            ]
                        })
                    })
                ]
            }),
            activeEdit && /*#__PURE__*/ jsx_runtime_.jsx("div", {
                className: "w-full",
                children: /*#__PURE__*/ jsx_runtime_.jsx(ExistingFieldEdit/* default */.Z, {
                    fieldIndex: fieldIndex,
                    tableFields: tableFields,
                    setTableFields: setTableFields,
                    refreshFieldsListRef: refreshFieldsListRef,
                    targetField: field,
                    setActiveEdit: setActiveEdit,
                    database: database,
                    currentTable: currentTable,
                    user: user
                })
            })
        ]
    });
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */ 

// EXTERNAL MODULE: ./components/admin/databases/functions/generateTypeDefinition.js
var generateTypeDefinition = __webpack_require__(5753);
;// CONCATENATED MODULE: ./components/admin/databases/TableFields.jsx
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 









/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ let reactKey = 1;
/** ****************************************************************************** */ /**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} props - Server props
 * @param {import("@/package-shared/types").UserType} props.user
 * @param {import("@/package-shared/types").DSQL_FieldSchemaType[]} props.tableFields
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType[]>>} props.setTableFields
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_FieldSchemaType | null>>} props.setTargetField
 * @param {React.MutableRefObject<React.Dispatch<React.SetStateAction<number>> | undefined>} props.refreshFieldsListRef
 * @param {boolean} [props.updateTable]
 * @param {(setLoading?: React.Dispatch<React.SetStateAction<boolean>>) => void} [props.updateTableAfterFieldsUpdateFunction]
 * @param {boolean} [props.collapsed]
 * @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
 * @param {import("@/package-shared/types").DSQL_TableSchemaType} [props.table]
 * @param {any} [props.confirmedDelegetedUser]
 * @param {any} props.query
 */ function TableFields({ user , tableFields , setTableFields , setTargetField , refreshFieldsListRef , updateTable , updateTableAfterFieldsUpdateFunction , collapsed , database , table , confirmedDelegetedUser , query ,  }) {
    /**
     * Get Contexts
     *
     * @abstract { React.useContext }
     */ ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Javascript Variables
     *
     * @abstract Non hook variables and functions
     */ const cloneParentDb = table?.childTable ? table.childTableDbFullName?.replace(new RegExp(/datasquirel_user_\d+_/), "") : null;
    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 { active_clone , active_clone_parent_db , remote_connected  } = database;
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * React Hooks
     *
     * @abstract { useState, useEffect, useRef, etc ... }
     */ const [refresh, setRefresh] = external_react_default().useState(0);
    refreshFieldsListRef.current = setRefresh;
    const [loading, setLoading] = external_react_default().useState(false);
    const [collapse, setCollapse] = external_react_default().useState(collapsed || false);
    external_react_default().useEffect(()=>{
        const { Flip  } = __webpack_require__(2700);
        external_gsap_default().registerPlugin(Flip);
        // @ts-ignore
        const DSQL = window.DSQL;
        if (DSQL) {
            DSQL.Flip = Flip;
        }
    }, []);
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    if (isDelegated && !isTableEditable) {
        return /*#__PURE__*/ jsx_runtime_.jsx(jsx_runtime_.Fragment, {});
    }
    /**
     * Function Return
     *
     * @abstract Main Function Return
     */ return /*#__PURE__*/ (0,jsx_runtime_.jsxs)("section", {
        className: "paper green",
        children: [
            loading && /*#__PURE__*/ jsx_runtime_.jsx(LoadingBlock/* default */.Z, {}),
            table?.childTable ? /*#__PURE__*/ (0,jsx_runtime_.jsxs)((external_react_default()).Fragment, {
                children: [
                    /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                        className: "w-full justify-between flex-wrap",
                        children: [
                            /*#__PURE__*/ jsx_runtime_.jsx("h2", {
                                className: "text-xl m-0 text-left title",
                                children: "Fields"
                            }),
                            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                                children: [
                                    /*#__PURE__*/ jsx_runtime_.jsx("div", {
                                        className: "button outlined light-gray",
                                        onClick: (e)=>{
                                            const txt = (0,generateTypeDefinition/* default */.Z)({
                                                paradigm: "JavaScript",
                                                table,
                                                query,
                                                user
                                            });
                                            if (txt) {
                                                navigator.clipboard.writeText(txt).then(()=>{
                                                    window.alert("JavaScript Type Definition Copied");
                                                });
                                            }
                                        },
                                        children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                            children: "Copy TypeDef (JS)"
                                        })
                                    }),
                                    /*#__PURE__*/ jsx_runtime_.jsx("div", {
                                        className: "button outlined light-gray",
                                        onClick: (e)=>{
                                            const txt = (0,generateTypeDefinition/* default */.Z)({
                                                paradigm: "TypeScript",
                                                table,
                                                query,
                                                user
                                            });
                                            if (txt) {
                                                navigator.clipboard.writeText(txt).then(()=>{
                                                    window.alert("TypeScript Type Definition Copied");
                                                });
                                            }
                                        },
                                        children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                            children: "Copy TypeDef (TS)"
                                        })
                                    })
                                ]
                            })
                        ]
                    }),
                    /*#__PURE__*/ jsx_runtime_.jsx("div", {
                        className: "flex-col w-full",
                        style: collapse ? {
                            maxHeight: "200px"
                        } : {},
                        children: tableFields && tableFields[0] && tableFields.map((field, index)=>{
                            reactKey++;
                            return /*#__PURE__*/ jsx_runtime_.jsx(ClonedSingleTableFieldCard, {
                                field: field,
                                fieldIndex: index,
                                setTargetField: setTargetField,
                                setTableFields: setTableFields,
                                refreshFieldsListRef: refreshFieldsListRef,
                                tableFields: tableFields,
                                database: database,
                                setLoading: setLoading,
                                currentTable: table,
                                user: user,
                                isDelegated: isDelegated
                            }, reactKey);
                        })
                    }),
                    collapsed && /*#__PURE__*/ jsx_runtime_.jsx(ExpandBlock/* default */.Z, {
                        collapse: collapse || false,
                        setCollapse: setCollapse
                    })
                ]
            }) : /*#__PURE__*/ (0,jsx_runtime_.jsxs)((external_react_default()).Fragment, {
                children: [
                    /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                        className: "w-full justify-between flex-wrap",
                        children: [
                            /*#__PURE__*/ jsx_runtime_.jsx("h2", {
                                className: "text-xl m-0 text-left title",
                                children: "Fields"
                            }),
                            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                                children: [
                                    (!isDelegated || isDelegated && isTableEditable) && !active_clone_parent_db && !remote_connected && /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                                        className: "button secondary outlined",
                                        onClick: (e)=>{
                                            if (collapse) setCollapse(false);
                                            addNewTempField({
                                                setTableFields,
                                                tableFields,
                                                setRefresh,
                                                refreshFieldsListRef
                                            });
                                        },
                                        children: [
                                            /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                                className: "symbol",
                                                children: "+"
                                            }),
                                            /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                                children: "Add New Field"
                                            })
                                        ]
                                    }),
                                    /*#__PURE__*/ jsx_runtime_.jsx("div", {
                                        className: "button outlined light-gray",
                                        onClick: (e)=>{
                                            if (!table) return;
                                            const txt = (0,generateTypeDefinition/* default */.Z)({
                                                paradigm: "JavaScript",
                                                table,
                                                query,
                                                user
                                            });
                                            if (txt) {
                                                navigator.clipboard.writeText(txt).then(()=>{
                                                    window.alert("JavaScript Type Definition Copied");
                                                });
                                            }
                                        },
                                        children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                            children: "Copy TypeDef (JS)"
                                        })
                                    }),
                                    /*#__PURE__*/ jsx_runtime_.jsx("div", {
                                        className: "button outlined light-gray",
                                        onClick: (e)=>{
                                            if (!table) return;
                                            const txt = (0,generateTypeDefinition/* default */.Z)({
                                                paradigm: "TypeScript",
                                                table,
                                                query,
                                                user
                                            });
                                            if (txt) {
                                                navigator.clipboard.writeText(txt).then(()=>{
                                                    window.alert("TypeScript Type Definition Copied");
                                                });
                                            }
                                        },
                                        children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                            children: "Copy TypeDef (TS)"
                                        })
                                    })
                                ]
                            })
                        ]
                    }),
                    /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                        className: "flex-col w-full",
                        style: collapse ? {
                            maxHeight: "200px"
                        } : {},
                        children: [
                            tableFields && tableFields[0] && tableFields.map((field, index)=>{
                                reactKey++;
                                if (field.newTempField) {
                                    return /*#__PURE__*/ jsx_runtime_.jsx(NewFieldTemp, {
                                        fieldIndex: index,
                                        tableFields: tableFields,
                                        setTableFields: setTableFields,
                                        refreshFieldsListRef: refreshFieldsListRef,
                                        database: database,
                                        currentTable: table,
                                        user: user
                                    }, reactKey);
                                } else {
                                    return /*#__PURE__*/ jsx_runtime_.jsx(SingleTableFieldCard, {
                                        field: field,
                                        fieldIndex: index,
                                        setTargetField: setTargetField,
                                        setTableFields: setTableFields,
                                        refreshFieldsListRef: refreshFieldsListRef,
                                        tableFields: tableFields,
                                        database: database,
                                        currentTable: table,
                                        confirmedDelegetedUser: confirmedDelegetedUser,
                                        user: user
                                    }, reactKey);
                                }
                            }),
                            (!isDelegated || isDelegated && isTableEditable) && !active_clone_parent_db && !remote_connected && /*#__PURE__*/ (0,jsx_runtime_.jsxs)((external_react_default()).Fragment, {
                                children: [
                                    /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                                        className: "button outlined gray w-full more-padding",
                                        style: {
                                            borderStyle: "dashed"
                                        },
                                        onClick: (e)=>{
                                            if (collapse) setCollapse(false);
                                            addNewTempField({
                                                setTableFields,
                                                tableFields,
                                                setRefresh,
                                                refreshFieldsListRef
                                            });
                                        },
                                        children: [
                                            /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                                className: "symbol",
                                                children: "+"
                                            }),
                                            /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                                children: "Add New Field"
                                            })
                                        ]
                                    }),
                                    updateTable && /*#__PURE__*/ jsx_runtime_.jsx("button", {
                                        className: "secondary w-full py-3",
                                        onClick: (e)=>{
                                            setLoading(true);
                                            updateTableAfterFieldsUpdateFunction && updateTableAfterFieldsUpdateFunction(setLoading);
                                        },
                                        children: "Update Table Fields"
                                    })
                                ]
                            })
                        ]
                    }),
                    collapsed && /*#__PURE__*/ jsx_runtime_.jsx(ExpandBlock/* default */.Z, {
                        collapse: collapse,
                        setCollapse: setCollapse
                    })
                ]
            })
        ]
    });
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */ 


/***/ })

};
;