Change Log

Improvements

• ins-tab - Updated border and shadow to be similar to ins-table.

Bugfixes

• ins-input-tel - Fixed setValue() not emitting proper values.
• ins-table - Fixed pagination page number showing blank when clicking << (first page) or >> (last page), and emitting incorrect page number if the table data count is below the table items per page count.

Charts - Sparkline

Added Charts - Sparkline to the figma design system click here to view the design system documentation and here for the code documentation.

Charts - Line

Added Charts - Line to the figma design system click here to view the design system documentation and here for the code documentation.

Progress Bar

Added Progress Bar to the figma design system click here to view the design system documentation and here for the code documentation.

Filters

Added Filters component to figma design system click here to view the design system documentation and here for the code documentation.

Filters

• Date Range - All, Today, This Week, Last Week, This Month, Last Month, This Year, Last Year, Custom

Filter Item

Added Filters component to figma design system click here to view the design system documentation and here for the code documentation.

Data Entry - Upload

Updated Figma component to align with the Insites component and created variants, view design system page for details.

Upload

• Thumbnail - False, True
• Tooltip - False, True
• State - Default, Error, Disabled

Data Entry - WYSIWYG Editor

Updated Figma component to align with the Insites component and created variants, view design system page for details.

WYSIWYG Editor

• Label - None, Label, Label + Tooltip
• Code Editor - False, True
• Image Upload - False, True
• State - Default, Focus, Read Only, Error

Data Display - Card

Updated Figma component to align with the Insites component and created variants, view design system page for details.

Card

• Steady - False, True
• State - Default, Hover

Data Display - Charts Bar

Created a template for the Charts Bar component in figma, view design system page for details.

Data Display - Charts Line

Created a template for the Charts Line component in figma, view design system page for details.

Select Group

Updated Figma component to align with the Insites component and created variants, view design system page for details.

Select Group

• Scroll - False, True

Slider

Updated Figma component to align with the Insites component and created variants, view design system page for details.

Slider

• Position - Left, Right, Top, Bottom
• State - Default, Hover, Disabled, Error
• Label - None, Label, Label + Tooltip

Stepper

Updated Figma component to align with the Insites component and created variants, view design system page for details.

Stepper

• Label - None, Label, Label + Tooltip
• State - Default, Hover, Active, Focus, Read Only, Disabled, Error

Switch

Updated Figma component to align with the Insites component and created variants, view design system page for details.

Switch

• On - False, True
• Label - No Label, Label, Label + Tooltip
  State - Default, Disabled

Textarea

Updated Figma component to align with the Insites component and created variants, view design system page for details.

Textarea

• Label - No Label, Label, Label + Tooltip
• State - Default, Focus, Active, Disabled, Read Only, Error
• Counter - False, True

Select - Data Entry

Updated Figma component to align with the Insites component and created variants, view design system page for details.

Select

• Label - No Label, Label, Label + Tooltip
• State - Default, Hover, Active, Focus, Read Only, Disabled, Error
• Multiselect - False, True

Select Option Button

• State - Default, Disabled

Select Option Button Small

• State - Default, Disabled

Select Option - Data Entry

Updated Figma component to align with the Insites component and created variants, view design system page for details.

Select

• Scroll - False, True
• Dynamic Option - False, True

Select Option Button

• Scroll - False, True
• Dynamic Option - False, True

Select Option Button Small

• Scroll - False, True
• Dynamic Option - False, True

Improvements

• ins-button-group - Aligned the UI and styling to ins-button.

Bugfixes

• ins-input - Fixed min and max validation, field attribute must be number to enable this validation.
• ins-accordion - Title overflowing texts in the next line.
• ins-dropdown - Fixed no styling changes when lined attribute is enabled.
• ins-sidebar - Menu items overflowing texts in the next line.
• ins-table - Fixed pagination page number error when clicking << (first page) or >> (last page).

Improvements

• Added new event for ins-input-file - insFileUploaded for auto-upload finished process

Updates

Credit Card

Updated Credit Card to align with the Insites component and created variants, view design system page for details.
Options
Brand - Amex, Diners Club, Discover, JCB, Master, Union Pay, Visa
State - Default, Selected, Expired
Hover - True, False

Image Picker

Updated Image Picker to align with the Insites component and created variants, view design system page for details.
Image Picker
Shape - Circle, Rectangle
State - Default, Active
Modal
State - Default, Error

###New Features

• Added search-placeholder attribute to ins-select
• Added placeholder attribute to ins-input-multiple
• Added a download feature in ins-input-file
• Added color picker support for ins-input
   
   

Improvements

• Improved ins-sidebar animation on mobile
• Improved ins-table pagination
• Improved ins-editor list item bullets
   
   

Bug Fixes

• Fixed ins-carousel no-pagination feature
• Fixed component styles

Updates

Checkbox

Updated Checkbox to align with the Insites component and created variants, view design system page for details.
Options
Active - True, False
Label - True, False
Tooltip - True, False
Hover - True, False

Check Card

Updated Check Card to align with the Insites component, view design system page for details.

Code Editor

Updated Code Editor to align with the Insites component and update available variants, view design system page for details.
Options
Label - No Label, Label Only, Tooltip Only, Label + Tooltip
Colour - Default, Monokai, Neat, The Matrix, Material
Status - Default, Focus, Error