DropdownV1 components for use with Popover

Usage

Import

import {
  DropdownV1,
  DropdownButtonV1,
  DropdownContentV1,
  DropdownTitleV1,
} from '@passfort/castle'
content_copy
Copy

Example

<DropdownV1
  render={() => (
    <>
      <DropdownTitleV1 title="Search users" />
      <DropdownContentV1>
        <Input placeholder="Search" icon="search" />
      </DropdownContentV1>
    </>
  )}
>
  <DropdownButtonV1 label="test" />
</DropdownV1>
<DropdownV1
  render={() => (
    <>
      <DropdownTitleV1 title="Search users" />
      <DropdownContentV1>
        <Input placeholder="Search" icon="search" />
      </DropdownContentV1>
    </>
  )}
>
  <DropdownButtonV1 label="test" />
</DropdownV1>
content_copy
Copy
live example

Connected DropdownV1

import { Connected } from '@passfort/castle'
content_copy
Copy

<Connected group="dropdown">
  <DropdownV1
    render={() => (
      <>
        <DropdownTitleV1 title="Search users" />
        <DropdownContentV1>
          <Input placeholder="Search" icon="search" />
        </DropdownContentV1>
      </>
    )}
  >
    <DropdownButtonV1 group="dropdown" label="test" />
  </DropdownV1>
  <DropdownV1
    render={() => (
      <>
        <DropdownTitleV1 title="Search users" />
        <DropdownContentV1>
          <Input placeholder="Search" icon="search" />
        </DropdownContentV1>
      </>
    )}
  >
    <DropdownButtonV1 group="dropdown" label="test" />
  </DropdownV1>
</Connected>
<Connected group="dropdown">
  <DropdownV1
    render={() => (
      <>
        <DropdownTitleV1 title="Search users" />
        <DropdownContentV1>
          <Input placeholder="Search" icon="search" />
        </DropdownContentV1>
      </>
    )}
  >
    <DropdownButtonV1 group="dropdown" label="test" />
  </DropdownV1>
  <DropdownV1
    render={() => (
      <>
        <DropdownTitleV1 title="Search users" />
        <DropdownContentV1>
          <Input placeholder="Search" icon="search" />
        </DropdownContentV1>
      </>
    )}
  >
    <DropdownButtonV1 group="dropdown" label="test" />
  </DropdownV1>
</Connected>
content_copy
Copy
live example