🚨TW Elements 2.0.0 released❕

TWE package went through a serious refactoring and unification process. We have changed a lot of things to make TWE more consistent and easier to use. Our team has also addressed lots of issues and improved the overall customization options for our components.

Breaking changes:

• Changed name te to twe in data attributes, events, methods etc.

• Unified event and method names, added new events, removed some methods

• Changed package file structure

• Charts became a separate file - removed dynamic import and built as a different module

• Deleted most arbitrary classes across all components and replaced them with Tailwind CSS or custom TWE classes - extended plugin

• Improved RTL support in our package

• Added unit tests for all components in the package

To make the transition to TWE v2 easier we prepared a list of changes needed in existing projects, which you can find in the Migration guide.

Design updates:

Implemented a comprehensive theming system that extends across all components, allowing for greater customization and visual coherence throughout the package.

New features:

• Updated paths in tailiwnd.config.js snippets - changes connected with package file structure

• Added Icons Integration tutorial

• Updated Django Integration tutorial - added initializing via JS section

• Added Qwik Integration tutorial

• Added ASP.NET Integration tutorial

• Added Class customization tutorial

• Extended shadows

• Updated icons across all components

• Alert and Toast - added new functionalities and new examples:

  • position, container and offset options

• Stepper - added new functionalities and new examples:

  • Validation functionalities in Linear Stepper - default HTML validation and with Validation component

  • Mobile Stepper - stepperMobileBackBtn, stepperMobileBackBtnIcon, stepperMobileBarBreakpoint, stepperMobileNextBtn, stepperMobileNextBtnIcon, stepperMobileOfTxt and stepperMobileStepTxt options

  • Possibility to toggle to Vertical or Mobile Stepper on smaller screens - stepperMobileBreakpoint, stepperVerticalBreakpoint

  • data-twe-stepper-optional attribute which marks a step as optional

  • stepperHeadClick options which block the possibility of changing a step by clicking on another step

• Scrollspy - added new functionalities and new examples:

  • collapsible and smooth scroll options

• Search - added new examples

• Spinner / Loader - added new examples

Fixed & improved:

Content & Styles:

• Animations - removed init and autoInit methods

Navigation:

• Sidenav:

  • Fixed an issue with Ripple in the update method

  • Fixed wrong data attribute name for active sidenav state

  • Added a data-twe-sidenav-slim-active attribute that changes upon switching from full to slim sidenav

Components:

• Carousel:

  • Fixed jQueryInterface and dispose methods

  • Fixed an issue with not triggering interval when the ride option is true and slides are manually changed (e.g. via the next method)

  • Fixed an issue with initialization via JS without data-twe-carousel-init which made the component not animate when changing slides

• Chips - Fixed dispose method and add.twe.chips event

• Popconfirm

  • Added FocusTrap

  • Fixed an issue with scrolling in Popconfirm modal - disabled scrolling when the modal is opened and restored it when the modal is closed

  • Fixed the way of adding event listeners, the cancel event and dispose method

• Rating - Fixed dispose method

• Tooltip and Popover - updated default component template

Forms:

• Autocomplete:

  • Fixed an issue with clicking on No results found field

  • Added offset option which allows to customize the popper offset

  • Fixed issues with input focus after closing the dropdown on the ESC key

  • Fixed toggling aria-expanded value

• Select:

  • Fixed toggling aria-expanded value

  • Fixed an issue with Multiselect with labels - after opening the dropdown the middle notch had a border top

  • Fixed an issue where after filtering options and closing the dropdown, the setValue method was not functioning and caused the select to malfunction upon reopening

Data:

• Charts - made the config parameter optional within the update method

• Datatables - fixed wrong element and method in PerfectScrollbar usage

Utils:

• Backdrop - fix an issue with undefined class

TW Elements 2.0 - Check it out here