



// <TabContainer>

//         <TabList>

//                 <Tab></Tab>
//                 <Tab></Tab>
//                 <Tab></Tab>

//         </TabList>

//         <TabContent>

//                 <TabPanel></TabPanel>
//                 <TabPanel></TabPanel>

//         </TabContent>

// </TabContainer>

// AccessNavigation(TabContainer, useTab({

// }));



export const useTab = (props)=>{
    
    return {
        tablistProps: {
            "role" : "tablist",
            "aria-label" : props.ariaLabel
        },
        tabProps : {
            "role" : "tab",
            "aria-selected" : props.ariaSelected,
            "tabindex" : props.tabindex,
            "aria-controls" : props.ariaControls
        },
        tabpanelProps : {
            "role" : "tabpanel",
            "aria-labelledby" : props.ariaLabelledby,
            "tabindex" : props.tabindex
        }
    }

}


// let { tablistProps, tabProps, tabpanelProps } = useTab(props);


export const useRadio = ()=>{

    return {
        group : { role :"radiogroup" },
        item :  { role :"radio" }
    }
}

export const useCheckbox = ()=>{

    return {
        group : { role :"group" },
        item :  { role :"checkbox" }
    }
}