@wulperstudio/cms/organisms/AlterBoard/components/AddElementBody/index.js

Wulper Studio Library Components CMS

import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
var _Icon;
import React, { useCallback } from 'react';
import { Collapse, InputAdornment } from '@mui/material';
import { Icon } from '@iconify/react';
import { TextFieldV5LabelOut } from '../../../../components/TextFieldV5LabelOut';
import { jsx as _jsx } from "react/jsx-runtime";
export var AddElementBody = function AddElementBody(_ref) {
  var onClick = _ref.onClick,
    placeholder = _ref.placeholder,
    initialState = _ref.initialState,
    onClose = _ref.onClose,
    TextFieldProps = _ref.TextFieldProps;
  var _React$useState = React.useState(''),
    _React$useState2 = _slicedToArray(_React$useState, 2),
    elementName = _React$useState2[0],
    setElementName = _React$useState2[1];
  var handleClick = function handleClick() {
    onClick(elementName);
    onClose();
    setElementName('');
  };
  var handleChange = useCallback(function (e) {
    var text = e.target.value;
    setElementName(text);
  }, []);
  return /*#__PURE__*/_jsx(Collapse, {
    "in": initialState,
    orientation: "vertical",
    children: /*#__PURE__*/_jsx(TextFieldV5LabelOut, Object.assign({
      size: "medium",
      variant: "outlined",
      placeholder: placeholder,
      value: elementName,
      onChange: handleChange,
      fullWidth: true,
      InputProps: {
        endAdornment: /*#__PURE__*/_jsx(InputAdornment, {
          position: "end",
          onClick: elementName !== '' ? handleClick : undefined,
          sx: {
            cursor: 'pointer'
          },
          children: _Icon || (_Icon = /*#__PURE__*/_jsx(Icon, {
            icon: "dashicons:saved"
          }))
        }),
        sx: {
          pr: '15px'
        }
      }
    }, TextFieldProps))
  });
};