66 lines
1.5 KiB
TypeScript
66 lines
1.5 KiB
TypeScript
import CopyIcon from "@icons/CopyIcon";
|
|
import {
|
|
Box,
|
|
IconButton,
|
|
InputAdornment,
|
|
TextField as MuiTextField,
|
|
TextFieldProps,
|
|
Typography,
|
|
useTheme,
|
|
} from "@mui/material";
|
|
import { FC } from "react";
|
|
|
|
const TextField = MuiTextField as unknown as FC<TextFieldProps>;
|
|
|
|
interface Props {
|
|
scriptText: string;
|
|
helperText: string;
|
|
}
|
|
|
|
export default function WidgetScript({ scriptText, helperText }: Props) {
|
|
const theme = useTheme();
|
|
|
|
return (
|
|
<Box
|
|
sx={{
|
|
p: "20px",
|
|
}}
|
|
>
|
|
<Typography color="#9A9AAF">{helperText}</Typography>
|
|
<TextField
|
|
multiline
|
|
value={scriptText}
|
|
sx={{
|
|
mt: "16px",
|
|
width: "100%",
|
|
"& .MuiInputBase-root": {
|
|
width: "100%",
|
|
backgroundColor: theme.palette.background.default,
|
|
fontSize: "16px",
|
|
color: "#4D4D4D",
|
|
alignItems: "flex-start",
|
|
},
|
|
}}
|
|
InputProps={{
|
|
endAdornment: (
|
|
<InputAdornment position="end">
|
|
<IconButton
|
|
onClick={() => {
|
|
navigator.clipboard.writeText(scriptText);
|
|
}}
|
|
edge="end"
|
|
sx={{ marginTop: "22px" }}
|
|
>
|
|
<CopyIcon
|
|
color={"#ffffff"}
|
|
bgcolor={theme.palette.brightPurple.main}
|
|
/>
|
|
</IconButton>
|
|
</InputAdornment>
|
|
),
|
|
}}
|
|
/>
|
|
</Box>
|
|
);
|
|
}
|