{
  "title": "Components",
  "categories": [
    {
      "title": "Buttons",
      "link": "buttons",
      "sections": [
        {
          "title": "Toggle Buttons",
          "component": "ComponentsToggleButtonsComponent",
          "version": "Angular",
          "externalUrl": "http://valor-software.com/ngx-bootstrap/#/buttons",
          "usage": [
            {
              "title": "Selector",
              "content": "btnCheckbox"
            },
            {
              "title": "Module",
              "content": "ButtonsModule"
            },
            {
              "title": "Import As",
              "content": "ButtonsModule.forRoot()"
            },
            {
              "title": "Library",
              "content": "ngx-bootstrap"
            }
          ]
        },
        {
          "title": "Radio Buttons",
          "component": "ComponentsRadioButtonsComponent",
          "version": "Angular",
          "externalUrl": "http://valor-software.com/ngx-bootstrap/#/buttons",
          "usage": [
            {
              "title": "Selector",
              "content": "btnRadio"
            },
            {
              "title": "Module",
              "content": "ButtonsModule"
            },
            {
              "title": "Import As",
              "content": "ButtonsModule.forRoot()"
            },
            {
              "title": "Library",
              "content": "ngx-bootstrap"
            }
          ]
        },
        {
          "title": "Pagination",
          "component": "ComponentsPaginationComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-pagination"
            },
            {
              "title": "Module",
              "content": "PaginationModule"
            }
          ]
        },
        {
          "title": "Dropdown Menu",
          "component": "ComponentsDropdownsComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-menu, [uxMenuItem], [uxMenuTriggerFor]"
            },
            {
              "title": "Module",
              "content": "MenuModule"
            }
          ]
        },
        {
          "title": "Floating Action Button",
          "component": "ComponentsFloatingActionButtonComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-floating-action-buttons"
            },
            {
              "title": "Module",
              "content": "FloatingActionButtonsModule"
            }
          ]
        },
        {
          "title": "Split Button Dropdowns",
          "component": "ComponentsSplitButtonDropdownsComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-menu, [uxMenuItem], [uxMenuTriggerFor]"
            },
            {
              "title": "Module",
              "content": "MenuModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Component List",
      "link": "component-list",
      "sections": [
        {
          "title": "Component List",
          "component": "ComponentsComponentListComponent",
          "version": "Angular"
        }
      ]
    },
    {
      "title": "Color",
      "link": "color",
      "sections": [
        {
          "title": "Color Picker",
          "component": "ComponentsColorPickerComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-color-picker"
            },
            {
              "title": "Module",
              "content": "ColorPickerModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Conduits",
      "link": "conduits",
      "sections": [
        {
          "title": "Conduits",
          "component": "ComponentsConduitComponent",
          "version": "Angular"
        },
        {
          "title": "Multiple Zones",
          "component": "ComponentsMultipleZonesComponent",
          "version": "Angular"
        }
      ]
    },
    {
      "title": "Dashboard",
      "link": "dashboard",
      "sections": [
        {
          "title": "Dashboard",
          "component": "ComponentsDashboardComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-dashboard"
            },
            {
              "title": "Module",
              "content": "DashboardModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Date & Time Pickers",
      "link": "date-time-picker",
      "sections": [
        {
          "title": "Date & Time Picker",
          "component": "ComponentsDateTimePickerComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-date-time-picker"
            },
            {
              "title": "Module",
              "content": "DateTimePickerModule"
            }
          ]
        },
        {
          "title": "Date Range Picker",
          "component": "ComponentsDateRangePickerComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-date-range-picker"
            },
            {
              "title": "Module",
              "content": "DateRangePickerModule"
            }
          ]
        },
        {
          "title": "Time Picker",
          "component": "ComponentsTimePickerComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-time-picker"
            },
            {
              "title": "Module",
              "content": "TimePickerModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Drag & Drop",
      "link": "drag-and-drop",
      "sections": [
        {
          "title": "Draggable Card Tabs",
          "component": "ComponentsDraggableCardsComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxReorderable]"
            },
            {
              "title": "Selector",
              "content": "[uxReorderableHandle]"
            },
            {
              "title": "Module",
              "content": "ReorderableModule"
            }
          ]
        },
        {
          "title": "Drag & Drop Cards",
          "component": "ComponentsDragAndDropCardsComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxReorderable]"
            },
            {
              "title": "Selector",
              "content": "[uxReorderableHandle]"
            },
            {
              "title": "Module",
              "content": "ReorderableModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Facets",
      "link": "facets",
      "sections": [
        {
          "title": "Facet Container",
          "component": "ComponentsFacetContainerComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-facet-container"
            },
            {
              "title": "Module",
              "content": "FacetsModule"
            }
          ]
        },
        {
          "title": "Facet Check List",
          "component": "ComponentsFacetCheckListComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-facet-check-list"
            },
            {
              "title": "Module",
              "content": "FacetsModule"
            }
          ]
        },
        {
          "title": "Facet Typeahead List",
          "component": "ComponentsFacetTypeaheadListComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-facet-typeahead-list"
            },
            {
              "title": "Module",
              "content": "FacetsModule"
            }
          ]
        },
        {
          "title": "Custom Facet Component",
          "component": "ComponentsCustomFacetComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Module",
              "content": "FacetsModule"
            }
          ]
        }
      ]
    },
    {
      "title": "File Upload",
      "link": "file-upload",
      "sections": [
        {
          "title": "File Upload",
          "component": "ComponentsFileUploadComponent",
          "version": "Angular",
          "externalUrl": "https://valor-software.com/ng2-file-upload",
          "usage": [
            {
              "title": "Selector",
              "content": "[ng2FileDrop], [ng2FileSelect]"
            },
            {
              "title": "Module",
              "content": "FileUploadModule"
            },
            {
              "title": "Library",
              "content": "ng2-file-upload"
            }
          ]
        }
      ]
    },
    {
      "title": "Flippable Cards",
      "link": "flippable-cards",
      "sections": [
        {
          "title": "Flippable Cards",
          "component": "ComponentsFlippableCardsComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-flippable-card"
            },
            {
              "title": "Module",
              "content": "FlippableCardModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Help Center",
      "link": "help-center",
      "sections": [
        {
          "title": "Help Center",
          "component": "ComponentsHelpCenterComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxHelpCenterItem]"
            },
            {
              "title": "Module",
              "content": "HelpCenterModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Hierarchy Bar",
      "link": "hierarchy-bar",
      "sections": [
        {
          "title": "Hierarchy Bar",
          "component": "ComponentsHierarchyBarComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-hierarchy-bar"
            },
            {
              "title": "Module",
              "content": "HierarchyBarModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Icons",
      "link": "icons",
      "sections": [
        {
          "title": "Icon",
          "component": "ComponentsIconComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-icon"
            },
            {
              "title": "Module",
              "content": "IconModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Input Controls",
      "link": "input-controls",
      "sections": [
        {
          "title": "Checkbox",
          "component": "ComponentsCheckboxComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-checkbox"
            },
            {
              "title": "Module",
              "content": "CheckboxModule"
            }
          ]
        },
        {
          "title": "Expanding Text Area",
          "component": "ComponentsExpandingTextAreaComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxAutoGrow]"
            },
            {
              "title": "Module",
              "content": "AutoGrowModule"
            }
          ]
        },
        {
          "title": "Float Label",
          "component": "ComponentsFloatLabelComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxFloatLabel]"
            },
            {
              "title": "Module",
              "content": "FloatLabelModule"
            }
          ]
        },
        {
          "title": "Toggle Switch",
          "component": "ComponentsToggleSwitchComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-toggleswitch"
            },
            {
              "title": "Module",
              "content": "ToggleSwitchModule"
            }
          ]
        },
        {
          "title": "Number Picker",
          "component": "ComponentsNumberPickerComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-number-picker"
            },
            {
              "title": "Module",
              "content": "NumberPickerModule"
            }
          ]
        },
        {
          "title": "Input Dropdown",
          "component": "ComponentsInputDropdownComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-input-dropdown"
            },
            {
              "title": "Module",
              "content": "InputDropdownModule"
            }
          ]
        },
        {
          "title": "Input Mask",
          "component": "ComponentsInputMaskComponent",
          "externalUrl": "https://jsdaddy.github.io/ngx-mask/",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[mask]"
            },
            {
              "title": "Module",
              "content": "NgxMaskModule"
            },
            {
              "title": "Import As",
              "content": "NgxMaskModule.forRoot()"
            },
            {
              "title": "Library",
              "content": "ngx-mask"
            }
          ]
        },
        {
          "title": "Radio Button",
          "component": "ComponentsRadioButtonComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-radio-button, [uxRadioButtonGroup]"
            },
            {
              "title": "Module",
              "content": "RadioButtonModule"
            }
          ]
        },
        {
          "title": "Sliders",
          "component": "ComponentsSlidersComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-slider"
            },
            {
              "title": "Module",
              "content": "SliderModule"
            }
          ]
        },
        {
          "title": "Tags",
          "component": "ComponentsTagsComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-tag-input"
            },
            {
              "title": "Exported As",
              "content": "ux-tag-input"
            },
            {
              "title": "Module",
              "content": "TagInputModule"
            }
          ]
        },
        {
          "title": "Typeahead",
          "component": "ComponentsTypeaheadComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-typeahead"
            },
            {
              "title": "Module",
              "content": "TypeaheadModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Keyboard",
      "link": "keyboard",
      "sections": [
        {
          "title": "Hotkeys",
          "component": "ComponentsHotkeysComponent",
          "version": "Angular"
        }
      ]
    },
    {
      "title": "Media Player",
      "link": "media-player",
      "sections": [
        {
          "title": "Media Player",
          "component": "ComponentsMediaPlayerComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-media-player"
            },
            {
              "title": "Module",
              "content": "MediaPlayerModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Notifications",
      "link": "notifications",
      "sections": [
        {
          "title": "Alert",
          "component": "ComponentsAlertComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-alert"
            },
            {
              "title": "Module",
              "content": "AlertModule"
            }
          ]
        },
        {
          "title": "Badge",
          "component": "ComponentsBadgeComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxBadge]"
            },
            {
              "title": "Exported As",
              "content": "ux-badge"
            },
            {
              "title": "Module",
              "content": "BadgeModule"
            }
          ]
        },
        {
          "title": "Notifications",
          "component": "ComponentsNotificationsComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-notifications-list"
            },
            {
              "title": "Module",
              "content": "NotificationListModule"
            },
            {
              "title": "Dependencies",
              "content": "BrowserAnimationsModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Page Header",
      "link": "page-header",
      "sections": [
        {
          "title": "Page Header",
          "component": "ComponentsPageHeaderComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-page-header"
            },
            {
              "title": "Module",
              "content": "PageHeaderModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Panels",
      "link": "panels",
      "sections": [
        {
          "title": "Accordion",
          "component": "ComponentsAccordionComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-accordion"
            },
            {
              "title": "Selector",
              "content": "ux-accordion-panel"
            },
            {
              "title": "Selector",
              "content": "ux-accordion-panel-header"
            },
            {
              "title": "Module",
              "content": "AccordionModule"
            }
          ]
        },
        {
          "title": "EBox Panel",
          "component": "ComponentsEboxComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-ebox"
            },
            {
              "title": "Module",
              "content": "EboxModule"
            }
          ]
        },
        {
          "title": "Side Panel",
          "component": "ComponentsSidePanelComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-side-panel"
            },
            {
              "title": "Exported As",
              "content": "ux-side-panel"
            },
            {
              "title": "Selector",
              "content": "[uxSidePanelClose]"
            },
            {
              "title": "Module",
              "content": "SidePanelModule"
            }
          ]
        },
        {
          "title": "Item Display Panel",
          "component": "ComponentsItemDisplayPanelComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-item-display-panel"
            },
            {
              "title": "Module",
              "content": "ItemDisplayPanelModule"
            }
          ]
        },
        {
          "title": "Item Display Panel - Inline",
          "component": "ComponentsItemDisplayPanelInlineComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-item-display-panel"
            },
            {
              "title": "Module",
              "content": "ItemDisplayPanelModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Popover",
      "link": "popover",
      "sections": [
        {
          "title": "Popover",
          "component": "ComponentsPopoverComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxPopover]"
            },
            {
              "title": "Module",
              "content": "PopoverModule"
            },
            {
              "title": "Exported As",
              "content": "ux-popover"
            }
          ]
        }
      ]
    },
    {
      "title": "Progress",
      "link": "progress",
      "sections": [
        {
          "title": "Progress Bar",
          "component": "ComponentsProgressBarComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-progress-bar"
            },
            {
              "title": "Module",
              "content": "ProgressBarModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Scrollbar",
      "link": "scrollbar",
      "sections": [
        {
          "title": "Infinite Scroll",
          "component": "ComponentsInfiniteScrollComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxInfiniteScroll]"
            },
            {
              "title": "Exported As",
              "content": "uxInfiniteScroll"
            },
            {
              "title": "Type",
              "content": "InfiniteScrollDirective"
            },
            {
              "title": "Module",
              "content": "InfiniteScrollModule"
            }
          ]
        },
        {
          "title": "Virtual Scroll",
          "component": "ComponentsVirtualScrollComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-virtual-scroll"
            },
            {
              "title": "Module",
              "content": "VirtualScrollModule"
            }
          ]
        },
        {
          "title": "Virtual For",
          "component": "ComponentsVirtualForComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxVirtualFor]"
            },
            {
              "title": "Selector",
              "content": "[uxVirtualForContainer]"
            },
            {
              "title": "Module",
              "content": "VirtualScrollModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Search",
      "link": "search",
      "sections": [
        {
          "title": "Search Builder",
          "component": "ComponentsSearchBuilderComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-search-builder"
            },
            {
              "title": "Module",
              "content": "SearchBuilderModule"
            }
          ]
        },
        {
          "title": "Toolbar Search",
          "component": "ComponentsToolbarSearchComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-toolbar-search"
            },
            {
              "title": "Module",
              "content": "ToolbarSearchModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Select",
      "link": "select",
      "sections": [
        {
          "title": "Select",
          "component": "ComponentsSelectComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-select"
            },
            {
              "title": "Module",
              "content": "SelectModule"
            }
          ]
        },
        {
          "title": "Select List",
          "component": "ComponentsSelectListComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-select-list"
            },
            {
              "title": "Selector",
              "content": "ux-select-list-item"
            },
            {
              "title": "Module",
              "content": "SelectListModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Splitter",
      "link": "splitter",
      "sections": [
        {
          "title": "Splitter",
          "component": "ComponentsSplitterComponent",
          "version": "Angular",
          "externalUrl": "https://angular-split.github.io/",
          "usage": [
            {
              "title": "Selector",
              "content": "split"
            },
            {
              "title": "Module",
              "content": "AngularSplitModule"
            },
            {
              "title": "Library",
              "content": "angular-split"
            }
          ]
        },
        {
          "title": "Side Inset Panel Splitter",
          "component": "ComponentsSideInsetPanelSplitterComponent",
          "version": "Angular",
          "externalUrl": "https://angular-split.github.io/",
          "usage": [
            {
              "title": "Selector",
              "content": "split"
            },
            {
              "title": "Module",
              "content": "AngularSplitModule"
            },
            {
              "title": "Library",
              "content": "angular-split"
            }
          ]
        }
      ]
    },
    {
      "title": "Tables",
      "link": "tables",
      "sections": [
        {
          "title": "Column Picker",
          "component": "ComponentsColumnPickerComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-column-picker"
            },
            {
              "title": "Module",
              "content": "TableModule"
            }
          ]
        },
        {
          "title": "Column Resizing",
          "component": "ComponentsColumnResizingComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxResizableTable]"
            },
            {
              "title": "Selector",
              "content": "[uxResizableTableColumn]"
            },
            {
              "title": "Exported As",
              "content": "ux-resizable-table"
            },
            {
              "title": "Module",
              "content": "TableModule"
            }
          ]
        },
        {
          "title": "Column Sorting",
          "component": "ComponentsColumnSortingComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-column-sorting"
            },
            {
              "title": "Selector",
              "content": "[uxColumnSorting]"
            },
            {
              "title": "Module",
              "content": "ColumnSortingModule"
            },
            {
              "title": "Exported As",
              "content": "ux-column-sorting"
            }
          ]
        },
        {
          "title": "Filters",
          "component": "ComponentsFiltersComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-filter-container"
            },
            {
              "title": "Module",
              "content": "FilterModule"
            }
          ]
        },
        {
          "title": "Custom Filters",
          "component": "ComponentsCustomFiltersComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Module",
              "content": "FilterModule"
            }
          ]
        },
        {
          "title": "Fixed Header Table",
          "component": "ComponentsFixedHeaderTableComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "uxFixedHeaderTable"
            },
            {
              "title": "Module",
              "content": "FixedHeaderTableModule"
            },
            {
              "title": "Exported As",
              "content": "ux-fixed-header-table"
            }
          ]
        },
        {
          "title": "Hover Actions",
          "component": "ComponentsHoverActionsComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selectors",
              "content": "[uxHoverActionContainer], [uxHoverAction]"
            },
            {
              "title": "Module",
              "content": "HoverActionModule"
            }
          ]
        },
        {
          "title": "Layout Switching",
          "component": "ComponentsLayoutSwitchingComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selectors",
              "content": "[uxLayoutSwitcher], [uxLayoutSwitcherItem]"
            },
            {
              "title": "Module",
              "content": "LayoutSwitcherModule"
            }
          ]
        },
        {
          "title": "Reorderable Table",
          "component": "ComponentsReorderableTableComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxReorderable]"
            },
            {
              "title": "Selector",
              "content": "[uxReorderableHandle]"
            },
            {
              "title": "Module",
              "content": "ReorderableModule"
            }
          ]
        },
        {
          "title": "Selection",
          "component": "ComponentsSelectionComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxSelection]"
            },
            {
              "title": "Exported As",
              "content": "ux-selection"
            },
            {
              "title": "Selector",
              "content": "[uxSelectionItem]"
            },
            {
              "title": "Exported As",
              "content": "ux-selection-item"
            },
            {
              "title": "Module",
              "content": "SelectionModule"
            }
          ]
        },
        {
          "title": "Toolbar Sorting",
          "component": "ComponentsSortingComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Module",
              "content": "MenuModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Tabs",
      "link": "tabs",
      "sections": [
        {
          "title": "Tabs",
          "component": "ComponentsTabsComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-tabset"
            },
            {
              "title": "Selector",
              "content": "ux-tab"
            },
            {
              "title": "Selector",
              "content": "[uxTabHeading]"
            },
            {
              "title": "Module",
              "content": "TabsetModule"
            }
          ]
        },
        {
          "title": "Card Tabs",
          "component": "ComponentsCardTabsComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-card-tabset"
            },
            {
              "title": "Selector",
              "content": "ux-card-tab"
            },
            {
              "title": "Selector",
              "content": "[uxCardTabContent]"
            },
            {
              "title": "Module",
              "content": "CardTabsModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Timeline",
      "link": "timeline",
      "sections": [
        {
          "title": "Timeline",
          "component": "ComponentsTimelineComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-timeline"
            },
            {
              "title": "Module",
              "content": "TimelineModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Tooltips",
      "link": "tooltips",
      "sections": [
        {
          "title": "Tooltips",
          "component": "ComponentsTooltipsComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxTooltip]"
            },
            {
              "title": "Module",
              "content": "TooltipModule"
            },
            {
              "title": "Exported As",
              "content": "ux-tooltip"
            }
          ]
        },
        {
          "title": "Static Tooltips",
          "component": "ComponentsStaticTooltipComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxPopover]"
            },
            {
              "title": "Module",
              "content": "PopoverModule"
            },
            {
              "title": "Exported As",
              "content": "ux-popover"
            }
          ]
        }
      ]
    },
    {
      "title": "Tree View",
      "link": "tree-view",
      "sections": [
        {
          "title": "Tree View",
          "component": "ComponentsTreeViewComponent",
          "version": "Angular",
          "externalUrl": "https://angular2-tree.readme.io/docs",
          "usage": [
            {
              "title": "Selector",
              "content": "tree-root"
            },
            {
              "title": "Module",
              "content": "TreeModule"
            },
            {
              "title": "Import As",
              "content": "TreeModule"
            },
            {
              "title": "Library",
              "content": "@circlon/angular-tree-component"
            }
          ]
        },
        {
          "title": "Tree View - Custom Nodes",
          "component": "ComponentsTreeViewCustomNodeComponent",
          "externalUrl": "https://angular2-tree.readme.io/docs",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "tree-root"
            },
            {
              "title": "Module",
              "content": "TreeModule"
            },
            {
              "title": "Import As",
              "content": "TreeModule"
            },
            {
              "title": "Library",
              "content": "@circlon/angular-tree-component"
            }
          ]
        },
        {
          "title": "Tree Grid",
          "component": "ComponentsTreeGridComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxTreeGrid]"
            },
            {
              "title": "Selector",
              "content": "[uxTreeGridRow]"
            },
            {
              "title": "Module",
              "content": "TreeGridModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Utilities",
      "link": "utilities",
      "sections": [
        {
          "title": "Color Service",
          "component": "ComponentsColorServiceComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Module",
              "content": "ColorServiceModule"
            }
          ]
        },
        {
          "title": "Focus",
          "component": "ComponentsFocusComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "uxFocusWithin"
            },
            {
              "title": "Selector",
              "content": "uxBlurWithin"
            },
            {
              "title": "Module",
              "content": "AccessibilityModule"
            }
          ]
        },
        {
          "title": "Focus If",
          "component": "ComponentsFocusIfComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[focusIf]"
            },
            {
              "title": "Module",
              "content": "FocusIfModule"
            }
          ]
        },
        {
          "title": "Focus Indicator",
          "component": "ComponentsFocusIndicatorComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxFocusIndicator]"
            },
            {
              "title": "Module",
              "content": "AccessibilityModule"
            }
          ]
        },
        {
          "title": "Persistent Data Service",
          "component": "ComponentsPersistentDataServiceComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Module",
              "content": "PersistentDataModule"
            }
          ]
        },
        {
          "title": "Tabbable List",
          "component": "ComponentsTabbableListComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "[uxTabbableList]"
            },
            {
              "title": "Selector",
              "content": "[uxTabbableListItem]"
            },
            {
              "title": "Module",
              "content": "AccessibilityModule"
            }
          ]
        }
      ]
    },
    {
      "title": "Wizard",
      "link": "wizard",
      "sections": [
        {
          "title": "Wizard",
          "component": "ComponentsWizardComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-wizard"
            },
            {
              "title": "Module",
              "content": "WizardModule"
            }
          ]
        },
        {
          "title": "Marquee Wizard",
          "component": "ComponentsMarqueeWizardComponent",
          "version": "Angular",
          "usage": [
            {
              "title": "Selector",
              "content": "ux-marquee-wizard"
            },
            {
              "title": "Module",
              "content": "MarqueeWizardModule"
            }
          ]
        }
      ]
    }
  ]
}