import React from 'react';

import { NestedNavigation as CoreNestedNavigation } from '@shoptet/ui-core-web';
import type { Exact, SafeOmit } from '@shoptet/utils';

import { NestedNavigationItem } from './NestedNavigationItem';

export interface NestedNavigationListProps extends SafeOmit<React.HTMLAttributes<HTMLUListElement>, 'className'> {}

export const NestedNavigationList = Object.assign(
  function NestedNavigationList({ children, ...rest }: NestedNavigationListProps) {
    rest satisfies Exact<SafeOmit<NestedNavigationListProps, 'children'>, typeof rest>;

    return (
      <CoreNestedNavigation.List {...rest} className='nestedNavigationList'>
        {children}
      </CoreNestedNavigation.List>
    );
  },
  {
    Item: NestedNavigationItem,
  }
);