How to use the use-memo-one.useMemoOne function in use-memo-one

To help you get started, we’ve selected a few use-memo-one examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github atlassian / react-beautiful-dnd / src / view / use-drag-handle / use-drag-handle.js View on Github external
}

      // Do not drag if anything else in the system is dragging
      if (!canLift(draggableId)) {
        return false;
      }

      // Check if we are dragging an interactive element
      return shouldAllowDraggingFromTarget(event, canDragInteractiveElements);
    },
    [canDragInteractiveElements, canLift, draggableId, isEnabled],
  );

  const { onBlur, onFocus } = useFocusRetainer(args);

  const mouseArgs: MouseSensorArgs = useMemoOne(
    () => ({
      callbacks,
      getDraggableRef,
      getWindow,
      canStartCapturing,
      onCaptureStart,
      onCaptureEnd,
      getShouldRespectForcePress,
    }),
    [
      callbacks,
      getDraggableRef,
      getWindow,
      canStartCapturing,
      onCaptureStart,
      onCaptureEnd,
github atlassian / react-beautiful-dnd / src / view / use-drag-handle / use-drag-handle.js View on Github external
);
      callbacks.onCancel();
    }
  }

  // Handle aborting
  // No longer dragging but still capturing: need to abort
  // Using a layout effect to ensure that there is a flip from isDragging => !isDragging
  // When there is a pending drag !isDragging will always be true
  useIsomorphicLayoutEffect(() => {
    if (!isDragging && capturingRef.current) {
      abortCapture();
    }
  }, [abortCapture, isDragging]);

  const props: ?DragHandleProps = useMemoOne(() => {
    if (!isEnabled) {
      return null;
    }
    return {
      onMouseDown,
      onKeyDown,
      onTouchStart,
      onFocus,
      onBlur,
      tabIndex: 0,
      'data-react-beautiful-dnd-drag-handle': styleContext,
      // English default. Consumers are welcome to add their own start instruction
      'aria-roledescription': 'Draggable item. Press space bar to lift',
      // Opting out of html5 drag and drops
      draggable: false,
      onDragStart: preventHtml5Dnd,
github alloc / wana / src / ui / useDerived.ts View on Github external
export function useDerived(compute: () => T, deps = emptyArray) {
  const state = useMemo(() => ({}), deps)
  const derived = useMemo(
    () =>
      derive(auto => {
        const observer = auto.start(compute)
        try {
          var result = compute()
        } finally {
          auto.stop()
        }
        if (state.mounted) {
          auto.commit(observer)
        } else {
          state.auto = auto
          state.observer = observer
          state.nonce = observer.nonce
        }
github atlassian / react-beautiful-dnd / src / view / use-drag-handle / use-drag-handle.js View on Github external
canStartCapturing,
      onCaptureStart,
      onCaptureEnd,
    }),
    [
      callbacks,
      canStartCapturing,
      getDraggableRef,
      getWindow,
      onCaptureEnd,
      onCaptureStart,
    ],
  );
  const onKeyDown = useKeyboardSensor(keyboardArgs);

  const touchArgs: TouchSensorArgs = useMemoOne(
    () => ({
      callbacks,
      getDraggableRef,
      getWindow,
      canStartCapturing,
      getShouldRespectForcePress,
      onCaptureStart,
      onCaptureEnd,
    }),
    [
      callbacks,
      getDraggableRef,
      getWindow,
      canStartCapturing,
      getShouldRespectForcePress,
      onCaptureStart,
github wcandillon / react-native-redash / src / Transitions.ts View on Github external
export const useSpringTransition = (
  state: boolean,
  config: SpringConfig = {}
) => {
  const value = useMemoOne(() => new Value(0), []);
  useCode(() => set(value, bin(state)), [state, value]);
  const transition = useMemoOne(() => withSpringTransition(value, config), [
    config,
    value
  ]);
  return transition;
};
github wcandillon / react-native-redash / src / Transitions.ts View on Github external
export const useSpringTransition = (
  state: boolean,
  config: SpringConfig = {}
) => {
  const value = useMemoOne(() => new Value(0), []);
  useCode(() => set(value, bin(state)), [state, value]);
  const transition = useMemoOne(() => withSpringTransition(value, config), [
    config,
    value
  ]);
  return transition;
};
github atlassian / react-beautiful-dnd / src / view / use-droppable-responders / use-droppable-responders.js View on Github external
export default function useDroppableResponders() {
  const cacheRef = useRef({});

  const register = useCallbackOne(
    (id: DroppableId, getResponders: GetResponders) => {
      cacheRef.current[id] = getResponders;
    },
    [],
  );

  const unregister = useCallbackOne((id: DroppableId) => {
    delete cacheRef.current[id];
  }, []);

  const registration: DroppableResponderRegistration = useMemoOne(
    () => ({
      register,
      unregister,
    }),
    [register, unregister],
  );

  const getDroppableResponders = useCallbackOne((id: DroppableId) => {
    const getResponders: ?GetResponders = cacheRef.current[id];

    invariant(getResponders, `Could not find droppable reponder for id: ${id}`);

    return getResponders();
  }, []);

  const result: Result = useMemoOne(
github atlassian / react-beautiful-dnd / src / view / use-drag-handle / sensor / use-touch-sensor.js View on Github external
onCaptureEnd,
  } = args;
  const pendingRef = useRef(null);
  const isDraggingRef = useRef(false);
  const hasMovedRef = useRef(false);
  const unbindWindowEventsRef = useRef<() => void>(noop);
  const getIsCapturing = useCallbackOne(
    () => Boolean(pendingRef.current || isDraggingRef.current),
    [],
  );
  const postDragClickPreventer: EventPreventer = useMemoOne(
    () => createPostDragEventPreventer(getWindow),
    [getWindow],
  );

  const schedule = useMemoOne(() => {
    invariant(
      !getIsCapturing(),
      'Should not recreate scheduler while capturing',
    );
    return createScheduler(callbacks);
  }, [callbacks, getIsCapturing]);

  const stop = useCallbackOne(() => {
    if (!getIsCapturing()) {
      return;
    }

    schedule.cancel();
    unbindWindowEventsRef.current();
    touchStartMarshal.reset();
    webkitHack.releaseTouchMove();
github atlassian / react-beautiful-dnd / src / view / use-droppable-responders / use-droppable-responders.js View on Github external
() => ({
      register,
      unregister,
    }),
    [register, unregister],
  );

  const getDroppableResponders = useCallbackOne((id: DroppableId) => {
    const getResponders: ?GetResponders = cacheRef.current[id];

    invariant(getResponders, `Could not find droppable reponder for id: ${id}`);

    return getResponders();
  }, []);

  const result: Result = useMemoOne(
    () => ({
      registration,
      getDroppableResponders,
    }),
    [registration, getDroppableResponders],
  );

  return result;
}
github wcandillon / can-it-be-done-in-react-native / the-5-min / src / Accordion / AnimationHelpers.ts View on Github external
export const useTransition = <
  T extends typeof withSpringTransition | typeof withTimingTransition
>(
  state: boolean,
  config: Parameters[1],
  withTransition: T
) => {
  const value = useMemoOne(() => new Value(0), []);
  useCode(set(value, bin(state)), [state]);
  const transition = useMemoOne(() => withTransition(value, config), []);
  return transition;
};

use-memo-one

useMemo and useCallback but with a stable cache

MIT
Latest version published 2 years ago

Package Health Score

67 / 100
Full package analysis