<html>
element:
Name | Required | Description |
---|---|---|
id | No | The ID of the schedule which fetches a user’s availability |
labels | No | Helpful if you want to pass in custom labels for i18n |
customClassNames | No | To pass in custom classnames from outside for styling the atom |
onUpdateSuccess | No | A callback function to handle updating user availability successfully |
onBeforeUpdate | No | Validates schedule before it is sent to the server; if true, the schedule is sent, else it is not |
onUpdateError | No | A callback function that gets triggered when the user availability fails to update |
onDeleteSuccess | No | A callback function that gets triggered when the user availability is deleted successfully |
onDeleteError | No | A callback function that gets triggered when the user availability fails to delete |
onFormStateChange | No | A callback function that gets triggered whenever the form state changes, providing real-time access to form data |
enableOverrides | No | Allows user to enable or disable date overrides display in the atom; defaults to disabled |
disableEditableHeading | No | Prevents users from editing the heading |
allowDelete | No | When set to false, this prop hides the delete button |
allowSetToDefault | No | When set to false, this prop hides the set to default toggle |
disableToasts | No | Allows users to enable or disable toast notifications, with the default setting being disabled. |
Name | Description |
---|---|
containerClassName | Adds styling to the whole availability settings component |
ctaClassName | Adds stylings only to certain call-to-action buttons |
editableHeadingClassName | Editable heading or title can be styled |
formClassName | Form which contains the days and toggles |
timezoneSelectClassName | Adds styling to the timezone select component |
subtitlesClassName | Styles the subtitle |
scheduleContainer | Styles the entire schedule component |
scheduleDay | Adds styling to just the day of a particular schedule |
dayRanges | Adds styling to day ranges |
timeRanges | Time ranges in the availability settings can be customized |
labelAndSwitchContainer | Adds styling to label and switches |
overridesModalClassNames | Adds styling to the date overrides modal |
Method | Description |
---|---|
validateForm | Validates the current availability form state and returns a promise with validation results. |
handleFormSubmit | Programmatically submits the availability form, triggering the same validation and submission flow as clicking the save button. Unlike validateForm , this method will check required fields and prevent submission unless all required fields are set |
validateForm
method returns an AvailabilityFormValidationResult
object with:
isValid
: Boolean indicating if the form passed validationerrors
: Object containing any validation errors foundvalidateForm
method will not return any error. The validation focuses on the format and consistency of provided data rather than enforcing required field completion.