@gitlab/ui/dist/components/base/dropdown/examples/index.js

GitLab UI Components

import DropdownDefaultExample from './dropdown.default.example';
import DropdownLinksExample from './dropdown.links.example';
import DropdownWithAvatarAndSecondaryText from './dropdown.with_avatar_and_secondary_text.example';
import DropdownWithCheckedItemsExample from './dropdown.with_checked_items.example';
import DropdownClearAllExample from './dropdown.with_clear_all.example';
import DropdownWithDividerExample from './dropdown.with_divider.example';
import DropdownWithFormExample from './dropdown.with_form.example';
import DropdownWithHeaderExample from './dropdown.with_header.example';
import DropdownWithHighlightedItemsExample from './dropdown.with_highlighted_items.example';
import DropdownWithIcons from './dropdown.with_icons.example';
import DropdownWithRightAlignExample from './dropdown.with_right_align.example';
import DropdownWithSearchExample from './dropdown.with_search.example';
import DropdownWithSectionHeadersExample from './dropdown.with_section_headers.example';

var index = [{
  name: 'Dropdown',
  items: [{
    id: 'new-dropdown-default',
    name: 'Default',
    description: 'Default Dropdown',
    component: DropdownDefaultExample
  }, {
    id: 'new-dropdown-links',
    name: 'With Links',
    description: 'Dropdown with links as items',
    component: DropdownLinksExample
  }, {
    id: 'new-dropdown-with-divider',
    name: 'With Divider',
    description: 'Dropdown with divider',
    component: DropdownWithDividerExample
  }, {
    id: 'new-dropdown-with-header',
    name: 'With Header',
    description: 'Dropdown with section header',
    component: DropdownWithHeaderExample
  }, {
    id: 'new-dropdown-with-highlighted-items',
    name: 'With Highlighted items',
    description: 'Dropdown with highlighted items',
    component: DropdownWithHighlightedItemsExample
  }, {
    id: 'new-dropdown-with-section-headers',
    name: 'With Section Headers',
    description: 'Dropdown with section headers',
    component: DropdownWithSectionHeadersExample
  }, {
    id: 'new-dropdown-with-right-align',
    name: 'With Right Alignment',
    description: 'Dropdown aligned to the right side',
    component: DropdownWithRightAlignExample
  }, {
    id: 'new-dropdown-with-search',
    name: 'With Search',
    description: 'Dropdown with search field',
    component: DropdownWithSearchExample
  }, {
    id: 'new-dropdown-with-checked-items',
    name: 'With Checked Items',
    description: 'Dropdown with checked items',
    component: DropdownWithCheckedItemsExample
  }, {
    id: 'new-dropdown-with-avatar-and-secondary-text',
    name: 'With Avatar and Secondary Text',
    description: 'Dropdown with avatar and secondary text',
    component: DropdownWithAvatarAndSecondaryText
  }, {
    id: 'new-dropdown-with-icons',
    name: 'With Icons',
    description: 'Dropdown with icons',
    component: DropdownWithIcons
  }, {
    id: 'new-dropdown-with-form',
    name: 'With Form',
    description: 'Dropdown with form',
    component: DropdownWithFormExample
  }, {
    id: 'new-dropdown-with-clear-all',
    name: 'With Clear all',
    description: 'Dropdown with clear all',
    component: DropdownClearAllExample
  }]
}];

export default index;