HexagonJS
About
InstallationCore ConceptsChangelog[Migration (1.x -> 2.x)]
Tutorials
Getting StartedPrint Styles
Demos
Component Demo Page
Css Components
BaseButtonBadgeError PagesFormInputsInput GroupLabelLayoutLogoNoticeSpinnerTable
Js Components
Alerts and MessagesAutocomplete PickerAutocompleteButton GroupCardCollapsibleColor PickerCrumbtrailData TableDate PickerDate Time PickerDrag ContainerDrawingDropdownDropdown ButtonExtended TableFile InputFluidForm BuilderInline EditableInline PickerInline SelectMenuMeterModalMore ButtonNotifyNumber PickerPaginatorPickerPivot TablePlotProgress BarSide CollapsibleSidebarSingle SelectSliderStepperSticky Table HeadersTabsTag InputTime PickerTime SliderTitlebarToggle ButtonToggleTooltipTreeVisualization Bar
Utilities
AnimateClick DetectorColor ScaleColorComponentEvent EmitterFast ClickFilterFormatInterpolateListMapMorph SectionMorphsPalettePointer EventsPreferencesRequestResize EventsSearch DomSelectSelectionSetSortTransitionUser Facing TextUtilView
Edit Page
Fluid
Helper functions for creating detached dom elements and some of the hexagon dom structures.
Examples

HTML

<div id="example"></div>

JavaScript

hx.select('#example')
  .add(hx.checkbox())
  .add(hx.button({context: 'positive'}).text('Positive Button'))
  .add(hx.button({context: 'warning'}).text('Warning Button'))
  .add(hx.button({context: 'action'}).text('Action Button'))
  .add(hx.icon({class: 'fa fa-plus'}))
Api
Change Log
Functions
hx.buttonoptionsObjectSelectiondeprecated
Deprecated
Replaced by hx.button(class)
Creates a detached button wrapped in a selection
Arguments
options
Properties
contextString
The context class to apply to the button
Returns
Selection
The selection containing the new element
hx.iconoptionsObjectSelectiondeprecated
Deprecated
Replaced by hx.i
Creates a detached <i> element wrapped in a selection
Arguments
options
Properties
classString
The class to apply to the icon. This assumes you are using an icon font that uses classes (for example, font awsome)
Returns
Selection
The selection containing the new element
hx.buttonclassStringSelection
Creates a detached button wrapped in a selection
Arguments
classString
The class to add to the element
Returns
Selection
The selection containing the new element
hx.checkboxSelection
Creates a detached input element with type 'checkbox', wrapped in a selection
Returns
Selection
The selection containing the new element
hx.divclassStringSelection
Creates a detached div with the provided class
Arguments
classString
The class to add to the newly created div
Returns
Selection
The selection containing the new element
hx.iclassStringSelection
Creates a detached <i> element wrapped in a selection
Arguments
classString
The class to apply to the icon. This assumes you are using an icon font that uses classes (for example, font awsome)
Returns
Selection
The selection containing the new element
hx.inputGroupSelection
Creates a detached div, classed with hx-input-group, wrapped in a selection
Returns
Selection
The selection containing the new element
hx.spanclassStringSelection
Creates a detached span with the provided class
Arguments
classString
The class to add to the newly created span
Returns
Selection
The selection containing the new element
hx.spinnerSelection
Creates a detached span, classed with hx-spinner, wrapped in a selection
Returns
Selection
The selection containing the new element
hx.spinner.wideSelection
Creates a detached span, classed with hx-spinner-wide, wrapped in a selection
Returns
Selection
The selection containing the new element