import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/taggedTemplateLiteralLoose";

var _templateObject, _templateObject2, _templateObject3, _templateObject4;

import React from 'react';
import styled from 'styled-components';
import { Button } from '../../../../../Common';
import { OverflowEllipsis, useGlobalLabels } from '@sentecacommerce-theme/lib';
export var PopupInput = (_ref) => {
  var {
    handleClick,
    header,
    label
  } = _ref;
  var {
    buttons
  } = useGlobalLabels();
  return /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement(Header, null, header), /*#__PURE__*/React.createElement(Inner, null, /*#__PURE__*/React.createElement(Label, null, label), /*#__PURE__*/React.createElement(Button, {
    variant: "primary",
    bordered: true,
    onClick: handleClick
  }, label ? buttons.edit : 'Add')));
};
var Container = styled.div.attrs({
  className: 'pb-4 mb-2'
})(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  width: 100%;\n"])));
var Header = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose([""])));
var Inner = styled.div.attrs({
  className: 'py-2 px-4 mt-1'
})(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n  background: ", ";\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"])), (_ref2) => {
  var {
    theme
  } = _ref2;
  return theme.palette.disabled;
});
var Label = styled(OverflowEllipsis).attrs({
  lines: 1,
  lineHeight: 24
})(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n  max-width: calc(100% - 9rem);\n  word-break: break-all;\n  overflow: hidden;\n"])));
//# sourceMappingURL=index.js.map