import React from 'react';
import styled from '@modern-js/runtime/styled';
import { uuid } from '@/utils/uuid';

const ContentWrap = styled.div`
  .contentItem {
  }

  .contentContainer {
    display: flex;
    position: fixed;
    right: 0;
    top: 0;
  }
`;

const RightContent: React.FC<{ contents: React.ReactNode[] }> = ({
  contents,
}) => {
  return (
    <ContentWrap>
      <div className="contentContainer">
        {contents.map(item => (
          <div className="contentItem" key={`RightContent${uuid()}`}>
            {item}
          </div>
        ))}
      </div>
    </ContentWrap>
  );
};

export default RightContent;
