@khanacademy/wonder-blocks-timing 4.0.1 → 5.0.0

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @khanacademy/wonder-blocks-timing
 
+## 5.0.0
+
+### Major Changes
+
+-   f72f7dd4: - **[BREAKING CHANGE]** Policy types are now using enums across all APIs
+    -   **[BREAKING CHANGE]** `useScheduledTimeout` has been renamed to `useTimeout` and the original `useTimeout` has been removed. To update existing uses of `useTimeout` to the new API: if `active` was `true` just delete that argument or replace it with `{schedulingPolicy: SchedulingPolicy.Immediately}`; if `active` was `false` replace it with `{schedulingPolicy: SchedulingPolicy.OnDemand}`.
+    -   **[BREAKING CHANGE]** `useScheduledInterval` has been renamed to `useInterval` and the original `useInterval` has been removed. To update existing uses of `useInterval` to the new API: if `active` was `true` just delete that argument or replace it with `{schedulingPolicy: SchedulingPolicy.Immediately}`; if `active` was `false` replace it with `{schedulingPolicy: SchedulingPolicy.OnDemand}`.
+    -   **[NEW]** `useTimeout` now supports an optional `ActionPolicy` in the options. The default is to not reset the timeout when the `action` callback changes. This can be changed to `ActionPolicy.Reset` to reset the timeout when the `action` callback changes (it is recommended that you use `useCallback` on your `action` callback to avoid resetting the timeout everytime a component renders when using the `Reset` policy).
+    -   **[NEW]** `useInterval` now supports an optional `ActionPolicy` in the options. The default is to not reset the interval when the `action` callback changes. This can be changed to `ActionPolicy.Reset` to reset the interval when the `action` callback changes (it is recommended that you use `useCallback` on your `action` callback to avoid resetting the interval everytime a component renders when using the `Reset` policy).
+    -   **[BUGFIX]** `useTimeout` will now correctly reset the timeout when the `set` method is called, as intended.
+    -   **[BUGFIX]** `useInterval` will now correctly reset the interval when the `set` method is called, as intended.
+
+## 4.0.2
+
+### Patch Changes
+
+-   695f2567: Provide a friendly name (for dev tools) for withActionScheduler
+
 ## 4.0.1
 
 ### Patch Changes

package/dist/components/with-action-scheduler.d.ts

@@ -10,5 +10,8 @@ type WithoutActionScheduler<T> = Omit<T, "schedule">;
  * the additional action scheduler prop. To attach the additional prop to
  * these props use the `WithActionScheduler` type.
  */
-export default function withActionScheduler<Props extends WithActionSchedulerProps>(WrappedComponent: React.ComponentType<Props>): (props: WithoutActionScheduler<Props>) => JSX.Element;
+export default function withActionScheduler<Props extends WithActionSchedulerProps>(WrappedComponent: React.ComponentType<Props>): {
+    (props: WithoutActionScheduler<Props>): JSX.Element;
+    displayName: string;
+};
 export {};

package/dist/es/index.js

@@ -1,14 +1,21 @@
 import * as React from 'react';
-import { useRef, useEffect, useState, useCallback } from 'react';
+import { useRef, useEffect, useMemo } from 'react';
 
-const SchedulePolicy = {
-  Immediately: "schedule-immediately",
-  OnDemand: "schedule-on-demand"
-};
-const ClearPolicy = {
-  Resolve: "resolve-on-clear",
-  Cancel: "cancel-on-clear"
-};
+let SchedulePolicy = function (SchedulePolicy) {
+  SchedulePolicy["Immediately"] = "schedule-immediately";
+  SchedulePolicy["OnDemand"] = "schedule-on-demand";
+  return SchedulePolicy;
+}({});
+let ClearPolicy = function (ClearPolicy) {
+  ClearPolicy["Resolve"] = "resolve-on-clear";
+  ClearPolicy["Cancel"] = "cancel-on-clear";
+  return ClearPolicy;
+}({});
+let ActionPolicy = function (ActionPolicy) {
+  ActionPolicy["Reset"] = "reset";
+  ActionPolicy["Passive"] = "passive";
+  return ActionPolicy;
+}({});
 
 class Timeout {
   constructor(action, timeoutMs, schedulePolicy = SchedulePolicy.Immediately) {
@@ -201,121 +208,102 @@ function _extends() {
 }
 
 function withActionScheduler(WrappedComponent) {
-  return props => React.createElement(ActionSchedulerProvider, null, schedule => React.createElement(WrappedComponent, _extends({}, props, {
+  const displayName = `withActionScheduler(${WrappedComponent.displayName || WrappedComponent.name})`;
+  const C = props => React.createElement(ActionSchedulerProvider, null, schedule => React.createElement(WrappedComponent, _extends({}, props, {
     schedule: schedule
   })));
+  C.displayName = displayName;
+  return C;
 }
 
-const useUpdatingRef = value => {
-  const ref = useRef(value);
-  useEffect(() => {
-    ref.current = value;
-  }, [value]);
-  return ref;
-};
-
-function useInterval(action, intervalMs, active) {
-  const actionRef = useUpdatingRef(action);
-  useEffect(() => {
-    if (active) {
-      const intervalId = setInterval(() => {
-        actionRef.current();
-      }, intervalMs);
-      return () => {
-        clearInterval(intervalId);
-      };
-    }
-  }, [intervalMs, active, actionRef]);
-}
-
-function useTimeout(action, timeoutMs, active) {
-  const actionRef = useUpdatingRef(action);
-  useEffect(() => {
-    if (active) {
-      const timeoutId = setTimeout(() => {
-        actionRef.current();
-      }, timeoutMs);
-      return () => {
-        clearTimeout(timeoutId);
-      };
-    }
-  }, [timeoutMs, active, actionRef]);
-}
-
-function useScheduledInterval(action, intervalMs, options) {
-  var _options$schedulePoli;
+function useInterval(action, intervalMs, options = {}) {
+  const {
+    actionPolicy,
+    clearPolicy,
+    schedulePolicy
+  } = options;
+  const actionProxyRef = useRef(action);
+  const intervalRef = useRef(null);
   if (typeof action !== "function") {
     throw new Error("Action must be a function");
   }
-  if (intervalMs < 1) {
-    throw new Error("Interval period must be >= 1");
-  }
-  const schedulePolicy = (_options$schedulePoli = options == null ? void 0 : options.schedulePolicy) != null ? _options$schedulePoli : SchedulePolicy.Immediately;
-  const [isSet, setIsSet] = useState(schedulePolicy === SchedulePolicy.Immediately);
-  const set = useCallback(() => setIsSet(true), []);
-  const actionRef = useUpdatingRef(action);
-  const clear = useCallback(policy => {
-    var _policy;
-    policy = (_policy = policy) != null ? _policy : options == null ? void 0 : options.clearPolicy;
-    if (isSet && policy === ClearPolicy.Resolve) {
-      actionRef.current();
+  if (action !== actionProxyRef.current) {
+    actionProxyRef.current = action;
+    if (actionPolicy === ActionPolicy.Reset) {
+      var _intervalRef$current;
+      (_intervalRef$current = intervalRef.current) == null ? void 0 : _intervalRef$current.set();
     }
-    setIsSet(false);
-  }, [actionRef, isSet, options == null ? void 0 : options.clearPolicy]);
-  const runOnUnmountRef = useUpdatingRef(isSet && (options == null ? void 0 : options.clearPolicy) === ClearPolicy.Resolve);
+  }
   useEffect(() => {
+    intervalRef.current = new Interval(() => {
+      actionProxyRef.current == null ? void 0 : actionProxyRef.current();
+    }, intervalMs, schedulePolicy);
     return () => {
-      if (runOnUnmountRef.current) {
-        actionRef.current();
-      }
+      var _intervalRef$current2;
+      (_intervalRef$current2 = intervalRef.current) == null ? void 0 : _intervalRef$current2.clear(clearPolicy);
+      intervalRef.current = null;
     };
-  }, []);
-  useInterval(action, intervalMs, isSet);
-  return {
-    isSet,
-    set,
-    clear
-  };
+  }, [intervalMs, clearPolicy, schedulePolicy]);
+  const externalApi = useMemo(() => ({
+    set: () => {
+      var _intervalRef$current3;
+      (_intervalRef$current3 = intervalRef.current) == null ? void 0 : _intervalRef$current3.set();
+    },
+    clear: policy => {
+      var _intervalRef$current4;
+      (_intervalRef$current4 = intervalRef.current) == null ? void 0 : _intervalRef$current4.clear(policy);
+    },
+    get isSet() {
+      var _intervalRef$current$, _intervalRef$current5;
+      return (_intervalRef$current$ = (_intervalRef$current5 = intervalRef.current) == null ? void 0 : _intervalRef$current5.isSet) != null ? _intervalRef$current$ : false;
+    }
+  }), []);
+  return externalApi;
 }
 
-function useScheduledTimeout(action, timeoutMs, options) {
-  var _options$schedulePoli;
+function useTimeout(action, timeoutMs, options = {}) {
+  const {
+    actionPolicy,
+    clearPolicy,
+    schedulePolicy
+  } = options;
+  const actionProxyRef = useRef(action);
+  const timeoutRef = useRef(null);
   if (typeof action !== "function") {
     throw new Error("Action must be a function");
   }
-  if (timeoutMs < 0) {
-    throw new Error("Timeout period must be >= 0");
-  }
-  const schedulePolicy = (_options$schedulePoli = options == null ? void 0 : options.schedulePolicy) != null ? _options$schedulePoli : SchedulePolicy.Immediately;
-  const [isSet, setIsSet] = useState(schedulePolicy === SchedulePolicy.Immediately);
-  const set = useCallback(() => setIsSet(true), []);
-  const wrappedAction = useCallback(() => {
-    setIsSet(false);
-    action();
-  }, [action]);
-  const actionRef = useUpdatingRef(wrappedAction);
-  const clear = useCallback(policy => {
-    var _policy;
-    policy = (_policy = policy) != null ? _policy : options == null ? void 0 : options.clearPolicy;
-    if (isSet && policy === ClearPolicy.Resolve) {
-      actionRef.current();
+  if (action !== actionProxyRef.current) {
+    actionProxyRef.current = action;
+    if (actionPolicy === ActionPolicy.Reset) {
+      var _timeoutRef$current;
+      (_timeoutRef$current = timeoutRef.current) == null ? void 0 : _timeoutRef$current.set();
     }
-    setIsSet(false);
-  }, [actionRef, isSet, options == null ? void 0 : options.clearPolicy]);
-  const runOnUnmountRef = useUpdatingRef(isSet && (options == null ? void 0 : options.clearPolicy) === ClearPolicy.Resolve);
+  }
   useEffect(() => {
+    timeoutRef.current = new Timeout(() => {
+      actionProxyRef.current == null ? void 0 : actionProxyRef.current();
+    }, timeoutMs, schedulePolicy);
     return () => {
-      if (runOnUnmountRef.current) {
-        actionRef.current();
-      }
+      var _timeoutRef$current2;
+      (_timeoutRef$current2 = timeoutRef.current) == null ? void 0 : _timeoutRef$current2.clear(clearPolicy);
+      timeoutRef.current = null;
     };
-  }, []);
-  useTimeout(wrappedAction, timeoutMs, isSet);
-  return {
-    isSet,
-    set,
-    clear
-  };
+  }, [timeoutMs, clearPolicy, schedulePolicy]);
+  const externalApi = useMemo(() => ({
+    set: () => {
+      var _timeoutRef$current3;
+      (_timeoutRef$current3 = timeoutRef.current) == null ? void 0 : _timeoutRef$current3.set();
+    },
+    clear: policy => {
+      var _timeoutRef$current4;
+      (_timeoutRef$current4 = timeoutRef.current) == null ? void 0 : _timeoutRef$current4.clear(policy);
+    },
+    get isSet() {
+      var _timeoutRef$current$i, _timeoutRef$current5;
+      return (_timeoutRef$current$i = (_timeoutRef$current5 = timeoutRef.current) == null ? void 0 : _timeoutRef$current5.isSet) != null ? _timeoutRef$current$i : false;
+    }
+  }), []);
+  return externalApi;
 }
 
-export { ActionSchedulerProvider, ClearPolicy, SchedulePolicy, useInterval, useScheduledInterval, useScheduledTimeout, useTimeout, withActionScheduler };
+export { ActionPolicy, ActionSchedulerProvider, ClearPolicy, SchedulePolicy, useInterval, useTimeout, withActionScheduler };

package/dist/hooks/use-interval.d.ts

@@ -1,8 +1,30 @@
+import type { IInterval, HookOptions } from "../util/types";
 /**
- * A simple hook for using `setInterval`.
+ * Hook providing access to a scheduled interval.
  *
- * @param action called every `intervalMs` when `active` is true
- * @param intervalMs the duration between calls to `action`
- * @param active whether or not the interval is active
+ * @param action The action to be invoked each time the interval period has
+ * passed. By default, this will not cause the interval to restart if it
+ * changes. This makes it easier to use with inline lambda functions rather than
+ * requiring consumers to wrap their action in a `useCallback`. To change this
+ * behavior, see the `actionPolicy` option.
+ * @param intervalMs The interval period. If this changes, the interval will
+ * be reset per the `schedulePolicy` option.
+ * @param options Options for the hook.
+ * @param options.actionPolicy Determines how the action is handled when it
+ * changes. By default, the action is replaced but the interval is not reset,
+ * and the updated action will be invoked when the interval next fires.
+ * If you want to reset the interval when the action changes, use
+ * `ActionPolicy.Reset`.
+ * @param options.clearPolicy Determines how the interval is cleared when the
+ * component is unmounted or the interval is recreated. By default, the
+ * interval is cleared immediately. If you want to let the interval run to
+ * completion, use `ClearPolicy.Resolve`. This is NOT applied if the interval
+ * is cleared manually via the `clear()` method on the returned API.
+ * @param options.schedulePolicy Determines when the interval is scheduled.
+ * By default, the interval is scheduled immediately. If you want to delay
+ * scheduling the interval, use `SchedulePolicy.OnDemand`.
+ * @returns An `IInterval` API for interacting with the given interval. This
+ * API is a no-op if called when not mounted. This means that any calls prior
+ * to mounting or after unmounting will not have any effect.
  */
-export declare function useInterval(action: () => unknown, intervalMs: number, active: boolean): void;
+export declare function useInterval(action: () => unknown, intervalMs: number, options?: HookOptions): IInterval;

package/dist/hooks/use-timeout.d.ts

@@ -1,8 +1,30 @@
+import type { ITimeout, HookOptions } from "../util/types";
 /**
- * A simple hook for using `setTimeout`.
+ * Hook providing access to a scheduled timeout.
  *
- * @param action called after `timeoutMs` when `active` is true
- * @param timeoutMs the duration after which `action` is called
- * @param active whether or not the interval is active
+ * @param action The action to be invoked when the timeout period has
+ * passed. By default, this will not cause the timeout to restart if it changes.
+ * This makes it easier to use with inline lambda functions rather than
+ * requiring consumers to wrap their action in a `useCallback`. To change
+ * this behavior, see the `actionPolicy` option.
+ * @param timeoutMs The timeout period. If this changes, the timeout will
+ * be reset per the `schedulePolicy` option.
+ * @param options Options for the hook.
+ * @param options.actionPolicy Determines how the action is handled when it
+ * changes. By default, the action is replaced but the timeout is not reset,
+ * and the updated action will be invoked when the timeout next fires.
+ * If you want to reset the timeout when the action changes, use
+ * `ActionPolicy.Reset`.
+ * @param options.clearPolicy Determines how the timeout is cleared when the
+ * component is unmounted or the timeout is recreated. By default, the
+ * timeout is cleared immediately. If you want to let the timeout run to
+ * completion, use `ClearPolicy.Resolve`. This is NOT applied if the timeout
+ * is cleared manually via the `clear()` method on the returned API.
+ * @param options.schedulePolicy Determines when the timeout is scheduled.
+ * By default, the timeout is scheduled immediately. If you want to delay
+ * scheduling the timeout, use `SchedulePolicy.OnDemand`.
+ * @returns An `ITimeout` API for interacting with the given timeout. This
+ * API is a no-op if called when not mounted. This means that any calls prior
+ * to mounting or after unmounting will not have any effect.
  */
-export declare function useTimeout(action: () => unknown, timeoutMs: number, active: boolean): void;
+export declare function useTimeout(action: () => unknown, timeoutMs: number, options?: HookOptions): ITimeout;

package/dist/index.d.ts

@@ -1,9 +1,6 @@
-import type { IAnimationFrame, IInterval, IScheduleActions, ITimeout, WithActionScheduler, WithActionSchedulerProps, WithoutActionScheduler } from "./util/types";
-export type { IAnimationFrame, IInterval, IScheduleActions, ITimeout, WithActionScheduler, WithActionSchedulerProps, WithoutActionScheduler, };
-export { SchedulePolicy, ClearPolicy } from "./util/policies";
+export type { IAnimationFrame, IInterval, IScheduleActions, ITimeout, WithActionScheduler, WithActionSchedulerProps, WithoutActionScheduler, HookOptions, Options, } from "./util/types";
+export { SchedulePolicy, ClearPolicy, ActionPolicy } from "./util/policies";
 export { default as ActionSchedulerProvider } from "./components/action-scheduler-provider";
 export { default as withActionScheduler } from "./components/with-action-scheduler";
 export { useInterval } from "./hooks/use-interval";
 export { useTimeout } from "./hooks/use-timeout";
-export { useScheduledInterval } from "./hooks/use-scheduled-interval";
-export { useScheduledTimeout } from "./hooks/use-scheduled-timeout";

package/dist/index.js

@@ -24,14 +24,21 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-const SchedulePolicy = {
-  Immediately: "schedule-immediately",
-  OnDemand: "schedule-on-demand"
-};
-const ClearPolicy = {
-  Resolve: "resolve-on-clear",
-  Cancel: "cancel-on-clear"
-};
+let SchedulePolicy = function (SchedulePolicy) {
+  SchedulePolicy["Immediately"] = "schedule-immediately";
+  SchedulePolicy["OnDemand"] = "schedule-on-demand";
+  return SchedulePolicy;
+}({});
+let ClearPolicy = function (ClearPolicy) {
+  ClearPolicy["Resolve"] = "resolve-on-clear";
+  ClearPolicy["Cancel"] = "cancel-on-clear";
+  return ClearPolicy;
+}({});
+let ActionPolicy = function (ActionPolicy) {
+  ActionPolicy["Reset"] = "reset";
+  ActionPolicy["Passive"] = "passive";
+  return ActionPolicy;
+}({});
 
 class Timeout {
   constructor(action, timeoutMs, schedulePolicy = SchedulePolicy.Immediately) {
@@ -224,128 +231,108 @@ function _extends() {
 }
 
 function withActionScheduler(WrappedComponent) {
-  return props => React__namespace.createElement(ActionSchedulerProvider, null, schedule => React__namespace.createElement(WrappedComponent, _extends({}, props, {
+  const displayName = `withActionScheduler(${WrappedComponent.displayName || WrappedComponent.name})`;
+  const C = props => React__namespace.createElement(ActionSchedulerProvider, null, schedule => React__namespace.createElement(WrappedComponent, _extends({}, props, {
     schedule: schedule
   })));
+  C.displayName = displayName;
+  return C;
 }
 
-const useUpdatingRef = value => {
-  const ref = React.useRef(value);
-  React.useEffect(() => {
-    ref.current = value;
-  }, [value]);
-  return ref;
-};
-
-function useInterval(action, intervalMs, active) {
-  const actionRef = useUpdatingRef(action);
-  React.useEffect(() => {
-    if (active) {
-      const intervalId = setInterval(() => {
-        actionRef.current();
-      }, intervalMs);
-      return () => {
-        clearInterval(intervalId);
-      };
-    }
-  }, [intervalMs, active, actionRef]);
-}
-
-function useTimeout(action, timeoutMs, active) {
-  const actionRef = useUpdatingRef(action);
-  React.useEffect(() => {
-    if (active) {
-      const timeoutId = setTimeout(() => {
-        actionRef.current();
-      }, timeoutMs);
-      return () => {
-        clearTimeout(timeoutId);
-      };
-    }
-  }, [timeoutMs, active, actionRef]);
-}
-
-function useScheduledInterval(action, intervalMs, options) {
-  var _options$schedulePoli;
+function useInterval(action, intervalMs, options = {}) {
+  const {
+    actionPolicy,
+    clearPolicy,
+    schedulePolicy
+  } = options;
+  const actionProxyRef = React.useRef(action);
+  const intervalRef = React.useRef(null);
   if (typeof action !== "function") {
     throw new Error("Action must be a function");
   }
-  if (intervalMs < 1) {
-    throw new Error("Interval period must be >= 1");
-  }
-  const schedulePolicy = (_options$schedulePoli = options == null ? void 0 : options.schedulePolicy) != null ? _options$schedulePoli : SchedulePolicy.Immediately;
-  const [isSet, setIsSet] = React.useState(schedulePolicy === SchedulePolicy.Immediately);
-  const set = React.useCallback(() => setIsSet(true), []);
-  const actionRef = useUpdatingRef(action);
-  const clear = React.useCallback(policy => {
-    var _policy;
-    policy = (_policy = policy) != null ? _policy : options == null ? void 0 : options.clearPolicy;
-    if (isSet && policy === ClearPolicy.Resolve) {
-      actionRef.current();
+  if (action !== actionProxyRef.current) {
+    actionProxyRef.current = action;
+    if (actionPolicy === ActionPolicy.Reset) {
+      var _intervalRef$current;
+      (_intervalRef$current = intervalRef.current) == null ? void 0 : _intervalRef$current.set();
     }
-    setIsSet(false);
-  }, [actionRef, isSet, options == null ? void 0 : options.clearPolicy]);
-  const runOnUnmountRef = useUpdatingRef(isSet && (options == null ? void 0 : options.clearPolicy) === ClearPolicy.Resolve);
+  }
   React.useEffect(() => {
+    intervalRef.current = new Interval(() => {
+      actionProxyRef.current == null ? void 0 : actionProxyRef.current();
+    }, intervalMs, schedulePolicy);
     return () => {
-      if (runOnUnmountRef.current) {
-        actionRef.current();
-      }
+      var _intervalRef$current2;
+      (_intervalRef$current2 = intervalRef.current) == null ? void 0 : _intervalRef$current2.clear(clearPolicy);
+      intervalRef.current = null;
     };
-  }, []);
-  useInterval(action, intervalMs, isSet);
-  return {
-    isSet,
-    set,
-    clear
-  };
+  }, [intervalMs, clearPolicy, schedulePolicy]);
+  const externalApi = React.useMemo(() => ({
+    set: () => {
+      var _intervalRef$current3;
+      (_intervalRef$current3 = intervalRef.current) == null ? void 0 : _intervalRef$current3.set();
+    },
+    clear: policy => {
+      var _intervalRef$current4;
+      (_intervalRef$current4 = intervalRef.current) == null ? void 0 : _intervalRef$current4.clear(policy);
+    },
+    get isSet() {
+      var _intervalRef$current$, _intervalRef$current5;
+      return (_intervalRef$current$ = (_intervalRef$current5 = intervalRef.current) == null ? void 0 : _intervalRef$current5.isSet) != null ? _intervalRef$current$ : false;
+    }
+  }), []);
+  return externalApi;
 }
 
-function useScheduledTimeout(action, timeoutMs, options) {
-  var _options$schedulePoli;
+function useTimeout(action, timeoutMs, options = {}) {
+  const {
+    actionPolicy,
+    clearPolicy,
+    schedulePolicy
+  } = options;
+  const actionProxyRef = React.useRef(action);
+  const timeoutRef = React.useRef(null);
   if (typeof action !== "function") {
     throw new Error("Action must be a function");
   }
-  if (timeoutMs < 0) {
-    throw new Error("Timeout period must be >= 0");
-  }
-  const schedulePolicy = (_options$schedulePoli = options == null ? void 0 : options.schedulePolicy) != null ? _options$schedulePoli : SchedulePolicy.Immediately;
-  const [isSet, setIsSet] = React.useState(schedulePolicy === SchedulePolicy.Immediately);
-  const set = React.useCallback(() => setIsSet(true), []);
-  const wrappedAction = React.useCallback(() => {
-    setIsSet(false);
-    action();
-  }, [action]);
-  const actionRef = useUpdatingRef(wrappedAction);
-  const clear = React.useCallback(policy => {
-    var _policy;
-    policy = (_policy = policy) != null ? _policy : options == null ? void 0 : options.clearPolicy;
-    if (isSet && policy === ClearPolicy.Resolve) {
-      actionRef.current();
+  if (action !== actionProxyRef.current) {
+    actionProxyRef.current = action;
+    if (actionPolicy === ActionPolicy.Reset) {
+      var _timeoutRef$current;
+      (_timeoutRef$current = timeoutRef.current) == null ? void 0 : _timeoutRef$current.set();
     }
-    setIsSet(false);
-  }, [actionRef, isSet, options == null ? void 0 : options.clearPolicy]);
-  const runOnUnmountRef = useUpdatingRef(isSet && (options == null ? void 0 : options.clearPolicy) === ClearPolicy.Resolve);
+  }
   React.useEffect(() => {
+    timeoutRef.current = new Timeout(() => {
+      actionProxyRef.current == null ? void 0 : actionProxyRef.current();
+    }, timeoutMs, schedulePolicy);
     return () => {
-      if (runOnUnmountRef.current) {
-        actionRef.current();
-      }
+      var _timeoutRef$current2;
+      (_timeoutRef$current2 = timeoutRef.current) == null ? void 0 : _timeoutRef$current2.clear(clearPolicy);
+      timeoutRef.current = null;
     };
-  }, []);
-  useTimeout(wrappedAction, timeoutMs, isSet);
-  return {
-    isSet,
-    set,
-    clear
-  };
+  }, [timeoutMs, clearPolicy, schedulePolicy]);
+  const externalApi = React.useMemo(() => ({
+    set: () => {
+      var _timeoutRef$current3;
+      (_timeoutRef$current3 = timeoutRef.current) == null ? void 0 : _timeoutRef$current3.set();
+    },
+    clear: policy => {
+      var _timeoutRef$current4;
+      (_timeoutRef$current4 = timeoutRef.current) == null ? void 0 : _timeoutRef$current4.clear(policy);
+    },
+    get isSet() {
+      var _timeoutRef$current$i, _timeoutRef$current5;
+      return (_timeoutRef$current$i = (_timeoutRef$current5 = timeoutRef.current) == null ? void 0 : _timeoutRef$current5.isSet) != null ? _timeoutRef$current$i : false;
+    }
+  }), []);
+  return externalApi;
 }
 
+exports.ActionPolicy = ActionPolicy;
 exports.ActionSchedulerProvider = ActionSchedulerProvider;
 exports.ClearPolicy = ClearPolicy;
 exports.SchedulePolicy = SchedulePolicy;
 exports.useInterval = useInterval;
-exports.useScheduledInterval = useScheduledInterval;
-exports.useScheduledTimeout = useScheduledTimeout;
 exports.useTimeout = useTimeout;
 exports.withActionScheduler = withActionScheduler;

package/dist/util/animation-frame.d.ts

@@ -1,4 +1,5 @@
-import type { IAnimationFrame, SchedulePolicy, ClearPolicy } from "./types";
+import { SchedulePolicy, ClearPolicy } from "./policies";
+import type { IAnimationFrame } from "./types";
 /**
  * Encapsulates everything associated with calling requestAnimationFrame/
  * cancelAnimationFrame, and managing the lifecycle of that request, including
@@ -15,8 +16,8 @@ export default class AnimationFrame implements IAnimationFrame {
      * Creates an animation frame request that will invoke the given action.
      * The request is not made until set is called.
      *
-     * @param {(time: DOMHighResTimeStamp) => mixed} action The action to be invoked.
-     * @param {SchedulePolicy} [schedulePolicy] When SchedulePolicy.Immediately,
+     * @param  action The action to be invoked.
+     * @param [schedulePolicy] When SchedulePolicy.Immediately,
      * the interval is set immediately on instantiation; otherwise, `set` must be
      * called to set the interval.
      * Defaults to `SchedulePolicy.Immediately`.
@@ -47,15 +48,14 @@ export default class AnimationFrame implements IAnimationFrame {
      * If the request is pending, this cancels that pending request without
      * invoking the action. If no request is pending, this does nothing.
      *
-     * @param {ClearPolicy} [policy] When ClearPolicy.Resolve, if the request
+     * @param [policy] When ClearPolicy.Resolve, if the request
      * was set when called, the request action is invoked after cancelling
      * the request; otherwise, the pending action is cancelled.
      * Defaults to `ClearPolicy.Cancel`.
-     * @param {DOMHighResTimeStamp} [time] Timestamp to pass to the action when
+     * @param [time] Timestamp to pass to the action when
      * ClearPolicy.Resolve is specified. Ignored when ClearPolicy.Cancel is
      * specified.
      *
-     * @returns {void}
      * @memberof AnimationFrame
      */
     clear(policy?: ClearPolicy, time?: DOMHighResTimeStamp): void;