@digitaldefiance/express-suite-react-components 2.9.7 → 2.9.11

package/src/components/ChangePasswordForm.js

@@ -0,0 +1,66 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChangePasswordForm = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const formik_1 = require("formik");
+const react_1 = require("react");
+const Yup = tslib_1.__importStar(require("yup"));
+const suite_core_lib_1 = require("@digitaldefiance/suite-core-lib");
+const contexts_1 = require("../contexts");
+const ChangePasswordForm = ({ onSubmit, titleText, currentPasswordLabel, newPasswordLabel, confirmPasswordLabel, submitButtonText, submittingButtonText, successMessage, currentPasswordValidation, newPasswordValidation, confirmPasswordValidation, }) => {
+    const { t, tComponent } = (0, contexts_1.useI18n)();
+    const [success, setSuccess] = (0, react_1.useState)(false);
+    const [apiError, setApiError] = (0, react_1.useState)('');
+    const validation = {
+        currentPassword: currentPasswordValidation || Yup.string().required(tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_Required)),
+        newPassword: newPasswordValidation || 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('newPassword')], 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 labels = {
+        title: titleText || tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_ChangePassword),
+        currentPassword: currentPasswordLabel || tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_CurrentPassword),
+        newPassword: newPasswordLabel || tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_NewPassword),
+        confirmPassword: confirmPasswordLabel || tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_ConfirmNewPassword),
+        submitButton: submitButtonText || tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_ChangePassword),
+        submittingButton: submittingButtonText || tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_ChangingPassword),
+        success: successMessage || tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.PasswordChange_Success),
+    };
+    const formik = (0, formik_1.useFormik)({
+        initialValues: {
+            currentPassword: '',
+            newPassword: '',
+            confirmPassword: '',
+        },
+        validationSchema: Yup.object({
+            currentPassword: validation.currentPassword,
+            newPassword: validation.newPassword,
+            confirmPassword: validation.confirmPassword,
+        }),
+        onSubmit: async (values, { resetForm }) => {
+            const result = await onSubmit(values);
+            if ('success' in result) {
+                setSuccess(true);
+                setApiError('');
+                resetForm();
+            }
+            else if ('error' in result && result.error) {
+                setApiError(result.error);
+                setSuccess(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 }), (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: "currentPassword", name: "currentPassword", label: labels.currentPassword, type: "password", value: formik.values.currentPassword, onChange: formik.handleChange, onBlur: formik.handleBlur, error: Boolean(formik.touched.currentPassword && formik.errors.currentPassword), helperText: formik.touched.currentPassword && formik.errors.currentPassword, margin: "normal" }), (0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, id: "newPassword", name: "newPassword", label: labels.newPassword, type: "password", value: formik.values.newPassword, onChange: formik.handleChange, onBlur: formik.handleBlur, error: Boolean(formik.touched.newPassword && formik.errors.newPassword), helperText: formik.touched.newPassword && formik.errors.newPassword, margin: "normal" }), (0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, id: "confirmPassword", name: "confirmPassword", label: labels.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: labels.success })), (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: formik.isSubmitting ? labels.submittingButton : labels.submitButton })] })] }) }));
+};
+exports.ChangePasswordForm = ChangePasswordForm;
+exports.default = exports.ChangePasswordForm;

package/src/components/ConfirmationDialog.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export interface ConfirmationDialogProps {
+    open: boolean;
+    title: string;
+    message: string;
+    confirmText?: string;
+    cancelText?: string;
+    onConfirm: () => void;
+    onCancel: () => void;
+}
+export declare const ConfirmationDialog: React.FC<ConfirmationDialogProps>;
+export default ConfirmationDialog;
+//# sourceMappingURL=ConfirmationDialog.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ConfirmationDialog.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/ConfirmationDialog.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,uBAAuB;IACtC,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAyBhE,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/src/components/ConfirmationDialog.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ConfirmationDialog = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const ConfirmationDialog = ({ open, title, message, confirmText = 'Confirm', cancelText = 'Cancel', onConfirm, onCancel, }) => {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Dialog, { open: open, onClose: onCancel, children: [(0, jsx_runtime_1.jsx)(material_1.DialogTitle, { children: title }), (0, jsx_runtime_1.jsx)(material_1.DialogContent, { children: (0, jsx_runtime_1.jsx)(material_1.DialogContentText, { children: message }) }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { onClick: onCancel, color: "primary", children: cancelText }), (0, jsx_runtime_1.jsx)(material_1.Button, { onClick: onConfirm, color: "primary", children: confirmText })] })] }));
+};
+exports.ConfirmationDialog = ConfirmationDialog;
+exports.default = exports.ConfirmationDialog;

package/src/components/CurrencyCodeSelector.d.ts

@@ -0,0 +1,9 @@
+import { FC } from 'react';
+export interface CurrencyCodeSelectorProps {
+    name: string;
+    label: string;
+    onCurrencyChange?: (code: string) => void;
+}
+export declare const CurrencyCodeSelector: FC<CurrencyCodeSelectorProps>;
+export default CurrencyCodeSelector;
+//# sourceMappingURL=CurrencyCodeSelector.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CurrencyCodeSelector.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/CurrencyCodeSelector.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAe,EAAE,EAAE,MAAM,OAAO,CAAC;AAExC,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C;AAED,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,yBAAyB,CA8C9D,CAAC;AAEF,eAAe,oBAAoB,CAAC"}

package/src/components/CurrencyCodeSelector.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CurrencyCodeSelector = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const i18n_lib_1 = require("@digitaldefiance/i18n-lib");
+const material_1 = require("@mui/material");
+const formik_1 = require("formik");
+const CurrencyCodeSelector = ({ name, label, onCurrencyChange, }) => {
+    return ((0, jsx_runtime_1.jsx)(formik_1.Field, { name: name, children: ({ field, form }) => ((0, jsx_runtime_1.jsx)(material_1.TextField, { select: true, fullWidth: true, label: label, ...field, onChange: (event) => {
+                const selectedCode = event.target.value;
+                form.setFieldValue(name, selectedCode);
+                onCurrencyChange?.(selectedCode);
+            }, error: form.touched[name] && Boolean(form.errors[name]), helperText: form.touched[name] && form.errors[name], sx: {
+                '& .MuiSelect-select': {
+                    paddingRight: '32px',
+                },
+                '& .MuiOutlinedInput-root': {
+                    '& fieldset': {
+                        borderColor: 'rgba(0, 0, 0, 0.23)',
+                    },
+                    '&:hover fieldset': {
+                        borderColor: 'rgba(0, 0, 0, 0.87)',
+                    },
+                    '&.Mui-focused fieldset': {
+                        borderColor: 'primary.main',
+                    },
+                },
+            }, children: i18n_lib_1.CurrencyCode.getAll().map((code) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: code, children: code }, code))) })) }));
+};
+exports.CurrencyCodeSelector = CurrencyCodeSelector;
+exports.default = exports.CurrencyCodeSelector;

package/src/components/CurrencyInput.d.ts

@@ -0,0 +1,13 @@
+export interface CurrencyInputProps {
+    value: number;
+    onChange: (value: number) => void;
+    currencyCode?: string;
+    locale?: string;
+    label: string;
+    error?: boolean;
+    helperText?: string;
+    name: string;
+}
+export declare const CurrencyInput: React.FC<CurrencyInputProps>;
+export default CurrencyInput;
+//# sourceMappingURL=CurrencyInput.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CurrencyInput.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/CurrencyInput.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA8DtD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/src/components/CurrencyInput.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CurrencyInput = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const react_number_format_1 = require("react-number-format");
+const i18n_lib_1 = require("@digitaldefiance/i18n-lib");
+const CurrencyInput = ({ value, onChange, currencyCode = 'USD', locale = 'en-US', label, error, helperText, name, }) => {
+    const format = (0, i18n_lib_1.getCurrencyFormat)(locale, currencyCode);
+    if (format.position === 'infix') {
+        const [whole, decimal] = value.toString().split('.');
+        const displayValue = `${whole}${format.symbol}${format.decimalSeparator}${decimal || '00'}`;
+        return ((0, jsx_runtime_1.jsx)(react_number_format_1.NumericFormat, { customInput: material_1.TextField, fullWidth: true, margin: "normal", label: label, value: displayValue, thousandSeparator: format.groupSeparator, decimalSeparator: format.decimalSeparator, decimalScale: 2, fixedDecimalScale: true, valueIsNumericString: true, onValueChange: (values) => {
+                onChange(values.floatValue || 0);
+            }, error: error, helperText: helperText, name: name }));
+    }
+    return ((0, jsx_runtime_1.jsx)(react_number_format_1.NumericFormat, { customInput: material_1.TextField, fullWidth: true, margin: "normal", label: label, value: value, thousandSeparator: format.groupSeparator, decimalSeparator: format.decimalSeparator, decimalScale: 2, fixedDecimalScale: true, prefix: format.position === 'prefix' ? format.symbol + ' ' : undefined, suffix: format.position === 'postfix' ? ' ' + format.symbol : undefined, valueIsNumericString: true, onValueChange: (values) => {
+            onChange(values.floatValue || 0);
+        }, error: error, helperText: helperText, name: name }));
+};
+exports.CurrencyInput = CurrencyInput;
+exports.default = exports.CurrencyInput;

package/src/components/DashboardPage.d.ts

@@ -0,0 +1,8 @@
+import { FC, ReactNode } from 'react';
+export interface DashboardPageProps {
+    title?: string;
+    children?: ReactNode;
+}
+export declare const DashboardPage: FC<DashboardPageProps>;
+export default DashboardPage;
+//# sourceMappingURL=DashboardPage.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardPage.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/DashboardPage.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtC,MAAM,WAAW,kBAAkB;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAahD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/src/components/DashboardPage.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DashboardPage = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const DashboardPage = ({ title = 'Dashboard', children }) => {
+    return ((0, jsx_runtime_1.jsx)(material_1.Container, { maxWidth: "md", children: (0, jsx_runtime_1.jsxs)(material_1.Box, { my: 4, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h4", component: "h1", gutterBottom: true, align: "center", children: title }), (0, jsx_runtime_1.jsx)(material_1.Box, { display: "flex", justifyContent: "center", mt: 3, children: children })] }) }));
+};
+exports.DashboardPage = DashboardPage;
+exports.default = exports.DashboardPage;

package/src/components/DropdownMenu.d.ts

@@ -0,0 +1,9 @@
+import { FC, ReactElement } from 'react';
+import { MenuType } from '../types/MenuType';
+interface DropdownMenuProps {
+    menuType: MenuType;
+    menuIcon: ReactElement;
+}
+export declare const DropdownMenu: FC<DropdownMenuProps>;
+export default DropdownMenu;
+//# sourceMappingURL=DropdownMenu.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/DropdownMenu.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAc,YAAY,EAAyB,MAAM,OAAO,CAAC;AAE5E,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAI7C,UAAU,iBAAiB;IACzB,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,YAAY,CAAC;CACxB;AAED,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CA6E9C,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/src/components/DropdownMenu.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DropdownMenu = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const react_1 = require("react");
+const react_router_dom_1 = require("react-router-dom");
+const MenuContext_1 = require("../contexts/MenuContext");
+const DropdownMenu = ({ menuType, menuIcon }) => {
+    const { getMenuOptions } = (0, MenuContext_1.useMenu)();
+    const [anchorEl, setAnchorEl] = (0, react_1.useState)(null);
+    const navigate = (0, react_router_dom_1.useNavigate)();
+    const handleClose = (0, react_1.useCallback)(() => {
+        setAnchorEl(null);
+    }, []);
+    const handleMenuItemClick = (0, react_1.useCallback)((option) => (event) => {
+        event.stopPropagation();
+        if (option.action) {
+            option.action();
+        }
+        else if (option.link !== undefined) {
+            if (typeof option.link === 'object' &&
+                'pathname' in option.link &&
+                'state' in option.link) {
+                navigate(option.link.pathname, { state: option.link.state });
+            }
+            else {
+                navigate(option.link);
+            }
+        }
+        handleClose(); // Call handleClose after handling the click
+    }, [navigate, handleClose]);
+    const handleClick = (0, react_1.useCallback)((event) => {
+        setAnchorEl(event.currentTarget);
+    }, []);
+    const menuItems = getMenuOptions(menuType, false);
+    if (menuItems.length === 0) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, { color: "inherit", onClick: handleClick, children: menuIcon }), (0, jsx_runtime_1.jsx)(material_1.Menu, { anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, TransitionComponent: material_1.Fade, sx: {
+                    '& .MuiPopover-paper': {
+                        opacity: 0.5,
+                        overflow: 'visible',
+                    },
+                }, children: menuItems.map((option) => ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, { component: "li", onClick: handleMenuItemClick(option), sx: {
+                        display: 'flex',
+                        alignItems: 'center',
+                        '& > svg': {
+                            marginRight: 2,
+                            width: 24,
+                            height: 24,
+                        },
+                    }, children: [option.icon, option.label] }, option.id))) })] }));
+};
+exports.DropdownMenu = DropdownMenu;
+exports.default = exports.DropdownMenu;

package/src/components/ExpirationSecondsSelector.d.ts

@@ -0,0 +1,13 @@
+import { FormikProps } from 'formik';
+import { FC } from 'react';
+export interface ExpirationSecondsSelectorProps {
+    name: string;
+    label: string;
+    formik: FormikProps<any>;
+    optionValues: number[];
+    optionNames: string[];
+    onChange?: (value: number) => void;
+}
+export declare const ExpirationSecondsSelector: FC<ExpirationSecondsSelectorProps>;
+export default ExpirationSecondsSelector;
+//# sourceMappingURL=ExpirationSecondsSelector.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ExpirationSecondsSelector.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/ExpirationSecondsSelector.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AACrC,OAAO,EAAe,EAAE,EAAE,MAAM,OAAO,CAAC;AAExC,MAAM,WAAW,8BAA8B;IAC7C,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,WAAW,CAAC,GAAG,CAAC,CAAC;IACzB,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,eAAO,MAAM,yBAAyB,EAAE,EAAE,CAAC,8BAA8B,CAiDxE,CAAC;AAEF,eAAe,yBAAyB,CAAC"}

package/src/components/ExpirationSecondsSelector.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ExpirationSecondsSelector = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const ExpirationSecondsSelector = ({ name, label, formik, optionValues, optionNames, onChange, }) => {
+    return ((0, jsx_runtime_1.jsx)(material_1.TextField, { select: true, fullWidth: true, label: label, name: name, value: formik.values[name] ?? '', onChange: (event) => {
+            const selectedValue = event.target.value;
+            formik.setFieldValue(name, selectedValue);
+            if (onChange) {
+                onChange(parseInt(selectedValue));
+            }
+        }, error: formik.touched[name] && Boolean(formik.errors[name]), helperText: formik.touched[name] && formik.errors[name], sx: {
+            mt: 1,
+            '& .MuiSelect-select': {
+                paddingRight: '32px',
+            },
+            '& .MuiOutlinedInput-root': {
+                '& fieldset': {
+                    borderColor: 'rgba(0, 0, 0, 0.23)',
+                },
+                '&:hover fieldset': {
+                    borderColor: 'rgba(0, 0, 0, 0.87)',
+                },
+                '&.Mui-focused fieldset': {
+                    borderColor: 'primary.main',
+                },
+            },
+        }, children: optionNames.map((name, index) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: optionValues[index], children: name }, name))) }));
+};
+exports.ExpirationSecondsSelector = ExpirationSecondsSelector;
+exports.default = exports.ExpirationSecondsSelector;

package/src/components/Flag.d.ts

@@ -0,0 +1,20 @@
+import { SxProps, Theme } from '@mui/material';
+import { FC } from 'react';
+export interface FlagProps {
+    language: string;
+    sx?: SxProps<Theme>;
+}
+/**
+ * A simple component to display a flag icon for a given language.
+ *
+ * Props:
+ *   language: The language to display a flag for, as a StringLanguages enum value.
+ *   sx: Optional styles to apply to the component.
+ *
+ * Returns a Box component with an SVG flag icon from flagcdn.com as a ::before pseudo-element.
+ * The flag is sized to 1.5rem by default, but can be overridden by passing a custom sx prop.
+ * The component also includes an aria-label for accessibility, set to `Flag for <language>`.
+ */
+export declare const Flag: FC<FlagProps>;
+export default Flag;
+//# sourceMappingURL=Flag.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Flag.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/Flag.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAE3B,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,EAAE,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;CACrB;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CA6B9B,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/src/components/Flag.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Flag = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const suite_core_lib_1 = require("@digitaldefiance/suite-core-lib");
+const material_1 = require("@mui/material");
+/**
+ * A simple component to display a flag icon for a given language.
+ *
+ * Props:
+ *   language: The language to display a flag for, as a StringLanguages enum value.
+ *   sx: Optional styles to apply to the component.
+ *
+ * Returns a Box component with an SVG flag icon from flagcdn.com as a ::before pseudo-element.
+ * The flag is sized to 1.5rem by default, but can be overridden by passing a custom sx prop.
+ * The component also includes an aria-label for accessibility, set to `Flag for <language>`.
+ */
+const Flag = ({ language, sx }) => {
+    const flagContent = (0, suite_core_lib_1.getFlagCode)(language);
+    if (!flagContent) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { component: "span", "aria-label": `Flag for ${language}`, sx: {
+            fontSize: '1.5rem',
+            lineHeight: 1,
+            verticalAlign: 'middle',
+            '&::before': {
+                content: `" "`,
+                display: 'inline-block',
+                width: '1em',
+                height: '1em',
+                backgroundImage: `url(https://flagcdn.com/${flagContent.toLowerCase()}.svg)`,
+                backgroundSize: 'contain',
+                backgroundRepeat: 'no-repeat',
+                backgroundPosition: 'center',
+                border: '1px solid rgba(0, 0, 0, 0.1)',
+                borderRadius: '2px',
+            },
+            ...sx,
+        } }));
+};
+exports.Flag = Flag;
+exports.default = exports.Flag;

package/src/components/ForgotPasswordForm.d.ts

@@ -0,0 +1,18 @@
+import { FC } from 'react';
+import * as Yup from 'yup';
+export interface ForgotPasswordFormValues {
+    email: string;
+}
+export interface ForgotPasswordFormProps {
+    onSubmit: (values: ForgotPasswordFormValues) => Promise<void>;
+    emailValidation?: Yup.StringSchema;
+    labels?: {
+        title?: string;
+        email?: string;
+        sendResetLink?: string;
+        successMessage?: string;
+    };
+}
+export declare const ForgotPasswordForm: FC<ForgotPasswordFormProps>;
+export default ForgotPasswordForm;
+//# sourceMappingURL=ForgotPasswordForm.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ForgotPasswordForm.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/ForgotPasswordForm.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,GAAG,MAAM,KAAK,CAAC;AAI3B,MAAM,WAAW,wBAAwB;IACvC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,CAAC,MAAM,EAAE,wBAAwB,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9D,eAAe,CAAC,EAAE,GAAG,CAAC,YAAY,CAAC;IACnC,MAAM,CAAC,EAAE;QACP,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,aAAa,CAAC,EAAE,MAAM,CAAC;QACvB,cAAc,CAAC,EAAE,MAAM,CAAC;KACzB,CAAC;CACH;AAED,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CA+F1D,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/src/components/ForgotPasswordForm.js

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ForgotPasswordForm = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const formik_1 = require("formik");
+const react_1 = require("react");
+const Yup = tslib_1.__importStar(require("yup"));
+const suite_core_lib_1 = require("@digitaldefiance/suite-core-lib");
+const contexts_1 = require("../contexts");
+const ForgotPasswordForm = ({ onSubmit, emailValidation, labels = {}, }) => {
+    const { tComponent } = (0, contexts_1.useI18n)();
+    const [success, setSuccess] = (0, react_1.useState)(false);
+    const [apiError, setApiError] = (0, react_1.useState)('');
+    const validation = {
+        email: emailValidation || Yup.string()
+            .email(tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Validation_InvalidEmail))
+            .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.ForgotPassword_Title),
+        email: labels.email || tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_Email),
+        sendResetLink: labels.sendResetLink || tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.ForgotPassword_SendResetLink),
+        successMessage: labels.successMessage || tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.PasswordReset_Success),
+    };
+    const formik = (0, formik_1.useFormik)({
+        initialValues: {
+            email: '',
+        },
+        validationSchema: Yup.object({
+            email: validation.email,
+        }),
+        onSubmit: async (values) => {
+            try {
+                await onSubmit(values);
+                setSuccess(true);
+                setApiError('');
+            }
+            catch (error) {
+                setApiError(error.response?.data?.message || tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.ForgotPassword_Error));
+                setSuccess(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: 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: "email", name: "email", label: translatedLabels.email, value: formik.values.email, onChange: formik.handleChange, onBlur: formik.handleBlur, error: Boolean(formik.touched.email && formik.errors.email), helperText: formik.touched.email && formik.errors.email, 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.sendResetLink })] })] }) }));
+};
+exports.ForgotPasswordForm = ForgotPasswordForm;
+exports.default = exports.ForgotPasswordForm;

package/src/components/LoginForm.d.ts

@@ -0,0 +1,44 @@
+import { useFormik } from 'formik';
+import { FC } from 'react';
+import * as Yup from 'yup';
+export interface LoginFormValues {
+    email?: string;
+    username?: string;
+    password?: string;
+    mnemonic?: string;
+    [key: string]: any;
+}
+export interface LoginFormProps {
+    onSubmit: (values: LoginFormValues) => Promise<void>;
+    loginType?: 'email' | 'username';
+    authType?: 'password' | 'mnemonic';
+    allowLoginTypeToggle?: boolean;
+    allowAuthTypeToggle?: boolean;
+    showForgotPassword?: boolean;
+    showSignUp?: boolean;
+    forgotPasswordLink?: string;
+    signUpLink?: string;
+    emailLabel?: string;
+    usernameLabel?: string;
+    passwordLabel?: string;
+    mnemonicLabel?: string;
+    signInButtonText?: string;
+    forgotPasswordText?: string;
+    signUpText?: string;
+    useUsernameText?: string;
+    useEmailText?: string;
+    useMnemonicText?: string;
+    usePasswordText?: string;
+    toggleVisibilityLabel?: string;
+    titleText?: string;
+    emailValidation?: Yup.StringSchema;
+    usernameValidation?: Yup.StringSchema;
+    passwordValidation?: Yup.StringSchema;
+    mnemonicValidation?: Yup.StringSchema;
+    additionalFields?: (formik: ReturnType<typeof useFormik<LoginFormValues>>) => React.ReactNode;
+    additionalInitialValues?: Record<string, any>;
+    additionalValidation?: Record<string, Yup.Schema>;
+}
+export declare const LoginForm: FC<LoginFormProps>;
+export default LoginForm;
+//# sourceMappingURL=LoginForm.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LoginForm.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/LoginForm.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACnC,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,GAAG,MAAM,KAAK,CAAC;AAI3B,MAAM,WAAW,eAAe;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAED,MAAM,WAAW,cAAc;IAC7B,QAAQ,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACrD,SAAS,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IACjC,QAAQ,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC;IACnC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,GAAG,CAAC,YAAY,CAAC;IACnC,kBAAkB,CAAC,EAAE,GAAG,CAAC,YAAY,CAAC;IACtC,kBAAkB,CAAC,EAAE,GAAG,CAAC,YAAY,CAAC;IACtC,kBAAkB,CAAC,EAAE,GAAG,CAAC,YAAY,CAAC;IACtC,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,CAAC,OAAO,SAAS,CAAC,eAAe,CAAC,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC9F,uBAAuB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC9C,oBAAoB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;CACnD;AAED,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAsPxC,CAAC;AAEF,eAAe,SAAS,CAAC"}