@lithiamotors/lpp-general-modal

General Modal Implementation

import React, { useState } from 'react';
import LppGeneralModal from '@lithiamotors/lpp-general-modal';

const GeneralModalExample = () => {
	const [open, setOpen] = useState(false);

	return (
		<div>
			<button onClick={() => setOpen(true)}>Open Modal</button>
			<LppGeneralModal
				showModal={open}
				onDismiss={() => setOpen(false)}
				content={content}
				mainCallback={() => alert('Submitted!!')}
				title="Lpp General Modal"
				submitText="Submit"
				cancelText="Cancel"
				noSubmit={false}
				noCancel={false}
				noButtons={false}
				disableSubmit={false}
			/>
		</div>
	);
}

Bulk Edit Modal Implementation

import React, { useState } from 'react';
import { LppBulkEditModal } from '@lithiamotors/lpp-general-modal';

const BulkEditExample = () => {
	const [showBulkEditModal, setShowBulkEditModal] = useState(false);

	const valuesToBeEdited = [{name: 'cory'}, {name: 'andy'}, {name: 'daylon'}]

	const bulkEditOptions = [{
		attribute: 'name',
		formInputType: 'select',
		values: ['cory', 'andy', 'daylon'],
	}]

	const handleBulkEditCommit = (bulkEditData) => {
		const mutatedRecords = valuesToBeEdited.map((item) => ({
			...item,
			...bulkEditData,
		}));
		console.log(mutatedRecords);
	};

	return (
		<div>
			<button onClick={() => setOpen(true)}>Open Modal</button>
			<LppBulkEditModal
				bulkEditOptions={bulkEditOptions}
				showBulkEditModal={open}
				setShowBulkEditModal={setOpen}
				handleBulkEditCommit={handleBulkEditCommit}
			/>
		</div>
	);
}

Version 2.0.2 (develop)

• Fix to the input fields that caused a label misalignment

Version 2.0.0 (feature/cmorrissey-79229)

• Upgraded to MUI v5
• Changed file attribute from lib to dist

Version 1.0.0 (feature/cmorrissey-42889)

• BREAKING CHANGE

• Changed general modal archetecture to be a collection of modals instead of a single default export

• Added LppBulkEditModal

• Added disableEnforceFocus prop, was causing stack overflow when symlinking to other packages

Version 1.0.0-alpha.0

• Copied modal from ESCALADE app
• Changed <></> to <React.Fragment></React.Fragment> to work with microbundle-crl