How to use the @zendeskgarden/container-utilities.useCombinedRefs function in @zendeskgarden/container-utilities

({ children, inputRef: controlledInputRef, ...props }, ref) => {
    const {
      popperReferenceElementRef,
      downshift: { getToggleButtonProps, getInputProps, isOpen }
    } = useDropdownContext();
    const { isLabelHovered } = useFieldContext();
    const inputRef = useCombinedRefs(controlledInputRef);
    const triggerRef = useCombinedRefs(ref);
    const previousIsOpenRef = useRef(undefined);
    const [isFocused, setIsFocused] = useState(false);

    useEffect(() => {
      // Focus internal input when Menu is opened
      if (isOpen && !previousIsOpenRef.current) {
        inputRef.current && inputRef.current.focus();
      }

      // Focus trigger when Menu is closed
      if (!isOpen && previousIsOpenRef.current) {
        triggerRef.current && triggerRef.current.focus();
      }
      previousIsOpenRef.current = isOpen;
    }, [isOpen, inputRef, triggerRef]);

const Range = React.forwardRef(({ min, max, step, ...props }, ref) => {
  const [backgroundSize, setBackgroundSize] = useState(0);
  const rangeRef = useCombinedRefs(ref);
  const { getInputProps } = useFieldContext();

  const updateBackgroundWidthFromInput = useCallback(
    rangeTarget => {
      let relativeMax = max;
      const { value } = rangeTarget;

      if (parseFloat(relativeMax) < parseFloat(min)) {
        relativeMax = 100;
      }

      const percentage = (100 * (value - min)) / (relativeMax - min);

      setBackgroundSize(`${percentage}%`);
    },
    /* eslint-disable-next-line react-hooks/exhaustive-deps */

({ children, inputRef: controlledInputRef, ...props }, ref) => {
    const {
      popperReferenceElementRef,
      downshift: { getToggleButtonProps, getInputProps, isOpen }
    } = useDropdownContext();
    const { isLabelHovered } = useFieldContext();
    const inputRef = useCombinedRefs(controlledInputRef);
    const triggerRef = useCombinedRefs(ref);
    const previousIsOpenRef = useRef(undefined);
    const [isFocused, setIsFocused] = useState(false);

    useEffect(() => {
      // Focus internal input when Menu is opened
      if (isOpen && !previousIsOpenRef.current) {
        inputRef.current && inputRef.current.focus();
      }

      // Focus trigger when Menu is closed
      if (!isOpen && previousIsOpenRef.current) {
        triggerRef.current && triggerRef.current.focus();
      }
      previousIsOpenRef.current = isOpen;
    }, [isOpen, inputRef, triggerRef]);

const {
      popperReferenceElementRef,
      selectedItems = [],
      containsMultiselectRef,
      downshift: {
        getToggleButtonProps,
        getInputProps,
        isOpen,
        closeMenu,
        inputValue,
        setState: setDownshiftState,
        itemToString
      }
    } = useDropdownContext();
    const { isLabelHovered } = useFieldContext();
    const inputRef = useCombinedRefs(externalInputRef);
    const triggerRef = useCombinedRefs(popperReferenceElementRef, ref);
    const blurTimeoutRef = useRef();
    const previousIsOpenRef = useRef(undefined);
    const [isFocused, setIsFocused] = useState(false);
    const [focusedItem, setFocusedItem] = useState(undefined);

    const { getContainerProps, getItemProps } = useSelection({
      rtl: isRtl(props),
      focusedItem,
      selectedItem: undefined,
      onFocus: (item: any) => {
        setFocusedItem(item);
      }
    });

    useEffect(() => {

({ wrapperProps = {}, start, end, disabled, ...props }, forwardedRef) => {
    const { getInputProps } = useFieldContext();
    const inputRef = useCombinedRefs(forwardedRef);

    const { onClick, ...otherWrapperProps } = wrapperProps;

    const onFauxInputClickHandler = composeEventHandlers(onClick, () => {
      inputRef.current && inputRef.current.focus();
    });

    return (

popperReferenceElementRef,
      selectedItems = [],
      containsMultiselectRef,
      downshift: {
        getToggleButtonProps,
        getInputProps,
        isOpen,
        closeMenu,
        inputValue,
        setState: setDownshiftState,
        itemToString
      }
    } = useDropdownContext();
    const { isLabelHovered } = useFieldContext();
    const inputRef = useCombinedRefs(externalInputRef);
    const triggerRef = useCombinedRefs(popperReferenceElementRef, ref);
    const blurTimeoutRef = useRef();
    const previousIsOpenRef = useRef(undefined);
    const [isFocused, setIsFocused] = useState(false);
    const [focusedItem, setFocusedItem] = useState(undefined);

    const { getContainerProps, getItemProps } = useSelection({
      rtl: isRtl(props),
      focusedItem,
      selectedItem: undefined,
      onFocus: (item: any) => {
        setFocusedItem(item);
      }
    });

    useEffect(() => {
      containsMultiselectRef.current = true;

({ disabled, item, ...otherProps }, ref) => {
    const tabsPropGetters = useTabsContext();
    const focusRef = useCombinedRefs(ref);

    if (disabled || !tabsPropGetters) {
      return ;
    }

    return (
      
    );