colouring-montreal/app/src/frontend/components/with-separator.tsx
2021-01-28 03:20:01 +00:00

21 lines
590 B
TypeScript

import React from 'react';
// adapted from https://github.com/LinusU/react-with-separator
function createSeparator(separator: any, idx: number) {
if (typeof separator == 'string') {
return separator;
}
return React.cloneElement(separator, { key: 'sep-' + idx});
}
export const WithSeparator: React.FC<{ separator: any}> = ({ separator, children }) => {
const childrenArr = React.Children.toArray(children);
for(let i=1; i < childrenArr.length; i += 2) {
childrenArr.splice(i, 0, createSeparator(separator, i))
}
return <>{childrenArr}</>;
}