Function TabListInner

packages/react-aria-components/src/Tabs.tsx:343–386

({props, forwardedRef: ref}: TabListInnerProps<T>)

}

function TabListInner<T>({props, forwardedRef: ref}: TabListInnerProps<T>) {
  let state = useContext(TabListStateContext)!;
  let {CollectionRoot} = useContext(CollectionRendererContext);
  let {orientation = 'horizontal', keyboardActivation = 'automatic'} =
    useSlottedContext(TabsContext)!;
  let objectRef = useObjectRef(ref);

  let {tabListProps} = useTabList(
    {
      ...props,
      orientation,
      keyboardActivation
    },
    state,
    objectRef
  );

  let renderProps = useRenderProps({
    ...props,
    children: null,
    defaultClassName: 'react-aria-TabList',
    values: {
      orientation,
      state
    }
  });

  let DOMProps = filterDOMProps(props, {global: true});
  delete DOMProps.id;

  return (
    <dom.div
      {...mergeProps(DOMProps, renderProps, tabListProps)}
      ref={objectRef}
      data-orientation={orientation || undefined}>
      <SharedElementTransition>
        <CollectionRoot
          collection={state.collection}
          persistedKeys={usePersistedKeys(state.selectionManager.focusedKey)}
        />
      </SharedElementTransition>
    </dom.div>
  );
}

class TabItemNode extends CollectionNode<unknown> {
  static readonly type = 'item';