@prezly/theme-kit-ui
Version:
UI components for Prezly themes
44 lines (43 loc) • 2.01 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.SubscriptionCta = SubscriptionCta;
var _react = _interopRequireDefault(require("react"));
var _tailwindMerge = require("tailwind-merge");
var _index = require("../Button/index.cjs");
var _index2 = require("../Input/index.cjs");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function SubscriptionCta(_ref) {
var _intl$subscriptionFo, _intl$subscriptionLa, _intl$actionsSubscri;
var {
className,
error,
value,
onChange: _onChange,
onSubmit,
intl = {}
} = _ref;
function handleSubmit(event) {
event === null || event === void 0 || event.preventDefault();
onSubmit();
}
return /*#__PURE__*/_react.default.createElement("div", {
className: (0, _tailwindMerge.twMerge)('flex flex-col md:flex-row items-start py-12 md:py-24 px-6 md:px-20 gap-8 bg-gray-700', className)
}, /*#__PURE__*/_react.default.createElement("h3", {
className: "title-large w-full md:w-1/2 text-white"
}, (_intl$subscriptionFo = intl['subscription.formTitle']) !== null && _intl$subscriptionFo !== void 0 ? _intl$subscriptionFo : 'Get updates in your mailbox'), /*#__PURE__*/_react.default.createElement("form", {
className: "flex flex-col sm:flex-row items-start w-full md:w-1/2 gap-4",
onSubmit: handleSubmit
}, /*#__PURE__*/_react.default.createElement(_index2.Input, {
className: "w-full",
inputClassName: "py-3 px-4",
error: error,
placeholder: (_intl$subscriptionLa = intl['subscription.labelEmail']) !== null && _intl$subscriptionLa !== void 0 ? _intl$subscriptionLa : 'Enter your email',
value: value,
onChange: event => _onChange(event.target.value)
}), /*#__PURE__*/_react.default.createElement(_index.Button, {
className: "shrink-0 w-full sm:w-max",
type: "submit"
}, (_intl$actionsSubscri = intl['actions.subscribe']) !== null && _intl$actionsSubscri !== void 0 ? _intl$actionsSubscri : 'Subscribe')));
}