@carbon/ibm-products/lib/components/ScrollGradient/constants.js

Carbon for IBM Products

/**
 * Copyright IBM Corp. 2020, 2025
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */

'use strict';

var React = require('react');

const ScrollStates = {
  // No scrolling required because content fits within container.
  NONE: 'NONE'};

// FUNCTIONS

const useIsOverflow = ref => {
  const [isHorizontallyScrollable, setIsHorizontallyScrollable] = React.useState();
  const [isVerticallyScrollable, setIsVerticallyScrollable] = React.useState();
  const [mutationObserver, setMutationObserver] = React.useState();
  const [resizeObserver, setResizeObserver] = React.useState();
  const checkOverflow = React.useCallback(() => {
    if (!ref.current) {
      return;
    }
    setIsHorizontallyScrollable(ref.current.scrollWidth > ref.current.clientWidth);
    setIsVerticallyScrollable(ref.current.scrollHeight > ref.current.clientHeight);
  }, [ref]);
  React.useEffect(() => {
    if (!mutationObserver) {
      return;
    }
    return () => {
      if (mutationObserver) {
        mutationObserver.disconnect();
      }
      if (resizeObserver) {
        resizeObserver.disconnect();
      }
    };
  });
  React.useLayoutEffect(() => {
    const {
      current
    } = ref;
    if (current) {
      if ('ResizeObserver' in window && !resizeObserver) {
        setResizeObserver(new ResizeObserver(checkOverflow).observe(current));
      }
      if ('MutationObserver' in window && !mutationObserver) {
        setMutationObserver(new MutationObserver(checkOverflow).observe(current, {
          attributes: false,
          childList: true,
          subtree: false
        }));
      }
      checkOverflow();
    }
  }, [ref, checkOverflow, mutationObserver, resizeObserver]);
  return {
    xScrollable: isHorizontallyScrollable,
    yScrollable: isVerticallyScrollable
  };
};

exports.ScrollStates = ScrollStates;
exports.useIsOverflow = useIsOverflow;