Disabling the mouse drag sliding feature for the carousel component

[Sigabiel]

It would be amazing to toggle the ability of users being able to interact with the carousel completely.

Currently, you can only toggle the indicators and control icons of the carousel component. If it was possible to stop the user from being able to drag the component to the right or left to switch slides, my problems would be solved. It would be an only automatic carousel which presents the contents independent of user inputs, which is exactly what I need.

Nevertheless, the user still needs to interact with the carousel contents. Currently, that's easy to accomplish using the pauseOnHover flag.

I was told to write my request here, because a flag like this doesn't seem to exist currently.

[farid-teymouri]

 * Disables all mouse and keyboard interactions on the page.
 */
function disableInteractions() {
    document.body.style.pointerEvents = "none"; // Disable all pointer events
    document.body.style.userSelect = "none"; // Prevent text selection
    window.addEventListener("keydown", preventKeyboardActions, true); // Intercept keyboard events
}

/**
 * Restores all mouse and keyboard interactions on the page.
 */
function enableInteractions() {
    document.body.style.pointerEvents = ""; // Re-enable pointer events
    document.body.style.userSelect = ""; // Allow text selection
    window.removeEventListener("keydown", preventKeyboardActions, true); // Remove keyboard event listener
}

/**
 * Prevents default actions for all keyboard events.
 *
 * @param {KeyboardEvent} event - The keyboard event to intercept.
 */
function preventKeyboardActions(event) {
    event.preventDefault(); // Prevent default action
    event.stopPropagation(); // Stop the event from propagating
}

/**
 * Navigates to the specified slide position in the carousel and adjusts the height of the container
 * based on the slide position.
 *
 * @param {number} position - The index of the slide to navigate to.
 */
function goToSlide(position) {
    // Disable interactions
    disableInteractions();

    // Perform the slide navigation
    if (carousel.value) {
        carousel.value.slideTo(position);
    }

    // Simulate delay (e.g., for animation completion) before re-enabling interactions
    setTimeout(() => {
        enableInteractions(); // Re-enable interactions
    }, 1000); // Adjust delay as needed
}


Usage : `goToSlide(2)` // goToSlide(1)