import * as React from 'react';
import * as Lifesupport from '@moonwalker/lifesupport';

export as namespace Skylab;

/**
 * Component interfaces
 */
export interface IRenderItemProps {
  key: string;
  to: string;
  children: React.ReactNode;
}

export interface IMenuProps extends React.Props<React.Component> {
  className?: string;
  slug: string;
  as?: React.ReactType;
  itemControlCapsule?: string;
  renderItem?: (itemProps: IRenderItemProps, item: Lifesupport.MenuListItem) => React.ReactElement;
}

export interface IMenuComponentProps extends IMenuProps {
  locale: string;
  authenticated: boolean;
  isClientRender: boolean;
  itemControlMap: object;
  menu: Lifesupport.Menu;
}

export const Menu: (props: IMenuProps) => React.ReactElement;

export interface IDynamicContentProps {
  as?: React.ReactType;
  className?: string;
  children: string;
  args?: object;
  components?: object;
  loading?: string;
}

export const DynamicContent: (props: IDynamicContentProps) => React.ReactElement;

interface Asset {
  file?: {
    url?: string;
  };
}

export interface ImgComponentProps {
  image?: Asset | Array<Asset> | null;
  transform?: Lifesupport.CdnImageUrlOptions;
  imgRef?: React.Ref<HTMLImageElement>;
  getImageUrl: ReturnType<typeof Lifesupport.useCdn>['getImageUrl'];
}

export type ImgProps = Omit<ImgComponentProps, 'getImageUrl'>;