Releases: OutSystems/outsystems-ui
Releases · OutSystems/outsystems-ui
Release of version 2.13.0 (2022-12-19)
What's New:
- ROU-3951 - Improved the Month Picker component to return the month order when OnSelect event is triggered.
- ROU-3899 - Created a new client action called MonthPickerSetEditableInput to enable the end-user to write on the MonthPicker input.
This will cause a breaking change since the input will be now not editable by default. - ROU-3895 - Now, in the Tabs component, we have a new input parameter called ContentAutoHeight that when set to True the Tabs Content height will be set based on the active TabContent instead of the height of the highest one. This property is only available for Web apps.
- ROU-3892 - Created two new client actions called RangeSliderEnable and RangeSliderDisable to allow enabling and disabling RangeSlider and RangeSliderInterval.
- ROU-3866 - Now, we can use the new TimeFormat parameter on the TimePicker pattern to set a customized time format.
- ROU-3826 - Created a new client action called TimePickerSetEditableInput to enable the end-user to write on the TimePicker input.
- ROU-2454 - Now, we can use the new utility classes '.list-item-no-hover' and '.list-item-no-click-effect' in our applications to disable the hover style and click effect on list items. All these utility classes can be checked in the cheat sheet.
Fixed Issues and Improvements:
- ROU-3999 - Fixed an issue on the Sidebar component that was not allowing scroll when running on a native application.
- ROU-3998 - Fixed an issue on the Video component that was allowing the user to interact with the video when the controls were not enabled.
- ROU-3988 - Fixed an issue on the FlipContent, that was causing the ExtendedClass not to be applied in its initialization.
- ROU-3975 - Fixed an issue on Tabs UI Pattern, when disabling TabsHeaderItems and using only one single TabsContentItem, that only the first tab was being disabled.
- ROU-3962 - Fixed an issue when using Dropdowns and Popups inside a BottomSheet, that was causing them to appear behind it when open.
- ROU-3945 - Fixed an issue on LayoutPrivate that was adding multiple events on the body related to the Deprecated_Submenu. For that, a validation was added so that it is only added when a Deprecated_Submenu is a screen.
- ROU-3942 / RPM-3264 - Fixed an issue on the FloatingActions, that was causing the pattern not to appear, after screen navigation.
- ROU-3940 - Fixed an issue where the CSS variable --status-bar-height that is added by the platform was being removed from the body element.
- ROU-3938 / RPM-3255 - Fixed an issue on the Pull to Refresh block that was having a conflict when used together with a Master-Detail component.
- ROU-3935 - Fixed a visual issue where the Pull to Refresh loading icon was not being shown when in iOS we had content inside the layout's placeholder HeaderContent.
- ROU-3930 - Fixed an issue on the Tabs component's indicator, which was not rendering correctly when used inside the Accordions component.
- ROU-3912 / ROU-3907 - Improved the z-Index mechanism on all time-related pickers. Now the DatePicker, DatePickerRange, MonthPicker and TimePicker, validate where are placed and update their own z-index to appear above all elements on the page.
- ROU-3908 - Fixed an issue on the Tabs component that was causing a horizontal scrollbar to appear when using Columns inside it.
- ROU-3900 - Now, the Dropdown Search and Tags have the same styles for both clear buttons.
- ROU-3896 - Performance improvements on the internal build and on change methods on the new Tabs component.
- ROU-3894 - Now, Date Picker and Date Picker Range have new context info being translated that will help/improve accessibility.
- ROU-3859 - Now, the Dropdown Search and Tags support data-url images on the ImageUrlOrIconClass attribute of the DropdownOption structure.
- ROU-3857 / RPM-3172 / RPM-3179 - Now, the Date Picker and Date Picker Range have been improved for accessibility in order to properly work with the keyboard arrows.
- ROU-3850 - Now, when pressing the keyboard arrow key Left or Right, while focusing on the Tabs ContentItem, the tab change action is not triggered, staying on the current Tab.
- ROU-3834 - Fixed an issue on the Tabs Content Item's on destroy event, that was causing errors when navigating to the Previous Screen on a native application.
- ROU-3825 - Fixed a visual issue on MonthPicker component width, when the inline extensibility configuration was set to True.
- ROU-3824 - Fixed an issue that caused the context menu to appear when the dropdown is clicked multiple times in Edge browser.
Fixed an accessibility issue with the prompt text colour in Dropdowns.
Improved the experience on the tag that overlapped the clear button in Dropdown Tag when the text was really long. - ROU-3815 - Fixed an issue on the Tabs component size indicator, when using browser or system zoom.
- ROU-3724 / RPM-3100 - Fixed an issue on the Date Picker and Date Picker Range that wasn't properly dealing with the platform form validations.
- ROU-3620 - Fixed an issue on the LayoutTopMenu that was not adding the notch safe area when used in the Preview in Devices.
Breaking changes
- MonthPicker → Now, the input is not editable by default and the OnSelect event has the new output MonthNumber (the consumers need to have the references refreshed).
Release of version 2.12.0 (2022-10-24)
What's New:
- New pattern TimePicker.
- New pattern MonthPicker.
- ROU-3278 - Now, we can use new flexbox utility classes in our applications. All these utility classes can be checked in the cheat sheet.
- ROU-3301 - Created a new client action called DatePickerDisableDays that allows disabling days in the DatePicker and DatePickerRange patterns.
- ROU-3347 - Now, is possible to group options in DropdownSearch and DropdownTags by assigning the GroupName property on the options list. This will cause a soft-breaking change since the input structure is a new non-mandatory field so is just a matter of opening the module and refreshing references.
- ROU-3353 - Created new client actions for the TimePicker component - TimePickerOpen, TimePickerClose and TimePickerClear.
- ROU-3381 - Created a new client action called DatePickerDisableWeekDays that allows disabling weekdays in the DatePicker and DatePickerRange.
- ROU-3630 - Now, is possible to add descriptions to the dropdown options in DropdownSearch and DropdownTags by assigning the Description property on the options list. This will cause a soft-breaking change since the input structure is a new non-mandatory field so is just a matter of opening the module and refreshing references.
- Now, our UI Framework has a new CSS variable available: --font-size-label: 11px
- ROU-3732 / RPM-2988 - Created a new client action called DropdownSetValue to set values dynamically in the DropdownSearch and DropdownTags.
- ROU-3736 - Created new client actions for the MonthPicker component - MonthPickerOpen, MonthPickerClose and MonthPickerClear.
- ROU-3737 - Created a new client action called TimePickerToggleNativeBehavior to enable/disable the native behaviour of the TimePicker.
- ROU-3753 - Created a new client action called TimePickerUpdateTime to allow the update of the selected time shown in a given TimePicker.
- Now, the InitialDate parameter on the DatePicker component as well as the InitialStartDate and InitialEndDate from DatePickerRange, react to parameter change in runtime. However, using the respective client action to update these values is still the recommended way to use the pattern.
Fixed Issues and Improvements:
- ROU-2710 - Fixed an issue on OutSystems UI layouts that was adding multiple 'click' events to the body.
- ROU-3345 - Updated flatpickr library to version 4.6.13
- ROU-3648 - Fixed an issue on DatePicker and DatePickerRange, that was causing a flickering on Safari when updating options in runtime.
- ROU-3705 - Fixed an issue that was causing the DatePickerRange input to appear empty when just one of the dates were null.
- ROU-3711 - Now, the Tabs active indicator correctly updates its size when any TabsHeaderItem changes its size in runtime.
- ROU-3751 - Now, the StartingValue parameter on RangeSlider as well as the StartingValueFrom and StartingValueTo from RangeSliderInterval, react to parameter change in runtime. However, using the respective client action to update these values is still the recommended way to use the pattern.
- ROU-3754 - Fixed an issue on DatePicker time input that was causing the text to get cut.
- ROU-3768 - Fixed an issue on ProgressBar and ProgressCircle that was not applying properly the color when we passed and hexadecimal or RGB colour code.
- ROU-3802 - Fixed an issue on the Sidebar that was not working properly within Tabs.
- ROU-3811 - Now, on desktop, DatePicker and DatePickerRange will follow the input when scrolling the screen.
- ROU-3821 - Fixed an issue on the DatePicker and DatePickerRange where the validation style was not being applied as expected when invalid after submitting a form.
- ROU-3830 / RPM-3140 - Fixed an issue on the FloatingActions OnDestroy method, that was causing the pattern not to appear, after a screen navigation.
- ROU-3831 - Fixed a visibility issue on DropdownSearch and DropdownTags when used inside a BottomSheet in mobile devices.
- ROU-3856 / RPM-3178 - Fixed an issue on DropdownSearch and DropdownTags when changing the IsDisabled parameter on the first load and an issue on the window resize while the port is not desktop.
Release of version 2.11.0 (2022-09-19)
What's New:
- ROU-3406 - Now, in order to align the framework namespaces across other UI components, the global namespace was changed to OSFramework.
- ROU-3279 - Now, the Dropdown Search and Dropdown Tags patterns have an optional configuration (NoOptionsText) that allows you to set the message that is displayed when the data source returns no values. Now, the correct default value appears when an empty string is assigned to NoResultsText in the Dropdown Search and Dropdown Tags.
- ROU-3651 - Now, the Today button in the Date Picker will also trigger the OnSelected event.
- ROU-3586 - All UI Patterns based on an external library have new capabilities for further extensibility for all provider supported configs and events. Each pattern will have the following 3 new client actions:
-
- Set[LibraryName]Configs (to be used on the Initialized event of corresponding pattern)
-
- Set[LibraryName]Event
-
- Unset[LibraryName]Event
The patterns with external libraries are:
-
- Carousel
-
- DatePicker
-
- DatePickerRange
-
- DropdownSearch
-
- DropdownTags
-
- RangeSlider
-
- RangeSliderInterval
Fixed Issues and Improvements:
- ROU-3680 - Now, in the Dropdown Search and Dropdown Tags, the input SelectedOptions was renamed to StartingSelection in order to be easier to understand its purpose and when it changes there won't be a redraw.
- ROU-3677 - Fixed an issue on the function SkipToContent that was not working as expected when trying to focus the content element.
- ROU-3659 - Fixed an issue on the Tabs UI Pattern that was causing a scrollbar to appear unnecessarily.
- ROU-3654 - Fixed an issue where the active Tab indicator was not properly updated when the number of Tab Headers was different from the number of Tabs Contents.
- ROU-3652 - Removed the deprecated label from the ActionSheet component that was not properly categorized.
- ROU-3650 - Fixed an issue on the client action SetActiveTab that was not setting the active content (only the header).
- ROU-3649 - Fixed an issue on Carousel that was causing it to go back to the first item, every time there was a dynamic change in runtime on the carousel items. Created two new client actions - CarouselDisableOnRender and CarouselEnableOnRender - to improve performance on these use cases, by avoiding unnecessary destroy/init cycles of the Carousel.
- ROU-3633 - Fixed an issue on the dropdown widget that, when with the option content set to custom was not aligning properly with the elements inside it.
- ROU-3597 - Updated moment.js library to version 2.29.4, used by the DEPRECATED_DatePicker. This update is important to address security vulnerabilities on the moment.js version we were using (2.24). We expect no impact on the DEPRECATED_DatePicker input parameters behaviour. However, please validate any custom options used on AdvancedFormat, especially related to Date Format, as the new version might bring some unexpected changes.
- ROU-3596 - Fixed an issue when using multiple Carousel Patterns inside a Scrollable Area.
- ROU-3543 - Fixed an issue in the Date Picker's input alignment on iOS15+.
- ROU-3537 - Now, the Datepicker's Today button will also be translated accordingly with the locale set. Removed Assamese language from the DatePicker's default language since it's not supported by the provider.
- ROU-3479 - Updated the Carousel provider library (Splide.js) to version 4.0.7.
Release of version 2.10.0 (2022-07-25)
What's New:
- ROU-3255 - Created a new client action that disables the Dropdown's default behavior to open as a popup on mobile apps.
- ROU-3288 - Created new client actions to disable/enable Tab Header Items.
- ROU-3346 - Using the new SetCarouselDirection client action, users can now choose the direction of the Carousel's navigation when in autoplay.
- ROU-3426 - Added a new client action to the Sidebar pattern to toggle the swipe feature.
- ROU-3437 - Added a new client action to reset the Progress Bar and Progress Circle to their initial value.
- ROU-3464 - Created the new DatePickerSetEditableInput and DatePickerRangeSetEditableInput client actions. These client actions allow the date to be set by entering it in the input at runtime.
- ROU-3386 - Created new client actions to set new values on the Range Slider and Range Slider Interval patterns and to reset the patterns to their initial state.
- ROU-3502 - Added a new client action to the Date Picker pattern to toggle the native behavior in mobile apps.
Fixed Issues and Improvements:
- ROU-2520 - Fixed an issue caused by clicking a button multiple times on the Action Sheet pattern preventing the Action sheet from closing.
- ROU-3098 - The Tooltip balloon is now detached from the tooltip icon which solves several issues related to overflow:hidden contexts. Notice that custom CSS can be affected by this.
- ROU-3412 - Now, the SetLang client action sets the lang attribute correctly in the HTML.
- ROU-3457 - Now, when navigating to another screen, the Floating Actions pattern is properly destroyed.
- ROU-3460 - Fixed an issue with the Dropdown Search and Dropdown Tags patterns that prevented the user from navigating with the browser's back and forward buttons when the URL is entered manually.
- ROU-3461 - Fixed the Service Studio preview of the Timeline Item pattern.
- ROU-3490 - Fixed an issue with the Tabs pattern that prevented the element width from being set when the element inside the Tab content was dynamic.
- ROU-3496 - Fixed an issue with the Dropdown Search and Dropdown Tags patterns that caused the content balloon to overlap the UI element. Now you can lock the width of the columns inside the Gallery pattern. This prevents the elements inside the Gallery pattern from pushing the columns outside of the screen or applying different column widths.
- ROU-3501 - Fixed an issue with the AddFavicon client action that failed when used on the OnApplicationReady system event.
- ROU-3509 - Improved Accessibility on UserAvatar UI Pattern by adding a missing aria-role.
- ROU-3518 - Now, the Dropdown Search and Dropdown Tags patterns are properly destroyed when DropdownEnable or DropdownDisable client actions are used.
Also, note that the GetAllDropDownItemsInScreen method through OutSystems API (javascript node), was renamed to GetAllDropdowns. - ROU-3533 - Fixed an issue that prevented some client actions from working correctly due to the OutSystemsUI.js file not being loaded when the client actions are in use. Now, by default, the OutSystemsUI.js file is loaded for all actions that are not UI pattern related. This includes the DeviceDetection, Utilities, Network and Accessibility actions.
Also, the SetLocalLanguage and SetServerDateFormat settings are now private since they're only used internally by the framework and should not be exposed as client actions. - ROU-3549 - Fixed an issue with the User Avatar widget when used with an image. The classes in the extended class were not being added to the image classList, causing this parameter to be ignored when an image was provided.
If some use cases have logic to switch between showing an image and showing initials, and you have an extended class, the User Avatar will work correctly. - ROU-3553 - Fixed an issue with the Dropdown Search and Dropdown Tags patterns that caused them to display incorrectly when in popup mode and used inside the Tabs and Accordion patterns.
- ROU-3570 - Fixed an issue that caused the Checkbox widget to be incorrectly aligned inside a table.
- ROU-3574 - Created a new LayoutDestroy client action to correctly remove events. For previously created applications, you can get the dependency for this client action and assign it to the Layout block.
Now, body inline CSS variables containing viewport and header and footer height will be updated when the screen orientation changes.
The notch property has been removed from the window object (window.notch). Now, to get the notch position, you must use OSUIFramework.Helper.NotchPosition. - ROU-3577 - Fixed an issue that was causing the Tabs Patterns to cut 1px pixel of the content, in some browsers and screen sizes.
Release of version 2.9.0 (2022-06-01)
What's New:
- Now the Date Picker and Date Picker Range patterns have an optional configuration that allows you to choose if you want to display week numbers next to the calendar. Note: As this is a new entry on the Optional Configs input parameter, this is a soft breaking change(refresh references).
- Now the Dropdown Search and Dropdown Tags patterns have a button that, when clicked, clears the selected value in the dropdown.
- Now the Tooltip pattern has 2 new events (Initialized and OnToggle). These events help when, for example, creating logic based on the selected tooltip when inside a list. Additionally, fixed an issue that prevented the tooltip being closed when another one was open.
- Now the Date Picker and Date Picker Range patterns have the DatePickerUpdateDate and DatePickerRangeUpdateDates client actions which help to dynamically update the InitialDate.
- Now the Date Picker and Date Picker Range patterns can dynamically change the language by using the new DatePickerSetNewLanguage client action.
- Now, interacting with any area of the Title will toggle the Accordion Item. When a link or handler to the Title text is added, a new client action ( AccordionItemAllowTitleEvents) must be used. Otherwise, clicking on any element inside the Accordion Item will trigger the toggle.
- Now all public client actions call APIs internally, directly from the framework.
- All the public actions from the new patterns were improved so that errors are exposed to developers.
This improvement will cause a soft breaking change (refresh references).
Fixed Issues and Improvements:
- Improved the SetStickyObserver validations to check that classes and layouts are correctly applied to the page.
- Now the Action Sheet pattern is completely removed from the DOM when the OnDestroy is triggered.
- Now the Accordion Item pattern no longer has the classes .osui-accordion_item--is-first-item and .osui-accordion_item--is-last-item. These were used for styling, which is now done using CSS pseudo-elements.
If you have custom CSS using these classes, please update accordingly. - Removed an additional validation that prevented the Section Index from working in tandem with lists when the 'list' class was not applied to the pattern.
- Now the Dropdown Tags and Dropdown Search patterns open correctly inside the Accordion pattern.
- Now, when using a Carousel with static content and the dots visible, the correct padding-bottom is applied.
- Fixed an issue related to the order of weekdays on the Datepicker pattern. Now, based on the selected option, the FirstWeekDay is applied correctly.
- Now the new Dropdown Search and Dropdown Tag patterns have the same font family as other similar components.
- Now the disabled styles are enabled and consistent for all new patterns.
- Now the Sidebar overlay is no longer visible when entering the screen.
- Fixed an issue to prevent an error when opening a page with a Date Picker pattern in Chrome’s device inspector and refreshing the page.
- Now the ButtonLoading UI Pattern has the correct vertical alignment on the text inside.
- Now the Submenu pattern applies the correct active style on link elements inside the title placeholder.
- Now the arrow on the Dropdown Tags and Dropdown Search patterns are vertically aligned and have the correct hover styles on the clear icons.
- Now the ExtendedClass parameter from the Progress Bar and Progress Circle patterns works correctly on screen load.
- Fixed an issue with the Date Picker and Date Picker Range patterns that prevented the initial date from being set when MinDate and MaxDate were set.
- Fixed an issue with the Date Picker and Date Picker Range patterns when dealing with date formats set in Service Center.
In the Date Picker, the optional configuration InitialDate is now a DateTime instead of Text.
In the Date Picker Range, the optional configurations InitialStartDate and InitialEndDate are now DateTime instead of Text.
Release of version 2.8.3 (2022-04-05)
- In the OutSystems UI module, changed a record on the static entity DatePickerTimeFormat in order to overcome a platform issue in Oracle databases when dealing with empty string identifiers.
Release of version 2.8.2 (2022-04-04)
- Improved the sanitization method on both the Dropdown Tags and Dropdown Search widgets so that the search can work properly with special characters.
- Added back flex-direction: column rule to layout-side, which was wrongly removed during the SCSS conversion.
- Fixed an issue with the Tabs pattern that was throwing a client-side error when the number of tab headers didn't match the number of tab ContentItems placeholders.
- Fixed an issue that was causing the DEPRECATED_Carousel to incorrectly calculate its width.
- Fixed the Table widget’s CSS :last-child double rule.
- Fixed an issue on navigation that applies the correct visible element on the SectionIndex and fixed an issue when the page doesn't have space to apply the selected element on SectionIndex.
- Improved the Carousel’s screen reader accessibility attributes.
- Added a new SubmenuClose client action that can be used to close the Submenu pattern.
- Added a new SubmenuOpen client action that can be used to open the Submenu pattern.
- Added a new SubmenuOpenOnHover client action that can be used to configure the Submenu pattern so that it’s triggered on hover instead of on click