diff --git a/packages/editor/README.md b/packages/editor/README.md index 39edf9029aca2a..adbb3f0e027973 100644 --- a/packages/editor/README.md +++ b/packages/editor/README.md @@ -128,7 +128,14 @@ Example: ### AutosaveMonitor -AutosaveMonitor component. Monitors the changes made to the edited post and triggers autosave if necessary. +Monitors the changes made to the edited post and triggers autosave if necessary. + +The logic is straightforward: a check is performed every `props.interval` seconds. If any changes are detected, `props.autosave()` is called. The time between the change and the autosave varies but is no larger than `props.interval` seconds. Refer to the code below for more details, such as the specific way of detecting changes. + +There are two caveats: + +- If `props.isAutosaveable` happens to be false at a time of checking for changes, the check is retried every second. +- The timer may be disabled by setting `props.disableIntervalChecks` to `true`. In that mode, any change will immediately trigger `props.autosave()`. _Usage_ @@ -136,6 +143,15 @@ _Usage_ ``` +_Parameters_ + +- _props_ `Object`: - The properties passed to the component. +- _props.autosave_ `Function`: - The function to call when changes need to be saved. +- _props.interval_ `number`: - The maximum time in seconds between an unsaved change and an autosave. +- _props.isAutosaveable_ `boolean`: - If false, the check for changes is retried every second. +- _props.disableIntervalChecks_ `boolean`: - If true, disables the timer and any change will immediately trigger `props.autosave()`. +- _props.isDirty_ `boolean`: - Indicates if there are unsaved changes. + ### BlockAlignmentToolbar > **Deprecated** since 5.3, use `wp.blockEditor.BlockAlignmentToolbar` instead. diff --git a/packages/editor/src/components/autosave-monitor/index.js b/packages/editor/src/components/autosave-monitor/index.js index 10cf5196fb77b3..2800b4bf0fc1f1 100644 --- a/packages/editor/src/components/autosave-monitor/index.js +++ b/packages/editor/src/components/autosave-monitor/index.js @@ -11,17 +11,6 @@ import { store as coreStore } from '@wordpress/core-data'; */ import { store as editorStore } from '../../store'; -/** - * AutosaveMonitor invokes `props.autosave()` within at most `interval` seconds after an unsaved change is detected. - * - * The logic is straightforward: a check is performed every `props.interval` seconds. If any changes are detected, `props.autosave()` is called. - * The time between the change and the autosave varies but is no larger than `props.interval` seconds. Refer to the code below for more details, such as - * the specific way of detecting changes. - * - * There are two caveats: - * * If `props.isAutosaveable` happens to be false at a time of checking for changes, the check is retried every second. - * * The timer may be disabled by setting `props.disableIntervalChecks` to `true`. In that mode, any change will immediately trigger `props.autosave()`. - */ export class AutosaveMonitor extends Component { constructor( props ) { super( props ); @@ -92,9 +81,23 @@ export class AutosaveMonitor extends Component { } /** - * AutosaveMonitor component. * Monitors the changes made to the edited post and triggers autosave if necessary. * + * The logic is straightforward: a check is performed every `props.interval` seconds. If any changes are detected, `props.autosave()` is called. + * The time between the change and the autosave varies but is no larger than `props.interval` seconds. Refer to the code below for more details, such as + * the specific way of detecting changes. + * + * There are two caveats: + * * If `props.isAutosaveable` happens to be false at a time of checking for changes, the check is retried every second. + * * The timer may be disabled by setting `props.disableIntervalChecks` to `true`. In that mode, any change will immediately trigger `props.autosave()`. + * + * @param {Object} props - The properties passed to the component. + * @param {Function} props.autosave - The function to call when changes need to be saved. + * @param {number} props.interval - The maximum time in seconds between an unsaved change and an autosave. + * @param {boolean} props.isAutosaveable - If false, the check for changes is retried every second. + * @param {boolean} props.disableIntervalChecks - If true, disables the timer and any change will immediately trigger `props.autosave()`. + * @param {boolean} props.isDirty - Indicates if there are unsaved changes. + * * @example * ```jsx *