group_work

Usage

Import


import { ExpandableList,  ExpandableListItem } from '@passfort/castle'
content_copyCopy

Example


<ExpandableList>
    <ExpandableListItem
        renderTitle={() => <Text bold>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
      <ExpandableListItem
        renderTitle={() => <Text bold>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
      <ExpandableListItem
        renderTitle={() => <Text bold>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
</ExpandableList><ExpandableList>
    <ExpandableListItem
        renderTitle={() => <Text bold>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
      <ExpandableListItem
        renderTitle={() => <Text bold>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
      <ExpandableListItem
        renderTitle={() => <Text bold>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
</ExpandableList>
content_copyCopy
live example

Multiple Groups


<Stack spacing={4}>

<ExpandableList>
    <ExpandableListItem
        renderTitle={() => <Text>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
      <ExpandableListItem
        renderTitle={() => <Text>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
      <ExpandableListItem
        renderTitle={() => <Text>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
</ExpandableList>

<ExpandableList>
    <ExpandableListItem
        renderTitle={() => <Text>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
      <ExpandableListItem
        renderTitle={() => <Text>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
      <ExpandableListItem
        renderTitle={() => <Text>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
</ExpandableList>
</Stack><Stack spacing={4}>

<ExpandableList>
    <ExpandableListItem
        renderTitle={() => <Text>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
      <ExpandableListItem
        renderTitle={() => <Text>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
      <ExpandableListItem
        renderTitle={() => <Text>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
</ExpandableList>

<ExpandableList>
    <ExpandableListItem
        renderTitle={() => <Text>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
      <ExpandableListItem
        renderTitle={() => <Text>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
      <ExpandableListItem
        renderTitle={() => <Text>title</Text>}
    >
        <Text>Content</Text>
    </ExpandableListItem>
</ExpandableList>
</Stack>
content_copyCopy
live example

CASTLE UI

Core

Information

Fundamentals

Core

API

Hooks

Components

Input

Layout

Page Layout

Data Display

Table

Navigation

Feedback

Overlay

Utils

KYC

Guides

Templates

Usage

Import

Example

Multiple Groups

Contents