spec

Elemental Design Specification

struct MessageRow: View {
    let message: Message


    var body: some View {
        HStack {
            ZStack {
                Circle()
                    .fill(Color.yellow)
                Text(message.initials)
            }


            Text(message.content)
        }
    }
}

const HStack = () => ...;
const ZStack = () => ...;
const Circle = () => ...;
const Text = () => ...;

const MessageRow = ({ message }) => {
  return (
    <HStack>
      <ZStack>
        <Circle fill="yellow" />
        <Text>{message.initials}</Text>
      </ZStack>
      <Text>
        {message.content}
      </Text>
    </HStack>
  );
}