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

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

/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (/* binding */ DatabaseSlugCopy)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6689);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _mui_icons_material_CopyAllTwoTone__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(5050);
/* harmony import */ var _mui_icons_material_CopyAllTwoTone__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_CopyAllTwoTone__WEBPACK_IMPORTED_MODULE_2__);
// @ts-check
/**
 * Imports
 * ==============================================================================
 */ 


// import DifferenceOutlinedIcon from "@mui/icons-material/DifferenceOutlined";
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * Main Component { Functional }
 * ==============================================================================
 * @param {{
 *  slugText: string,
 *  smaller?: boolean,
 *  outlined?: boolean,
 *  full?:boolean
 * }} props - React component props including { children }
 */ function DatabaseSlugCopy({ slugText , smaller , outlined , full ,  }) {
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("span", {
        className: "button break-words text-wrap cancel-link " + (outlined ? " outlined gray" : "light-gray") + (smaller ? " small-text" : ""),
        onClick: (e)=>{
            navigator.clipboard.writeText(slugText).then(()=>{
                alert(`${full ? "Database Full name" : "Database Slug"} "${slugText}" Copied to Clipboard. Use this as the database name when querying data`);
            });
        },
        style: {
            wordWrap: "break-word",
            wordBreak: "break-all"
        },
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx((_mui_icons_material_CopyAllTwoTone__WEBPACK_IMPORTED_MODULE_2___default()), {
                color: "action",
                sx: {
                    opacity: 0.5,
                    fontSize: 15
                }
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", {
                children: slugText
            })
        ]
    });
}


/***/ })

};
;