Select Menu

    import React, {useRef} from "react"
    import SelectMenu from "components/ui/SelectMenu"

    import items from "./items"

    function onSelect(item) {
      console.log(item)
    }

    function onSearch(value) {
      console.log(value)
    }

    function onSelect(item) {
      console.log(item)
    }

    <SelectMenu
      items={items}
      className="my-className"
      menuClassName="my-menuClassName"
      listingClassName="my-listingClassName
      title="Select your plan"
      placeholder="My placeholder"
      displayAvatar={false}
      value={items[0]} // type is object
      disabled={false}
      borderRadius="left/String type"
      popoverPosition="bottom/top"
      allowClear={true}
      noBorder={false}
      quickSelect={true}
      quickSearch={true}
      error={false}
      readOnly={false}
      onSelect={onSelect}
      onSearch={onSearch}
      onSelect={onSelect}
      opts={{
        showPagination: true,
        size: 4,
        pageCount: 5,
        totalCount: 20
      }}
    />
  

    import React, {useRef} from "react"
    import SelectMenu from "components/ui/SelectMenu"

    import items from "./items"

    function onSelect(item) {
      console.log(item)
    }

    function onSearch(value) {
      console.log(value)
    }

    function onSelect(item) {
      console.log(item)
    }

    <SelectMenu
      items={items}
      className="my-className"
      menuClassName="my-menuClassName"
      listingClassName="my-listingClassName
      title="Select your plan"
      placeholder="My placeholder"
      displayAvatar={false}
      value={items[0]} // type is object
      disabled={false}
      borderRadius="left/String type"
      popoverPosition="bottom/top"
      allowClear={true}
      noBorder={false}
      quickSelect={true}
      quickSearch={true}
      error={false}
      readOnly={false}
      onSelect={onSelect}
      onSearch={onSearch}
      onSelect={onSelect}
      placement="auto" // "top" or "bottom"
      opts={{
        showPagination: true,
        size: 4,
        pageCount: 5,
        totalCount: 20
      }}
    />