import { getIntrinsicElementProps, useEventCallback, slot } from '@fluentui/react-utilities';
import * as React from 'react';
import { Collapse } from '@fluentui/react-motion-components-preview';
import { createCheckedItems } from '../utils/createCheckedItems';
import { treeDataTypes } from '../utils/tokens';
import { createNextOpenItems } from './useControllableOpenItems';
import { ImmutableSet } from '../utils/ImmutableSet';
import { ImmutableMap } from '../utils/ImmutableMap';
/**
 * Create the state required to render the root level tree.
 *
 * @param props - props from this instance of tree
 * @param ref - reference to root HTMLElement of tree
 */ export function useRootTree(props, ref) {
    warnIfNoProperPropsRootTree(props);
    const { appearance = 'subtle', size = 'medium', selectionMode = 'none' } = props;
    const openItems = React.useMemo(()=>ImmutableSet.from(props.openItems), [
        props.openItems
    ]);
    const checkedItems = React.useMemo(()=>createCheckedItems(props.checkedItems), [
        props.checkedItems
    ]);
    const requestOpenChange = (request)=>{
        var _props_onOpenChange;
        (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, request.event, {
            ...request,
            openItems: ImmutableSet.dangerouslyGetInternalSet(createNextOpenItems(request, openItems))
        });
    };
    const requestCheckedChange = (request)=>{
        var _props_onCheckedChange;
        if (selectionMode === 'none') {
            return;
        }
        (_props_onCheckedChange = props.onCheckedChange) === null || _props_onCheckedChange === void 0 ? void 0 : _props_onCheckedChange.call(props, request.event, {
            ...request,
            selectionMode,
            checkedItems: ImmutableMap.dangerouslyGetInternalMap(checkedItems)
        });
    };
    const requestNavigation = (request)=>{
        var _props_onNavigation;
        let isScrollPrevented = false;
        (_props_onNavigation = props.onNavigation) === null || _props_onNavigation === void 0 ? void 0 : _props_onNavigation.call(props, request.event, {
            ...request,
            preventScroll: ()=>{
                isScrollPrevented = true;
            },
            isScrollPrevented: ()=>isScrollPrevented
        });
        switch(request.type){
            case treeDataTypes.ArrowDown:
            case treeDataTypes.ArrowUp:
            case treeDataTypes.Home:
            case treeDataTypes.End:
                // stop the default behavior of the event
                // which is to scroll the page
                request.event.preventDefault();
        }
    };
    const requestTreeResponse = useEventCallback((request)=>{
        switch(request.requestType){
            case 'navigate':
                return requestNavigation(request);
            case 'open':
                return requestOpenChange(request);
            case 'selection':
                return requestCheckedChange(request);
        }
    });
    return {
        components: {
            root: 'div',
            // TODO: remove once React v18 slot API is modified
            // This is a problem at the moment due to UnknownSlotProps assumption
            // that `children` property is `ReactNode`, which in this case is not valid
            // as PresenceComponentProps['children'] is `ReactElement`
            collapseMotion: Collapse
        },
        contextType: 'root',
        selectionMode,
        open: true,
        appearance,
        size,
        level: 1,
        openItems,
        checkedItems,
        requestTreeResponse,
        root: slot.always(getIntrinsicElementProps('div', {
            // FIXME:
            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
            // but since it would be a breaking change to fix it, we are casting ref to it's proper type
            ref: ref,
            role: 'tree',
            'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,
            ...props
        }), {
            elementType: 'div'
        }),
        collapseMotion: undefined
    };
}
function warnIfNoProperPropsRootTree(props) {
    if (process.env.NODE_ENV === 'development') {
        if (!props['aria-label'] && !props['aria-labelledby']) {
            // eslint-disable-next-line no-console
            console.warn(`@fluentui/react-tree [useRootTree]:
Tree must have either a \`aria-label\` or \`aria-labelledby\` property defined`);
        }
    }
}