Documentation
Components
Utilities
For

For

Abstraction for simplest mapping over an array in JSX. Accepts an array in each prop and a function as a child. The function will be called for each item in the array.

Usage

import { For } from '@creation-ui/react'
 
const ForExample = () => {
  const items = ['apple', 'banana', 'cherry']
 
  return (
    <Flex column className='rounded-md bg-primary/10 w-fit p-3' items='center'>
      <For each={items}>{item => <div key={item}>{item}</div>}</For>{' '}
    </Flex>
  )
}

Result:

apple
banana
cherry
FlexShow