@rocket.chat/onboarding-ui
Version:
Set of components and functions for the onboarding experience on Rocket.Chat
28 lines • 2.62 kB
JavaScript
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { Box, Button, ButtonGroup, Scrollable } from '@rocket.chat/fuselage';
import { useBreakpoints } from '@rocket.chat/fuselage-hooks';
import { Form } from '@rocket.chat/layout';
import { useFormContext } from 'react-hook-form';
import { Trans, useTranslation } from 'react-i18next';
import { Steps } from '../RegisterOfflineForm';
var PasteStep = function (_a) {
var setStep = _a.setStep;
var t = useTranslation().t;
var breakpoints = useBreakpoints();
var isMobile = !breakpoints.includes('md');
var _b = useFormContext(), register = _b.register, _c = _b.formState, isSubmitting = _c.isSubmitting, isValidating = _c.isValidating, isSubmitSuccessful = _c.isSubmitSuccessful;
return (_jsxs(_Fragment, { children: [_jsxs(Form.Container, { children: [_jsx(Box, { mbe: '24px', fontScale: 'p2', children: _jsxs(Trans, { children: ["1. In ", _jsx("strong", { children: "cloud.rocket.chat" }), " get the generated text and paste below to complete your registration process"] }, 'form.registerOfflineForm.pasteStep.description') }), _jsx(Box, { display: 'flex', flexDirection: 'column', alignItems: 'stretch', padding: 16, flexGrow: 1, backgroundColor: 'dark', children: _jsx(Scrollable, { vertical: true, children: _jsx(Box, __assign({}, register('token', { required: true }), { is: 'textarea', backgroundColor: 'dark', height: 'x108', fontFamily: 'mono', fontScale: 'p2', color: 'white', style: { wordBreak: 'break-all', resize: 'none' }, placeholder: t('component.form.action.pasteHere'), autoComplete: 'off', autoCorrect: 'off', autoCapitalize: 'off', spellCheck: 'false' })) }) })] }), _jsx(Form.Footer, { children: _jsx(Box, { display: 'flex', flexDirection: 'column', children: _jsxs(ButtonGroup, { vertical: isMobile, children: [_jsx(Button, { type: 'submit', primary: true, loading: isSubmitting || isValidating, disabled: isSubmitSuccessful, children: t('component.form.action.completeRegistration') }), _jsx(Button, { type: 'button', onClick: function () { return setStep(Steps.COPY); }, children: t('component.form.action.back') })] }) }) })] }));
};
export default PasteStep;
//# sourceMappingURL=PasteStep.js.map