Hi Components Library

Different components available, to help you in different situations or open more opportunities in your applications development.

Check the available components list and their description:

• Hi Actions Container (R) 
  Display large amounts of content with the possibility to include actions in it.
• Hi Actions Container (T) 
  Display large amounts of content with the possibility to include actions in it.
• Hi Advanced File Upload (R)
  Component used to insert or drag and drop a file.
• Hi Advanced Info Overlay (R)
  Full card overlay for additional content on the entire card.
• Hi Advanced Search (R)
  Allow the user to have multiple types of search inputs.
• Hi Advanced Search (T)
  Allow the user to have multiple types of search inputs.
• Hi Advanced Timeline (R)
  Have a timeline displayed vertically and with several options to show in how to have content displayed or hidden.
• Hi Arc Chart (T)
  Allow you to use a list of arc-chart type to create a chart.
• Hi Auto-Resize Text Area (R)
  Component to make the Text Area to expand when content is added.
• Hi Auto-Resize Text Area (T)
  Component to make the Text Area to expand when content is added.
• Hi Body Class (R) 
  Use it to insert classes on the html body (Add, Remove and Toggle actions).
• Hi Bulk Select (T)
  Use it to select/unselect all checkboxes inside a Table Records widget.
  
• Hi Button Option (R)
  Display one or more options inside a button.
• Hi Card Center Row Content (T)
  Show content in the center row, plus the choice of having other content or actions in the left and/or right side of the card.
• Hi Card Swiper (R) 
  Component with a slideshow card swiper and 3D effect.
• Hi Card With Progress (R) 
  Have a card with different text placeholders and a progress bar.
• Hi Circular Slider (T)
  Create a circular slider by giving a list of items and an initial value for the slider.
• Hi Color Preview (R) 
  Have a container that changes its background color.
• Hi Color Preview (T) 
  Have a container that changes its background color.
• Hi Confetti (R) 
  Component to drop confetti on your screen.
• Hi Confirmation Delete (R) 
  Have a confirmation step that can be used to verify danger actions, like delete or other type of exclude data.
• Hi Confirmation Delete (T) 
  Have a confirmation step that can be used to verify danger actions, like delete or other type of exclude data.
• Hi Content Flow Steps (T) 
  Component used to display content in a step way and to create a flow of steps.
• Hi Copy to Clipboard (R) 
  Component used to copy and or cut text to clipboard.
• Hi Country Code (T)
  Have a dropdown with a flag and international country code to be selected.
• Hi Credit Card (R)
  Show a card with information such as number or name of the holder and have the option to change the card's background image.
• Hi Credit Card (T)
  Show a card with information such as number or name of the holder and have the option to change the card's background image.
• Hi Cupertino Pane (R)
  Slide-over pane with touch technologies.
• Hi Custom Button Loading (R)
  Button with a loading state.
• Hi Custom Dropdown Search (R)
  Enhanced dropdown block, with a search functionality.
• Hi Custom Popover (R)
  Display additional content on user selection.
• Hi Custom Section Index (R)
  Use it to enable the users to navigate within a page quickly.
• Hi Dropdown Search Inline (R)
  Display a dropdown with a search functionality.
• Hi Element Scroll (T)
  Component used to create a vertical scroll for content.
• Hi Error Screen (R) 
  Display on the screen the type of a page error.
• Hi Error Screen (T) 
  Display on the screen the type of a page error.
• Hi Expandable Table Row (R) 
  Expand and collapse a row with content between table rows.
• Hi Flex (R)
  The Flexible Box Layout Module makes it easier to display flexible and responsive elements without using float or positioning.
• Hi Font Awesome Free (T)
  Use it to preview and insert the attributes of Font Awesome Free icons.
• Hi Font Awesome Icon (R)
  Use it to preview or insert a Font Awesome icon.
• Hi Font Awesome Icon (T) 
  Use it to preview or insert a Font Awesome icon in Traditional applications.
• Hi Full Page Overlay (R) 
  Have a full page overlay for additional content on the entire screen.
• Hi HTML Editor (R) 
  Next generation block styled editor.
• Hi Icon SVG (R) 
  Display and create icons SVG from HTML tags.
• Hi Iframe (R) 
  Display the content of an URL.
• Hi Image Background (R)
  Have a banner with custom content. Areas without content or having images without background will have a filled background with a color of your choice.
• Hi Image Cropper (R) 
  Component that gives the user a selection of image cropping possibilities.
• Hi Increment Input (R) 
  Input with actions to change the numeric value (- 1), (+ 1) or in a different interval.
• Hi Increment Input (T) 
  Input with actions to change the numeric value (- 1), (+ 1) or in a different interval.
• Hi Input Code (R)
  Have a styled input that can force number or password type.
• Hi Input Code (T)
  Have a styled input that can force number or password type.
• Hi Input Color (R) 
  Have an input color type, where the user can insert different color type codes.
• Hi Input Color (T) 
  Have an input color type, where the user can insert different color type codes.
• Hi Input Label (R) 
  Display a label and its widget.
• Hi Input Label (T) 
  Display a label and its widget.
• Hi Input Mask Currency (R)
  Apply a mask on currency input fields.
• Hi Input Month/Year Mask (R)
  Applies a mask to the input with a format MM/YYYY.
• Hi Input Month/Year Mask (T)
  Applies a mask to the input with a format MM/YYYY.
• Hi Input Progress (R)
  Component to display an input progress regarding its expected value length.
• Hi Loading Animation (R)
  Component to display a loading state.
• Hi Loading Animation (T)
  Component to display a loading state.
• Hi Loading for Splash Screen (R)
  Splash loading component is used to do the splash screen when you start or open your application.
• Hi Masonry Gallery (R)
  Display content in a masonry like pattern.
• Hi Multi Detail Card (R)
  Display different information type in a card with several content areas.
• Hi Multi Select Dropdown (R)
  Have a dropdown with a multiple choices selection from several options.
• Hi Multi Select Dropdown (T)
  Have a dropdown with a multiple choices selection from several options.
• Hi Multiple Detail Card (R)
  Use it to display as many info in your card as you want.
• Hi Native Range Slider (R)
  The input type "range" defines a control for entering a number whose exact value is not important (like a slider control).
• Hi Notifications Popover (R)
  A popover to display notifications.
• Hi Offset Menu (R)
  Use the Hi Offset Menu to add a different menu to your app.
• Hi Opacity Effect (R)
  Component to add an opacity effect to all its content.
• Hi Opacity Effect (T)
  Component to add an opacity effect to all its content.
• Hi Pagination Show Items (R)
  Help users to find a specific listed item by having a different number of items per page choice to select.
• Hi Parallax Mouse (R)
  Component that allows to add items that move at a different speed depending on the mouse movement.
• Hi Parallax Scroll (R)
  Component that allows you to add items that move at a different speed depending on the scroll.
• Hi Popover Filter (T)
  Component having a popover that can be used to display a filter triggered by clicking on a button included in the component.
• Hi Popup Structure (R)
  Use this to have display a popup having a title, a secondary content (like for example, a checkbox) and an actions area at the bottom.
• Hi Progress Scroll (R)
  Hi ProgressScroll is a minimalist page scroll indicator to visualize the scroll position (how much the user has scrolled) in a slim progress bar. Fully customizable via CSS.
• Hi QR Coder (R)
  A simple QR Code generator to your application.
• Hi Remove Tag (R)
  Use it to select and remove tags.
• Hi Responsive Breadcrumbs (R)
  Display the current user location in applications with a deep page hierarchy.
• Hi Ring Progress (R)
  Component to display an element surrounded by a ring with a progress.
• Hi Ring Progress (T)
  Component to display an element surrounded by a ring with a progress.
• Hi Section Actions (R)
  Use it to separate content and you can include in it actions.
• Hi Section Content Expandable (R)
  Useful component to organize information by displaying part of the content first and then expand it to see more.
• Hi Select Card (R)
  Allow the user to select cards between multiple options.
• Hi Select Card (T)
  Allow the user to select cards between multiple options.
• Hi Responsive Breadcrumbs (T)
  Display the current user location in applications with a deep page hierarchy.
• Hi Select Option Group (T)
  Use it in a dropdown so you can select an option with options separated by groups.
• Hi Select Tag (R)
  Component to select multiple options displayed as tag elements.
• Hi Side Actions (R)
  Have a button icon with an action that when pressed, floats additional actions to a different choice of positions.
• Hi Simple Pagination (R)
  Display the pagination in a different layout for its options and results.
• Hi Sticky Content (T)
  Component to add a bottom area on your screen used to compare items.
• Hi Swipe Up Card (R)
  Swipe up a card in you mobile app.
• Hi Table Edit Inline (R)
  Allow the user to easily edit, add or delete content inline on a table.
• Hi Table Row Expandable (R)
  Allow the user to create and display expandable content inside the table.
• Hi Table Row Expandable (T)
  Allow the user to create and display expandable content inside the table.
• Hi Timer Carousel (R)
  Have a carousel with multiple items and a visible timer in an horizontal slide.
• Hi Title Line Separator (R)
  Use this to show a text with separator, so it helps you to organise and structure better your content.
• Hi Tooltip Container (R)
  Display a tooltip on a card, input or other pattern type.
• Hi Transfer List (R)
  Component with a double column transfer choice box which allows the user to move a single or multiple items between two select items.
• Hi Two Columns Same Height (T)
  Display columns with the same height. You can also set different widths for the first column and different gap sizes.
• Hi UI Range Slider (T)
  Allow the user to select a single value between two range values.
• Hi Undo Action (R)
  Undo Action causes an action to be "triggered" just after a few seconds, giving the user an opportunity to cancel that selected action.
• Hi Upload File Size (R)
  Actions to return a file size in bytes that allows you to validate a certain file size uploaded through the uploaded widget before send it to the server.
• Hi User Info Popover (R)
  Have a popover to display the user info.
  
• Hi Users List (R)
  Have the option to reverse a previous action.
• Hi Users List (T)
  Have the option to reverse a previous action.
• Hi Visibility (R)
  Component to toggle an element visibility. Hidden elements take up space on your screen.
• Hi Zip Code Mask (R)
  Insert a zip code number and it will be inserted dynamically by having its first and second part separated.
  
  

(R) Reactive component
(T) Traditional component