import React from 'react';
import { SRow } from '../../s-components/layout/s-row';
import { TCssRules } from '../../types';

type TProps = TCssRules & {
  children: React.ReactNode;
};

export const MediaBody: React.FC<TProps> = props => {
  const renderChildren = (node: any /*, i*/) => {
    return React.cloneElement<any>(node as any, {
      flexGrow: 1,
      flexBasis: 'auto',
      flexShrink: 1,
    });

    // return node;
  };

  const { children, ...css } = props;

  return <SRow {...css}>{React.Children.map(children, renderChildren)}</SRow>;
};
