Documentation Index
Fetch the complete documentation index at: https://anvil.servicetitan.com/llms.txt
Use this file to discover all available pages before exploring further.
Implementation
EditCard Props
Common Examples
import { EditCard, EditCardState } from "@servicetitan/anvil2";
const ExampleComponent = () => {
const [state, setState] = useState<EditCardState>("not started");
const onChange = (change: EditCardChange) => {
if (change === "edit") {
setState("in progress");
}
if (change === "save") {
setState("complete");
}
if (change === "cancel") {
setState("not started");
}
};
return <EditCard state={state} headerText="Header" />;
};
Validation
Saving can be disabled while the contents of the component fail validation.import { EditCard } from "@servicetitan/anvil2";
function ExampleComponent() {
return (
<EditCard
headerText="Header"
state="not started"
disableEdit={false}
disableSave={false}
editButtonText="Edit"
saveButtonText="Save"
/>
); }
EditCard Props
Pass an object in order to change the header text based on the current state.
This property is required.
state
"not started" | "in progress" | "error" | "complete"
required
Called when a button is pressed intended to change state (edit, save, or
cancel).
The text displayed on the save button.