@digitaldefiance/express-suite-react-components 5.0.2 → 5.0.4

package/src/components/RegisterForm.js

@@ -0,0 +1,306 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RegisterForm = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const suite_core_lib_1 = require("@digitaldefiance/suite-core-lib");
+const material_1 = require("@mui/material");
+const formik_1 = require("formik");
+const react_1 = require("react");
+const Yup = tslib_1.__importStar(require("yup"));
+const bip39_1 = require("bip39");
+const contexts_1 = require("../contexts");
+const TotpSetupForm_1 = require("./TotpSetupForm");
+const RegisterForm = ({ onSubmit, timezones, getInitialTimezone, usernameValidation, emailValidation, displayNameValidation, timezoneValidation, passwordValidation, confirmPasswordValidation, enableTotpSetup = false, onTotpSetup, onTotpConfirm, onTotpSetupComplete, disallowedEmailDomains, additionalFields, additionalInitialValues = {}, additionalValidation = {}, labels = {}, }) => {
+    const { tComponent } = (0, contexts_1.useI18n)();
+    const [apiErrors, setApiErrors] = (0, react_1.useState)({});
+    const [mnemonic, setMnemonic] = (0, react_1.useState)(null);
+    const [usePassword, setUsePassword] = (0, react_1.useState)(true);
+    const [registrationSuccess, setRegistrationSuccess] = (0, react_1.useState)(false);
+    const [registering, setRegistering] = (0, react_1.useState)(false);
+    const [showMnemonicInput, setShowMnemonicInput] = (0, react_1.useState)(false);
+    const [autoMnemonic, setAutoMnemonic] = (0, react_1.useState)(() => (0, bip39_1.generateMnemonic)(256));
+    const [showTotpSetup, setShowTotpSetup] = (0, react_1.useState)(false);
+    const [totpProvisioningUri, setTotpProvisioningUri] = (0, react_1.useState)(null);
+    const [totpSecret, setTotpSecret] = (0, react_1.useState)(null);
+    const [totpSetupError, setTotpSetupError] = (0, react_1.useState)(null);
+    const [totpSetupComplete, setTotpSetupComplete] = (0, react_1.useState)(false);
+    const [totpSetupLoading, setTotpSetupLoading] = (0, react_1.useState)(false);
+    const initiateTotpSetup = (0, react_1.useCallback)(async () => {
+        if (!onTotpSetup)
+            return;
+        setTotpSetupLoading(true);
+        setTotpSetupError(null);
+        try {
+            const result = await onTotpSetup();
+            if ('error' in result) {
+                setTotpSetupError(result.error);
+            }
+            else {
+                setTotpProvisioningUri(result.provisioningUri);
+                setTotpSecret(result.secret);
+            }
+        }
+        catch {
+            setTotpSetupError(labels.totpSetupError || 'Failed to set up two-factor authentication');
+        }
+        finally {
+            setTotpSetupLoading(false);
+        }
+    }, [onTotpSetup, labels.totpSetupError]);
+    const handleTotpConfirm = (0, react_1.useCallback)(async (code) => {
+        if (!onTotpConfirm) {
+            return { error: 'TOTP confirmation is not available' };
+        }
+        const result = await onTotpConfirm(code);
+        if ('success' in result && result.success) {
+            setTotpSetupComplete(true);
+            setShowTotpSetup(false);
+            if (onTotpSetupComplete) {
+                onTotpSetupComplete();
+            }
+        }
+        return result;
+    }, [onTotpConfirm, onTotpSetupComplete]);
+    const handleSkipTotp = (0, react_1.useCallback)(() => {
+        setShowTotpSetup(false);
+    }, []);
+    const validation = {
+        username: usernameValidation ||
+            Yup.string()
+                .min(suite_core_lib_1.Constants.UsernameMinLength, tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_UsernameMinLengthTemplate))
+                .max(suite_core_lib_1.Constants.UsernameMaxLength, tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_UsernameMaxLengthTemplate))
+                .matches(suite_core_lib_1.Constants.UsernameRegex, tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_UsernameRegexErrorTemplate))
+                .required(tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_Required)),
+        email: emailValidation ||
+            Yup.string()
+                .email(tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_InvalidEmail))
+                .test('disallowed-domain', '', function (value) {
+                if (!value || !disallowedEmailDomains?.length)
+                    return true;
+                const atIndex = value.lastIndexOf('@');
+                if (atIndex <= 0)
+                    return true;
+                const domain = value.slice(atIndex + 1).toLowerCase();
+                const blocked = disallowedEmailDomains.find((d) => d.toLowerCase() === domain);
+                if (!blocked)
+                    return true;
+                return this.createError({
+                    message: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_EmailDomainNotAllowedTemplate, { domain: blocked }),
+                });
+            })
+                .required(tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_Required)),
+        displayName: !suite_core_lib_1.Constants.EnableDisplayName
+            ? Yup.string().strip()
+            : displayNameValidation ||
+                Yup.string()
+                    .min(suite_core_lib_1.Constants.DisplayNameMinLength, tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_DisplayNameMinLengthTemplate))
+                    .max(suite_core_lib_1.Constants.DisplayNameMaxLength, tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_DisplayNameMaxLengthTemplate))
+                    .matches(suite_core_lib_1.Constants.DisplayNameRegex, tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_DisplayNameRegexErrorTemplate))
+                    .required(tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_Required)),
+        directChallenge: Yup.boolean(),
+        timezone: timezoneValidation ||
+            Yup.string()
+                .required(tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_TimezoneRequired))
+                .oneOf(timezones, tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_TimezoneInvalid)),
+        password: passwordValidation ||
+            Yup.string()
+                .matches(suite_core_lib_1.Constants.PasswordRegex, tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_PasswordRegexErrorTemplate))
+                .min(8, tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_PasswordMinLengthTemplate))
+                .required(tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_Required)),
+        confirmPassword: confirmPasswordValidation ||
+            Yup.string()
+                .oneOf([Yup.ref('password')], tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_PasswordMatch))
+                .required(tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_Required)),
+        mnemonic: Yup.string()
+            .optional()
+            .test('mnemonic-format', tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_MnemonicRegex), (value) => {
+            if (!value || value.trim() === '')
+                return true;
+            return suite_core_lib_1.Constants.MnemonicRegex.test(value.trim());
+        }),
+    };
+    const formik = (0, formik_1.useFormik)({
+        initialValues: {
+            username: '',
+            email: '',
+            ...(suite_core_lib_1.Constants.EnableDisplayName ? { displayName: '' } : {}),
+            timezone: getInitialTimezone(),
+            password: '',
+            confirmPassword: '',
+            directChallenge: false,
+            mnemonic: '',
+            ...additionalInitialValues,
+        },
+        enableReinitialize: true,
+        validationSchema: Yup.object({
+            username: validation.username,
+            email: validation.email,
+            ...(suite_core_lib_1.Constants.EnableDisplayName
+                ? { displayName: validation.displayName }
+                : {}),
+            timezone: validation.timezone,
+            ...(usePassword
+                ? {
+                    password: validation.password,
+                    confirmPassword: validation.confirmPassword,
+                }
+                : {}),
+            ...(showMnemonicInput ? { mnemonic: validation.mnemonic } : {}),
+            ...additionalValidation,
+        }),
+        onSubmit: async (values, { setSubmitting, setFieldError, setTouched }) => {
+            setRegistering(true);
+            setApiErrors({});
+            try {
+                const effectiveMnemonic = !showMnemonicInput
+                    ? autoMnemonic
+                    : (values.mnemonic?.trim() || autoMnemonic);
+                const registerResult = await onSubmit({ ...values, mnemonic: effectiveMnemonic }, usePassword);
+                if ('success' in registerResult && registerResult.success) {
+                    setRegistrationSuccess(true);
+                    if (registerResult.mnemonic) {
+                        setMnemonic(registerResult.mnemonic);
+                    }
+                    if (enableTotpSetup && onTotpSetup) {
+                        setShowTotpSetup(true);
+                        // Fire-and-forget: initiate TOTP setup in background
+                        // The setup state is managed by initiateTotpSetup
+                        initiateTotpSetup();
+                    }
+                }
+                else {
+                    setRegistrationSuccess(false);
+                    const newApiErrors = {};
+                    const fieldsToTouch = {};
+                    if ('field' in registerResult && registerResult.field) {
+                        setFieldError(registerResult.field, registerResult.error);
+                        fieldsToTouch[registerResult.field] = true;
+                    }
+                    if ('errors' in registerResult && registerResult.errors) {
+                        registerResult.errors.forEach((err) => {
+                            if (err.path && err.msg) {
+                                setFieldError(err.path, err.msg);
+                                fieldsToTouch[err.path] = true;
+                            }
+                        });
+                    }
+                    if ('error' in registerResult &&
+                        registerResult.error &&
+                        !Object.keys(newApiErrors).length) {
+                        newApiErrors.general = registerResult.error;
+                    }
+                    setApiErrors(newApiErrors);
+                    setTouched(fieldsToTouch, false);
+                }
+            }
+            catch (err) {
+                console.error('[RegisterForm] onSubmit error:', err);
+                setApiErrors({
+                    general: err instanceof Error ? err.message : String(err),
+                });
+            }
+            setSubmitting(false);
+            setRegistering(false);
+        },
+    });
+    return ((0, jsx_runtime_1.jsx)(material_1.Container, { maxWidth: "sm", children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                mt: 8,
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'center',
+            }, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h4", component: "h1", gutterBottom: true, children: labels.title ||
+                        tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_Registration) }), mnemonic || registrationSuccess ? ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { mt: 2, width: '100%' }, children: showTotpSetup && !totpSetupComplete ? ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h5", component: "h2", gutterBottom: true, fontWeight: "bold", sx: { textAlign: 'center' }, children: labels.totpSetupTitle || 'Set Up Two-Factor Authentication' }), totpSetupLoading && ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", color: "text.secondary", sx: { textAlign: 'center', mt: 2 }, children: "Loading TOTP setup..." })), totpSetupError && ((0, jsx_runtime_1.jsx)(material_1.Alert, { severity: "error", sx: { mt: 2, mb: 2 }, children: totpSetupError })), totpProvisioningUri && totpSecret && ((0, jsx_runtime_1.jsx)(TotpSetupForm_1.TotpSetupForm, { provisioningUri: totpProvisioningUri, secret: totpSecret, onConfirm: handleTotpConfirm })), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { textAlign: 'center', mt: 2 }, children: (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "text", onClick: handleSkipTotp, "data-testid": "skip-totp-button", children: labels.totpSkipButton || 'Skip' }) })] })) : totpSetupComplete ? ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Alert, { severity: "success", sx: { mt: 2, mb: 2 }, children: labels.totpSetupSuccess ||
+                                    'Two-factor authentication has been enabled successfully.' }), mnemonic ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: { textAlign: 'center', mb: 3 }, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h5", component: "h2", gutterBottom: true, fontWeight: "bold", children: labels.successTitle ||
+                                                    tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_SuccessTitle) }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", color: "text.secondary", children: labels.mnemonicSuccess ||
+                                                    tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_MnemonicSuccess) })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                            display: 'grid',
+                                            gridTemplateColumns: 'repeat(3, 1fr)',
+                                            gap: 1.5,
+                                            mb: 3,
+                                        }, children: mnemonic.split(/\s+/).map((word, i) => ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                                display: 'flex',
+                                                alignItems: 'center',
+                                                justifyContent: 'center',
+                                                gap: 0.5,
+                                                py: 1,
+                                                px: 1.5,
+                                                borderRadius: 2,
+                                                border: '1px solid',
+                                                borderColor: 'divider',
+                                                bgcolor: 'action.hover',
+                                            }, children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, { variant: "caption", color: "text.secondary", sx: { minWidth: '1.5em', textAlign: 'right' }, children: [i + 1, "."] }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", fontWeight: "bold", children: word })] }, i))) }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { textAlign: 'center' }, children: (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "primary", size: "large", href: "/verify-email", sx: { borderRadius: 6, px: 4 }, children: labels.savedRecoveryPhrase ||
+                                                labels.proceedToLogin ||
+                                                tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_SavedRecoveryPhrase) }) }), (0, jsx_runtime_1.jsxs)(material_1.Alert, { severity: "success", sx: { mt: 3 }, children: [(0, jsx_runtime_1.jsx)(material_1.AlertTitle, { children: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_SuccessTitle) }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", component: "div", children: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_Success) })] })] })) : ((0, jsx_runtime_1.jsxs)(material_1.Alert, { severity: "success", sx: { mt: 2, mb: 2 }, children: [(0, jsx_runtime_1.jsx)(material_1.AlertTitle, { children: labels.successTitle ||
+                                            tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_SuccessTitle) }), (0, jsx_runtime_1.jsxs)(material_1.Typography, { variant: "body2", component: "div", children: [tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_Success), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { textAlign: 'center', mt: 1 }, children: (0, jsx_runtime_1.jsx)(material_1.Link, { href: "/login", children: labels.proceedToLogin ||
+                                                        tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.ProceedToLogin) }) })] })] }))] })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: mnemonic ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: { textAlign: 'center', mb: 3 }, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h5", component: "h2", gutterBottom: true, fontWeight: "bold", children: labels.successTitle ||
+                                                tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_SuccessTitle) }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", color: "text.secondary", children: labels.mnemonicSuccess ||
+                                                tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_MnemonicSuccess) })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                        display: 'grid',
+                                        gridTemplateColumns: 'repeat(3, 1fr)',
+                                        gap: 1.5,
+                                        mb: 3,
+                                    }, children: mnemonic.split(/\s+/).map((word, i) => ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                            display: 'flex',
+                                            alignItems: 'center',
+                                            justifyContent: 'center',
+                                            gap: 0.5,
+                                            py: 1,
+                                            px: 1.5,
+                                            borderRadius: 2,
+                                            border: '1px solid',
+                                            borderColor: 'divider',
+                                            bgcolor: 'action.hover',
+                                        }, children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, { variant: "caption", color: "text.secondary", sx: { minWidth: '1.5em', textAlign: 'right' }, children: [i + 1, "."] }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", fontWeight: "bold", children: word })] }, i))) }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { textAlign: 'center' }, children: (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "primary", size: "large", href: "/verify-email", sx: { borderRadius: 6, px: 4 }, children: labels.savedRecoveryPhrase ||
+                                            labels.proceedToLogin ||
+                                            tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_SavedRecoveryPhrase) }) }), (0, jsx_runtime_1.jsxs)(material_1.Alert, { severity: "success", sx: { mt: 3 }, children: [(0, jsx_runtime_1.jsx)(material_1.AlertTitle, { children: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_SuccessTitle) }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", component: "div", children: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_Success) })] })] })) : ((0, jsx_runtime_1.jsxs)(material_1.Alert, { severity: "success", sx: { mt: 2, mb: 2 }, children: [(0, jsx_runtime_1.jsx)(material_1.AlertTitle, { children: labels.successTitle ||
+                                        tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_SuccessTitle) }), (0, jsx_runtime_1.jsxs)(material_1.Typography, { variant: "body2", component: "div", children: [tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_Success), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { textAlign: 'center', mt: 1 }, children: (0, jsx_runtime_1.jsx)(material_1.Link, { href: "/login", children: labels.proceedToLogin ||
+                                                    tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.ProceedToLogin) }) })] })] })) })) })) : ((0, jsx_runtime_1.jsxs)(material_1.Box, { component: "form", onSubmit: formik.handleSubmit, sx: { mt: 1, width: '100%' }, children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, id: "username", name: "username", label: labels.username ||
+                                tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_Username), value: formik.values.username, onChange: formik.handleChange, onBlur: formik.handleBlur, error: Boolean(formik.touched.username &&
+                                (formik.errors.username || apiErrors.username)), helperText: formik.touched.username &&
+                                (formik.errors.username || apiErrors.username), margin: "normal" }), (0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, id: "email", name: "email", label: labels.email ||
+                                tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_Email), value: formik.values.email, onChange: formik.handleChange, onBlur: formik.handleBlur, error: Boolean(formik.touched.email && (formik.errors.email || apiErrors.email)), helperText: formik.touched.email && (formik.errors.email || apiErrors.email), margin: "normal" }), suite_core_lib_1.Constants.EnableDisplayName && ((0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, id: "displayName", name: "displayName", label: labels.displayName ||
+                                tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_DisplayName), value: formik.values.displayName, onChange: formik.handleChange, onBlur: formik.handleBlur, error: Boolean(formik.touched.displayName &&
+                                (formik.errors.displayName || apiErrors.displayName)), helperText: formik.touched.displayName &&
+                                (formik.errors.displayName || apiErrors.displayName), margin: "normal" })), (0, jsx_runtime_1.jsxs)(material_1.FormControl, { fullWidth: true, margin: "normal", children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { id: "timezone-label", children: labels.timezone ||
+                                        tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_Timezone) }), (0, jsx_runtime_1.jsx)(material_1.Select, { labelId: "timezone-label", id: "timezone", name: "timezone", value: formik.values.timezone, onChange: formik.handleChange, onBlur: formik.handleBlur, error: formik.touched.timezone && Boolean(formik.errors.timezone), label: labels.timezone ||
+                                        tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_Timezone), children: timezones.map((tz) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: tz, children: tz }, tz))) }), formik.touched.timezone &&
+                                    (formik.errors.timezone || apiErrors.timezone) && ((0, jsx_runtime_1.jsx)(material_1.Typography, { color: "error", variant: "caption", children: formik.errors.timezone || apiErrors.timezone }))] }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { display: 'flex', alignItems: 'center', mt: 2 }, children: (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "text", onClick: () => setUsePassword(!usePassword), children: usePassword
+                                    ? labels.useMnemonic ||
+                                        tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_UseMnemonic)
+                                    : labels.usePassword ||
+                                        tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_UsePassword) }) }), usePassword && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, id: "password", name: "password", label: labels.password ||
+                                        tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_Password), type: "password", value: formik.values.password, onChange: formik.handleChange, onBlur: formik.handleBlur, error: Boolean(formik.touched.password && formik.errors.password), helperText: formik.touched.password && formik.errors.password, margin: "normal" }), (0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, id: "confirmPassword", name: "confirmPassword", label: labels.confirmPassword ||
+                                        tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_ConfirmNewPassword), type: "password", value: formik.values.confirmPassword, onChange: formik.handleChange, onBlur: formik.handleBlur, error: Boolean(formik.touched.confirmPassword &&
+                                        formik.errors.confirmPassword), helperText: formik.touched.confirmPassword &&
+                                        formik.errors.confirmPassword, margin: "normal" }), (0, jsx_runtime_1.jsx)(material_1.Alert, { severity: "info", sx: { mt: 1 }, children: labels?.passwordAuthInfo ||
+                                        tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_PasswordAuthInfo) })] })), (0, jsx_runtime_1.jsxs)(material_1.FormControl, { fullWidth: true, margin: "normal", children: [(0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Checkbox, { id: "directChallenge", name: "directChallenge", checked: formik.values.directChallenge || false, onChange: formik.handleChange }), label: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_DirectChallengeLabel) }), (0, jsx_runtime_1.jsx)(material_1.FormHelperText, { children: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_DirectChallengeHelper) })] }), additionalFields && additionalFields(formik, usePassword), !showMnemonicInput && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: { mt: 2 }, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "subtitle2", gutterBottom: true, children: labels.mnemonic || 'Your Recovery Phrase — save this before registering' }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                        display: 'grid',
+                                        gridTemplateColumns: 'repeat(3, 1fr)',
+                                        gap: 1,
+                                        mb: 1,
+                                    }, children: autoMnemonic.split(/\s+/).map((word, i) => ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                            display: 'flex',
+                                            alignItems: 'center',
+                                            gap: 0.5,
+                                            py: 0.5,
+                                            px: 1,
+                                            borderRadius: 1,
+                                            border: '1px solid',
+                                            borderColor: 'divider',
+                                            bgcolor: 'action.hover',
+                                        }, children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, { variant: "caption", color: "text.secondary", sx: { minWidth: '1.5em', textAlign: 'right' }, children: [i + 1, "."] }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", fontWeight: "bold", children: word })] }, i))) }), (0, jsx_runtime_1.jsx)(material_1.Alert, { severity: "warning", sx: { mb: 1 }, children: "Write down these words in order. You will need them to recover your account." }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "text", size: "small", onClick: () => setAutoMnemonic((0, bip39_1.generateMnemonic)(256)), children: "Regenerate" })] })), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { mt: 1 }, children: (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "text", size: "small", onClick: () => setShowMnemonicInput(!showMnemonicInput), "aria-expanded": showMnemonicInput, "aria-controls": "mnemonic-input", children: showMnemonicInput
+                                    ? tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_ClearMnemonic)
+                                    : tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_Mnemonic) }) }), showMnemonicInput && ((0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, id: "mnemonic-input", name: "mnemonic", label: labels.mnemonic ||
+                                tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_Mnemonic), value: formik.values.mnemonic, onChange: formik.handleChange, onBlur: formik.handleBlur, error: Boolean(formik.touched.mnemonic &&
+                                (formik.errors.mnemonic || apiErrors.mnemonic)), helperText: formik.touched.mnemonic &&
+                                (formik.errors.mnemonic || apiErrors.mnemonic), margin: "normal", multiline: true, minRows: 2 })), apiErrors.general && ((0, jsx_runtime_1.jsx)(material_1.Alert, { severity: "error", sx: { mt: 2, mb: 2 }, children: apiErrors.general })), (0, jsx_runtime_1.jsx)(material_1.Button, { type: "submit", fullWidth: true, variant: "contained", color: "primary", sx: { mt: 3, mb: 2 }, disabled: formik.isSubmitting, children: registering
+                                ? labels.registering ||
+                                    tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_Registering)
+                                : labels.register ||
+                                    tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_RegisterButton) }), registering && ((0, jsx_runtime_1.jsxs)(material_1.Alert, { severity: "success", sx: { mt: 2, mb: 2, whiteSpace: 'pre-wrap' }, children: [(0, jsx_runtime_1.jsx)(material_1.AlertTitle, { children: labels.registering ||
+                                        tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_Registering) }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", component: "div", children: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_RegisteringMessage) })] })), !registrationSuccess && ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { textAlign: 'center' }, children: (0, jsx_runtime_1.jsx)(material_1.Link, { href: "/login", variant: "body2", children: labels.loginLink ||
+                                    tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Registration_LoginLink) }) }))] }))] }) }));
+};
+exports.RegisterForm = RegisterForm;
+exports.default = exports.RegisterForm;

package/src/components/ResetPasswordForm.d.ts

@@ -0,0 +1,23 @@
+import { FC } from 'react';
+import * as Yup from 'yup';
+export interface ResetPasswordFormValues {
+    password: string;
+    confirmPassword: string;
+}
+export interface ResetPasswordFormProps {
+    token: string | null;
+    onSubmit: (token: string, password: string) => Promise<void>;
+    passwordValidation?: Yup.StringSchema;
+    confirmPasswordValidation?: Yup.StringSchema;
+    labels?: {
+        title?: string;
+        password?: string;
+        confirmPassword?: string;
+        resetButton?: string;
+        successMessage?: string;
+        invalidToken?: string;
+    };
+}
+export declare const ResetPasswordForm: FC<ResetPasswordFormProps>;
+export default ResetPasswordForm;
+//# sourceMappingURL=ResetPasswordForm.d.ts.map

package/src/components/ResetPasswordForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResetPasswordForm.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/ResetPasswordForm.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,GAAG,MAAM,KAAK,CAAC;AAG3B,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7D,kBAAkB,CAAC,EAAE,GAAG,CAAC,YAAY,CAAC;IACtC,yBAAyB,CAAC,EAAE,GAAG,CAAC,YAAY,CAAC;IAC7C,MAAM,CAAC,EAAE;QACP,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,cAAc,CAAC,EAAE,MAAM,CAAC;QACxB,YAAY,CAAC,EAAE,MAAM,CAAC;KACvB,CAAC;CACH;AAED,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CA6MxD,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/src/components/ResetPasswordForm.js

@@ -0,0 +1,78 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ResetPasswordForm = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const suite_core_lib_1 = require("@digitaldefiance/suite-core-lib");
+const material_1 = require("@mui/material");
+const formik_1 = require("formik");
+const react_1 = require("react");
+const Yup = tslib_1.__importStar(require("yup"));
+const contexts_1 = require("../contexts");
+const ResetPasswordForm = ({ token, onSubmit, passwordValidation, confirmPasswordValidation, labels = {}, }) => {
+    const { tComponent } = (0, contexts_1.useI18n)();
+    const [success, setSuccess] = (0, react_1.useState)(false);
+    const [apiError, setApiError] = (0, react_1.useState)('');
+    const validation = {
+        password: passwordValidation ||
+            Yup.string()
+                .min(suite_core_lib_1.Constants.PasswordMinLength, tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_PasswordMinLengthTemplate))
+                .required(tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_Required)),
+        confirmPassword: confirmPasswordValidation ||
+            Yup.string()
+                .oneOf([Yup.ref('password')], tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_PasswordMatch))
+                .required(tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_Required)),
+    };
+    const translatedLabels = {
+        title: labels.title ||
+            tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.PasswordReset_Title),
+        password: labels.password ||
+            tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_NewPassword),
+        confirmPassword: labels.confirmPassword ||
+            tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_ConfirmNewPassword),
+        resetButton: labels.resetButton ||
+            tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.PasswordReset_Button),
+        successMessage: labels.successMessage ||
+            tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.PasswordReset_Success),
+        invalidToken: labels.invalidToken ||
+            tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.ForgotPassword_InvalidToken),
+    };
+    const formik = (0, formik_1.useFormik)({
+        initialValues: {
+            password: '',
+            confirmPassword: '',
+        },
+        validationSchema: Yup.object({
+            password: validation.password,
+            confirmPassword: validation.confirmPassword,
+        }),
+        onSubmit: async (values) => {
+            if (!token) {
+                setApiError(translatedLabels.invalidToken);
+                return;
+            }
+            try {
+                await onSubmit(token, values.password);
+                setSuccess(true);
+                setApiError('');
+            }
+            catch (error) {
+                const err = error;
+                setApiError(err.response?.data?.message ||
+                    tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Error_PasswordChange));
+                setSuccess(false);
+            }
+        },
+    });
+    if (!token) {
+        return ((0, jsx_runtime_1.jsx)(material_1.Container, { maxWidth: "sm", children: (0, jsx_runtime_1.jsx)(material_1.Alert, { severity: "error", sx: { mt: 4 }, children: translatedLabels.invalidToken }) }));
+    }
+    return ((0, jsx_runtime_1.jsx)(material_1.Container, { maxWidth: "sm", children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                mt: 8,
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'center',
+            }, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h4", component: "h1", gutterBottom: true, children: translatedLabels.title }), (0, jsx_runtime_1.jsxs)(material_1.Box, { component: "form", onSubmit: formik.handleSubmit, sx: { mt: 1, width: '100%' }, children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, id: "password", name: "password", label: translatedLabels.password, type: "password", value: formik.values.password, onChange: formik.handleChange, onBlur: formik.handleBlur, error: Boolean(formik.touched.password && formik.errors.password), helperText: formik.touched.password && formik.errors.password, margin: "normal" }), (0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, id: "confirmPassword", name: "confirmPassword", label: translatedLabels.confirmPassword, type: "password", value: formik.values.confirmPassword, onChange: formik.handleChange, onBlur: formik.handleBlur, error: Boolean(formik.touched.confirmPassword && formik.errors.confirmPassword), helperText: formik.touched.confirmPassword && formik.errors.confirmPassword, margin: "normal" }), apiError && ((0, jsx_runtime_1.jsx)(material_1.Alert, { severity: "error", sx: { mt: 2, mb: 2 }, children: apiError })), success && ((0, jsx_runtime_1.jsx)(material_1.Alert, { severity: "success", sx: { mt: 2, mb: 2 }, children: translatedLabels.successMessage })), (0, jsx_runtime_1.jsx)(material_1.Button, { type: "submit", fullWidth: true, variant: "contained", color: "primary", sx: { mt: 3, mb: 2 }, disabled: formik.isSubmitting, children: translatedLabels.resetButton })] })] }) }));
+};
+exports.ResetPasswordForm = ResetPasswordForm;
+exports.default = exports.ResetPasswordForm;

package/src/components/SideMenu.d.ts

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+interface SideMenuProps {
+    isOpen: boolean;
+    onClose: () => void;
+}
+export declare const SideMenu: FC<SideMenuProps>;
+export default SideMenu;
+//# sourceMappingURL=SideMenu.d.ts.map

package/src/components/SideMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideMenu.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/SideMenu.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAO3B,UAAU,aAAa;IACrB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CA8BtC,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/src/components/SideMenu.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SideMenu = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const react_router_1 = require("react-router");
+const MenuContext_1 = require("../contexts/MenuContext");
+const MenuType_1 = require("../types/MenuType");
+const SideMenuListItem_1 = require("./SideMenuListItem");
+const SideMenu = ({ isOpen, onClose }) => {
+    const { getMenuOptions } = (0, MenuContext_1.useMenu)();
+    const navigate = (0, react_router_1.useNavigate)();
+    const menuOptions = getMenuOptions(MenuType_1.MenuTypes.SideMenu, true);
+    const handleNavigate = (link) => {
+        if (typeof link === 'string') {
+            navigate(link);
+        }
+        else if (link.pathname) {
+            navigate(link.pathname, { state: link.state });
+        }
+    };
+    return ((0, jsx_runtime_1.jsx)(material_1.Drawer, { anchor: "left", open: isOpen, onClose: onClose, children: (0, jsx_runtime_1.jsx)(material_1.List, { children: menuOptions.map((item) => ((0, jsx_runtime_1.jsx)(SideMenuListItem_1.SideMenuListItem, { menuItem: item, onClose: onClose, onNavigate: handleNavigate }, item.id))) }) }));
+};
+exports.SideMenu = SideMenu;
+exports.default = exports.SideMenu;

package/src/components/SideMenuListItem.d.ts

@@ -0,0 +1,13 @@
+import { FC } from 'react';
+import { IMenuOption } from '../interfaces';
+export interface SideMenuListItemProps {
+    menuItem: IMenuOption;
+    onClose: () => void;
+    onNavigate?: (link: string | Partial<{
+        pathname: string;
+        state?: unknown;
+    }>) => void;
+}
+export declare const SideMenuListItem: FC<SideMenuListItemProps>;
+export default SideMenuListItem;
+//# sourceMappingURL=SideMenuListItem.d.ts.map

package/src/components/SideMenuListItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideMenuListItem.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/SideMenuListItem.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,EAAE,EAAe,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,WAAW,CAAC;IACtB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,CACX,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC,KAC1D,IAAI,CAAC;CACX;AAED,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CAuDtD,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/src/components/SideMenuListItem.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SideMenuListItem = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const react_1 = require("react");
+const SideMenuListItem = ({ menuItem, onClose, onNavigate, }) => {
+    const handleMenuItemClick = (0, react_1.useCallback)((option) => (event) => {
+        event.stopPropagation();
+        if (option.action) {
+            option.action();
+        }
+        else if (option.link !== undefined && onNavigate) {
+            if (typeof option.link === 'string') {
+                onNavigate(option.link);
+            }
+            else if (typeof option.link === 'object' &&
+                'pathname' in option.link &&
+                option.link.pathname) {
+                onNavigate({
+                    pathname: option.link.pathname,
+                    state: 'state' in option.link ? option.link.state : undefined,
+                });
+            }
+        }
+        onClose();
+    }, [onNavigate, onClose]);
+    if (menuItem.divider) {
+        return (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: { ...menuItem.sideSx } }, menuItem.id);
+    }
+    else if (menuItem.link) {
+        return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, { onClick: handleMenuItemClick(menuItem), sx: { ...menuItem.sideSx }, children: [menuItem.icon && (0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { sx: { ...menuItem.sideIconSx }, children: menuItem.icon }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: menuItem.label, sx: { ...menuItem.sideTextSx } })] }, menuItem.id));
+    }
+    else if (menuItem.action) {
+        const action = menuItem.action;
+        return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, { onClick: async () => {
+                await action();
+                onClose();
+            }, sx: { ...menuItem.sideSx }, children: [menuItem.icon && (0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { sx: { ...menuItem.sideIconSx }, children: menuItem.icon }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: menuItem.label, sx: { ...menuItem.sideTextSx } })] }, menuItem.id));
+    }
+    return null;
+};
+exports.SideMenuListItem = SideMenuListItem;
+exports.default = exports.SideMenuListItem;

package/src/components/T.d.ts

@@ -0,0 +1,7 @@
+interface FCParams<TEnum extends string> {
+    stringKey: TEnum;
+    vars?: Record<string, string | number>;
+}
+export declare const Tbranded: <TEnum extends string>({ stringKey, vars, }: FCParams<TEnum>) => string | undefined;
+export default Tbranded;
+//# sourceMappingURL=T.d.ts.map

package/src/components/T.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"T.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/T.tsx"],"names":[],"mappings":"AAKA,UAAU,QAAQ,CAAC,KAAK,SAAS,MAAM;IACrC,SAAS,EAAE,KAAK,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;CACxC;AAED,eAAO,MAAM,QAAQ,GAAI,KAAK,SAAS,MAAM,EAAE,sBAG5C,QAAQ,CAAC,KAAK,CAAC,KAAG,MAAM,GAAG,SAQ7B,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/src/components/T.js

@@ -0,0 +1,13 @@
+"use strict";
+// src/app/components/T.tsx
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tbranded = void 0;
+const react_1 = require("react");
+const contexts_1 = require("../contexts");
+const Tbranded = ({ stringKey, vars, }) => {
+    const { currentLanguage, tBranded } = (0, contexts_1.useI18n)();
+    const translated = (0, react_1.useMemo)(() => tBranded(stringKey, vars, currentLanguage), [tBranded, stringKey, vars, currentLanguage]);
+    return translated;
+};
+exports.Tbranded = Tbranded;
+exports.default = exports.Tbranded;

package/src/components/TDiv.d.ts

@@ -0,0 +1,9 @@
+import { DetailedHTMLProps, HTMLAttributes, ReactElement } from 'react';
+interface FCParams<TEnum extends string> {
+    stringKey: TEnum;
+    vars?: Record<string, string | number>;
+    divOptions?: DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
+}
+export declare const TDivBranded: <TEnum extends string>({ stringKey, vars, divOptions, }: FCParams<TEnum>) => ReactElement;
+export default TDivBranded;
+//# sourceMappingURL=TDiv.d.ts.map

package/src/components/TDiv.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TDiv.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/TDiv.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,YAAY,EAAW,MAAM,OAAO,CAAC;AAGjF,UAAU,QAAQ,CAAC,KAAK,SAAS,MAAM;IACrC,SAAS,EAAE,KAAK,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;IACvC,UAAU,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,cAAc,CAAC,CAAC;CAChF;AAED,eAAO,MAAM,WAAW,GAAI,KAAK,SAAS,MAAM,EAAE,kCAI/C,QAAQ,CAAC,KAAK,CAAC,KAAG,YAQpB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/src/components/TDiv.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TDivBranded = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+// src/app/components/TDiv.tsx
+const react_1 = require("react");
+const contexts_1 = require("../contexts");
+const TDivBranded = ({ stringKey, vars, divOptions, }) => {
+    const { currentLanguage, tBranded } = (0, contexts_1.useI18n)();
+    const translated = (0, react_1.useMemo)(() => tBranded(stringKey, vars, currentLanguage), [tBranded, stringKey, vars, currentLanguage]);
+    return (0, jsx_runtime_1.jsx)("div", { ...divOptions, children: translated });
+};
+exports.TDivBranded = TDivBranded;
+exports.default = exports.TDivBranded;

package/src/components/TImgAlt.d.ts

@@ -0,0 +1,10 @@
+import { DetailedHTMLProps, ImgHTMLAttributes, ReactElement } from 'react';
+interface FCParams<TEnum extends string> {
+    src: string;
+    stringKey: TEnum;
+    vars?: Record<string, string | number>;
+    imgOptions?: DetailedHTMLProps<ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>;
+}
+export declare const TImgAlt: <TEnum extends string>({ src, stringKey, vars, imgOptions, }: FCParams<TEnum>) => ReactElement;
+export default TImgAlt;
+//# sourceMappingURL=TImgAlt.d.ts.map

package/src/components/TImgAlt.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TImgAlt.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/TImgAlt.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,YAAY,EAAW,MAAM,OAAO,CAAC;AAGpF,UAAU,QAAQ,CAAC,KAAK,SAAS,MAAM;IACrC,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,KAAK,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;IACvC,UAAU,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,CAAC;CACvF;AAED,eAAO,MAAM,OAAO,GAAI,KAAK,SAAS,MAAM,EAAE,uCAK3C,QAAQ,CAAC,KAAK,CAAC,KAAG,YAQpB,CAAC;AAEF,eAAe,OAAO,CAAC"}