/* pdfPasswordInput-compiled.tsx generated by @compiled/babel-plugin v0.38.1 */
"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.PDFPasswordInput = void 0;
require("./pdfPasswordInput-compiled.compiled.css");
var _react = _interopRequireWildcard(require("react"));
var React = _react;
var _runtime = require("@compiled/react/runtime");
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _new = _interopRequireDefault(require("@atlaskit/button/new"));
var _textfield = _interopRequireDefault(require("@atlaskit/textfield"));
var _lockLockedLock = _interopRequireDefault(require("@atlaskit/icon/core/migration/lock-locked--lock"));
var _form = _interopRequireWildcard(require("@atlaskit/form"));
var _reactIntlNext = require("react-intl-next");
var _mediaUi = require("@atlaskit/media-ui");
var _primitives = require("@atlaskit/primitives");
var _statusErrorError = _interopRequireDefault(require("@atlaskit/icon/core/migration/status-error--error"));
var _heading = _interopRequireDefault(require("@atlaskit/heading"));
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
var COLOR_SHADE = '#b6c2cf';
var ERROR_COLOR = '#FD9891';
var headingStyle = null;
var errorMessageWrapperStyle = null;
var errorMessageStyle = null;
var headerStyles = (0, _primitives.xcss)({
  textAlign: 'center',
  marginTop: 'space.200',
  marginBottom: 'space.200'
});
var inputStyle = (0, _primitives.xcss)({
  width: '330px'
});
var footerStyles = (0, _primitives.xcss)({
  marginTop: 'space.200',
  display: 'flex',
  justifyContent: 'center'
});
var PDFPasswordInput = exports.PDFPasswordInput = function PDFPasswordInput(_ref) {
  var onSubmit = _ref.onSubmit,
    hasPasswordError = _ref.hasPasswordError,
    onRender = _ref.onRender;
  var passwordInputRef = (0, _react.useRef)(null);
  var onRenderRef = (0, _react.useRef)(onRender);
  var _useState = (0, _react.useState)(hasPasswordError),
    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
    formError = _useState2[0],
    setFormError = _useState2[1];
  var intl = (0, _reactIntlNext.useIntl)();
  (0, _react.useEffect)(function () {
    var _onRenderRef$current;
    (_onRenderRef$current = onRenderRef.current) === null || _onRenderRef$current === void 0 || _onRenderRef$current.call(onRenderRef);
  }, []);
  (0, _react.useEffect)(function () {
    if (hasPasswordError) {
      var _passwordInputRef$cur;
      setFormError(true);
      (_passwordInputRef$cur = passwordInputRef.current) === null || _passwordInputRef$cur === void 0 || _passwordInputRef$cur.focus();
    }
  }, [hasPasswordError]);
  return /*#__PURE__*/React.createElement(_form.default, {
    onSubmit: onSubmit
  }, function (_ref2) {
    var formProps = _ref2.formProps,
      submitting = _ref2.submitting;
    return /*#__PURE__*/React.createElement("form", formProps, /*#__PURE__*/React.createElement(_primitives.Flex, {
      justifyContent: "center"
    }, /*#__PURE__*/React.createElement(_lockLockedLock.default, {
      label: "",
      LEGACY_size: "xlarge",
      color: COLOR_SHADE
    })), /*#__PURE__*/React.createElement(_primitives.Box, {
      xcss: headerStyles
    }, /*#__PURE__*/React.createElement("div", {
      className: (0, _runtime.ax)(["_12nx2smr _1twlmoej _1nda9txx"])
    }, /*#__PURE__*/React.createElement(_heading.default, {
      as: "h1",
      size: "medium"
    }, /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, _mediaUi.messages.password_protected_pdf)))), /*#__PURE__*/React.createElement(_form.Field, {
      name: "password",
      defaultValue: "",
      isRequired: true
    }, function (_ref3) {
      var fieldProps = _ref3.fieldProps;
      return /*#__PURE__*/React.createElement(_primitives.Box, {
        xcss: inputStyle
      }, /*#__PURE__*/React.createElement(_textfield.default, (0, _extends2.default)({}, fieldProps, {
        type: "password",
        "aria-label": intl.formatMessage(_mediaUi.messages.password),
        placeholder: intl.formatMessage(_mediaUi.messages.enter_password),
        ref: passwordInputRef,
        "aria-describedby": formError ? "".concat(fieldProps.id, "-error") : undefined,
        onChange: function onChange(value) {
          fieldProps.onChange(value);
          setFormError(false);
        }
      })), formError && /*#__PURE__*/React.createElement("div", {
        id: "".concat(fieldProps.id, "-error"),
        className: (0, _runtime.ax)(["_11c8dcr7 _19pk1b66 _1e0c1txw _4cvr1h6o _syaz1366 _125x1366"])
      }, /*#__PURE__*/React.createElement(_statusErrorError.default, {
        color: "currentColor",
        LEGACY_size: "small",
        label: "",
        size: "small"
      }), /*#__PURE__*/React.createElement("div", {
        id: "".concat(fieldProps.id, "-errorMessage"),
        className: (0, _runtime.ax)(["_19pkidpf _18u01b66"])
      }, /*#__PURE__*/React.createElement(_primitives.Text, {
        as: "p"
      }, /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, _mediaUi.messages.incorrect_password)))));
    }), /*#__PURE__*/React.createElement(_primitives.Box, {
      xcss: footerStyles
    }, /*#__PURE__*/React.createElement(_new.default, {
      appearance: "primary",
      type: "submit",
      isLoading: submitting
    }, /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, _mediaUi.messages.submit))));
  });
};