What's New:

• ROU-2712 - Now, it’s possible to add gradients to the ProgressBar and ProgressCircle components, by using the client action ProgressApplyGradient, with four gradient types to choose from:

  • LinearHorizontal (90deg)

  • LinearVertical (180deg)

  • LinearDiagonally (135deg)

  • Radial

  • The action also accepts a list of color items, composed of the color itself and the percentage to be used (if not provided, the percentage will be automatically calculated).

• ROU-4045 - Now, the ProgressCircle component allows defining its size (using px, %, or vw units) by using the new input parameter Size.

• ROU-4050 - Now, the Sidebar component has an Initialized event to run actions when the component is initialized.
  Created an action called SidebarClickOutsideToClose to toggle the outside click behavior on the Sidebar.
  With this action, it’s possible to override the HasOverlay behavior or add a behavior on the Sidebar component to close it by clicking the body.

• ROU-4074 - Added support for the latest versions of the iPhone by updating the associated dimensions on the framework when applying the CSS class iphonex.
  We’ll support - iPhone X / iPhone11 / iPhone12/ iPhone13 / iPhone14.

• ROU-4087 - Now, the Pagination component allows starting on different pages while manipulating the Start Index and when setting the flag to ShowGoToPage = True.

• ROU-4100 - New extensibility configurations were added to the NoUISliderConfigs structure that contains the properties available on the SetNoUISliderConfigs client action:

  • Margin: set a minimum distance between the handles. Only available for RangeSliderInterval.

  • Limit: set a maximum distance between two handles. Only available for RangeSliderInterval.

  • Behaviour: choose the way to handle user interaction.

  • Range: define the value for each range segment in a non-linear slider.

  • Snap: set to true to force the slider to jump between the specified values when a non-linear slider (Range) has been configured.

• ROU-4123 - Now, the Submenu component has an Initialized event to run actions when the component is initialized.
  Now, the Submenu component has an OnToggle event to run actions when the component toggles between open and close.

• ROU-4155 - Now, RangeSlider and RangeSliderInterval will be using the latest version of their library provider (noUISlider v15.7.0).

• ROU-4189 - Now, the Licenses block has its styles aligned with the similar block on all supported plugins, using only the CSS class license-font for any further customization and having no impact on design time.

Fixed Issues and Improvements:

• ROU-4005 - Fixed an issue on the BottomSheet component that was preventing the ability to select DatePicker, DateRange, MonthPicker and TimePicker components.

  This occurred when these components were added to the top of the BottomSheet, due to a positioning issue.

• ROU-4022 / ROU-4063 - Now, in order to have consistency in the client action's error handling, we'll have the error code and message outputs for the following client actions:

  AddFavicon / MoveElement / MasterDetailSetContentFocus / SetAccessibilityRole / SetAriaHidden / SetFocus / SetLang / SkipToContent / ToggleTextSpacing / ScrollToElement / SetActiveElement / SetSelectedTableRow / ShowPassword / SetActiveMenuItems / SetBottomBarActiveElement / SetMenuAttributes / SetMenuIcon / SetMenuIconListeners / SetMenuListeners / ToggleSideMenu / MenuHide / MenuShow / IsMenuDraggable / ListItemHint.

• ROU-4036 - Fixed an issue that caused the Tabs active indicator to appear with the wrong size.

  This occurred when using the Tabs component inside other UI components.

• ROU-4043 - Fixed an issue that caused the MonthPicker not to update the current view when changing the year. This occurred when the year was changed in runtime directly on the year input with the up/down arrows.

• ROU-4044 - Fixed an issue that caused the Submenu component not to open or close correctly.

  This occurred when we had multiple Submenu instances inside each other.

• ROU-4048 - Fixed an issue that caused the Sidebar to be closed when HasOverlay option was set to True. This occurred when starting to select the text inside the sidebar and moving the cursor to the sidebar overlay without releasing it.

• ROU-4057 - Fixed an issue that caused the ProgressCircle to have an incorrect size when the Size parameter was equal to “auto”.

  This occurred when the Size parameter was ‘auto' (default value / not being used) and consequently, the ProgressCircle size was calculated automatically accordingly to the parent size.

  Now, when the Size parameter has the default ‘auto' value, the ProgressCircle will calculate it’s size based on the block parent size. Between the width and the height properties of the parent block, the lower value is selected to be used as the ProgressCircle size.

  The ProgressCircle block also has changed its CSS display property to 'inline-block', so that other content can be placed close to the ProgressCircle if desired (before the block was 100% width and much bigger than the circle SVG itself).

• ROU-4059 - Performance improvements on two internal methods used on the internal build of the new Carousel component.

• ROU-4073 - Fixed an issue that caused some flickering on the Layout Native screen transitions.

  This occurred when using the Tabs component on Android native applications.

• ROU-4084 - Fixed an issue that caused the SectionIndex to stop working as expected.
  This occurred when the class .main-content was not present on the Layout.

• ROU-4098 / RPM-2904 - Fixed an issue that caused the Date Pickers input not to be disabled when changing its Enable attribute. This occurred when changing this attribute in runtime.

• ROU-4102 - Fixed an issue that caused the DropdownServerSide balloon to not appear properly on the screen. This occurred when using the DropdownServerSide component inside a Sidebar, BottomSheet, Popup or Notification.

• ROU-4107 - RTL improvements were implemented in OutSystems UI layouts, fixing minor issues on layout behaviours and menu animations.

• ROU-4115 - Fixed an issue that caused the ballon of the DropdownServerSide to not update its position. This occurred when there was an error message to show in the context of the DrodownServerSide.

• ROU-4119 - Fixed an issue that caused the ProgressBar to have an incorrect border-radius. This occurred when using a very high value on the Height Input Parameter.

• ROU-4121 - Fixed an issue that caused the BottomSheet to not close correctly. This occurred when dragging outside of the bounds of the BottomSheet and then using a Button to close it.

• ROU-4123 - Fixed an issue that caused the client action SubmenuOpenOnHover to not work properly. This occurred when using the client action on the Screen or the OnReady event of a block.
  Fixed an issue that caused the Submenu to have UI problems when used on the Content placeholder of the LayoutSideMenu.

• ROU-4128 - Fixed an issue that caused the DatePicker not to set the Vietnamese language. This occurred when a developer used the DatePickerSetLanguage client action and pass “vi” as the code language for Vietnamese.

• ROU-4139 - Fixed an issue that caused the TimePicker and MonthPicker to not update the enable/disable state in runtime. This occurred when a variable assigned to the Enable attribute in the TimePicker/MonthPicker input changed in runtime and the picker wasn’t reacting to it.

• ROU-4140 - Fixed an issue that caused the date and time-related components to run the open, clear and update initial date APIs when disabled. This occurred when the input of the date and time-related components were disabled and their respective open, clear and the update initial date client actions ran.

• ROU-4141 - Fixed an issue that caused the Submenu to push the content below it. This occurred when using the Submenu on the MainContent placeholder of the LayoutSideMenu.

• ROU-4143 / RPM-3677 - Fixed an issue that caused the WizardItem to have an incorrect value for the aria-label attribute that contained the element identifier.
  Now, the WizardItem has the correct value in the aria-label attribute, in order to improve the component's accessibility, allowing the screen readers to properly read its content.

• ROU-4144 - Fixed an issue that caused the Menu to incorrectly perform the drag animation. This occurred when using a Native app on Tablet Landscape and, setting the Menu block MenuBehaviour parameter to Visible.
  Now, the drag gestures won’t be added to the Menu and it updates correctly when changing orientation.

• ROU-4145 - Fixed an issue that caused the positionElement option from the SetFlatpickrConfigs client action not to work. Now, the option expects the Widget identifier of the target element.

• ROU-4158 / RPM-4158 - Fixed an issue that caused the DatePicker component not to trigger the OnSelected event. This occurred when the user used the client action DatePickerUpdateDate that uses internally the UpdateInitialDate API and where a flag was not been properly reset.

• ROU-4180 - Fixed an issue that caused the FloatingActions component to trigger JavaScript errors on the console. This occurred when navigating to another screen.

• ROU-4198 - Fixed an issue that caused the Tabs component to change tabs when pressing the arrow keys when the focus is on the Tabs content. 

  Now, the Tabs component just changes tabs when the active Tab Header is focused and the right/left arrow keys are pressed.

What's New:

• New pattern DropdownServerSide.

• ROU-2404 - Created a new client action called FocusFirstInvalidInput to focus on the first invalid input while performing a form validation.

• ROU-2770 - Now, the ScrollToElement client action has a ScrollDelay option, to scroll to the element after the time defined.
  Also improved scrolling to elements in different contexts and use cases, defining the target scroll element that will have the overflow.

• ROU-2771 - Now, in the Dev Experience of the Submenu component, we improved the Service Studio preview by increasing the space for the header content.

• ROU-3683 - Now, the generated CSS has an index to help the developers navigate through the file.

• ROU-3966 - Now, Carousel will be using the latest version of their library provider (SplideJs v4.1.3).
  This version also brings one new extensibility configuration that was added to the SplideConfigs structure that contains the properties available on the SetSplideJsConfigs client action:

  • omitEnd: If true, omits some pagination dots which just changes the active slide and do not move a carousel. Also, disables a next arrow when a carousel reaches the last page.    

• ROU-3967 - Now, Range Slider and Range Slider Interval will be using the latest version of their library provider (noUISlider v15.6.1).

• ROU-4042 - Now, Dropdown Search and Dropdown Tags will be using the latest version of their library provider (VirtualSelect v1.0.37).
  This version also brings two new extensibility configurations that were added to the VirtualSelectConfigs structure that contains the properties available on the SetVirtualSelectConfigs client action:

  • alwaysShowSelectedOptionsLabel: by default, no.of options selected text would be shown when there is not enough space to show all selected values. Set true to show labels even though there is not enough space.

  • focusSelectedOptionOnOpen: scroll the selected option to the viewport on dropbox open.

• ROU-4007 - Now, the aria attributes for the Dropdown Search, Dropdown Tags, and Tabs components were improved to pass the accessibility validators AXE and Google Lighthouse audits.

• ROU-4020 - Now, in the Dev Experience of the InlineSVG component, we improved the Service Studio preview by reducing the image preview to make it easier to use on more complex screens.

• ROU-4026 - Now, the DropdownSetValue client action has a new input parameter "SilentOnChangedEvent" in order to be possible to manage the trigger OnChangeEvent when this action is in use.
  Also, the OnChangedEvent was set as silent in the OnParametersChange when the StartingSelection input parameter gets changed.

• ROU-4031 - Created two new client actions called DropdownOpen/DropdownClose to open/close the options list of a Dropdown (DropdownTags or DropdownSearch) block with a given identifier.

• ROU-4031 - Created two new client actions called DropdownServerSideOpen / DropdownServerSideClose to open/close the options list of a DropdownServerSide block with a given identifier.

• ROU-4031 - Created two new client actions called DropdownServerSideEnable/DropdownServerSideDisable to enable/disable the DropdownServerSide block with a given identifier.

• ROU-4031 - Created two new client actions called DropdownServerSideNotValid / DropdownServerSideClearValidation to set as invalid/clear validation of a DropdownServerSide block with a given identifier.

• ROU-4031 - Created a client action called DropdownServerSideClear to clear the value of a DropdownServerSide block with a given identifier.    

For more details, please check this forum post!

Fixed Issues and Improvements:

• ROU-4039 - Now, the DropdownSearch and DropdownTags components no longer apply the default value when using an empty space for the following inputs - Prompt, SearchPrompt, NoResultText and NoOptionsText. This change allows achieving the use case of having an empty prompt.

• ROU-4004 - Fixed a visual issue when the Accordion component was disabled. where the icons to expand/collapse was not properly styled when disabled.
  This occurred when the Accordion component was set as disabled and reflected on the icons to expand/collapse that were not being properly styled.

• ROU-4017 / RPM-3401 - Fixed an issue that caused a visual misalignment on the balloon for both Dropdown Search and Dropdown Tags when using multiple instances on the same screen.
  This occurred in certain circumstances due to a relative position that existed on the pattern's wrapper.

• ROU-4018 - Fixed an issue that caused a horizontal scroll to appear when the FlipContent component was used inside Tabs and while flipping.
  This occurred only when the FlipContent component was used inside Tabs and now we hide the scroll to offer a better experience.    

• ROU-4021 - Fixed an issue on the ActionSheet component where it was not being properly destroyed.
  This occurred when we were redirecting to the same screen and not when navigating between different screens.    

• ROU-4028 - Fixed an issue that caused the loss of the additional configs set with the SetSplideConfigs, SetFlatpickrConfigs, SetNoUISliderConfigs and SetVirtualSelectConfigs client actions.
  This issue occurred only when navigating to the current page.    

• ROU-4029 - Fixed a visual issue that caused the ExtendedClass not to be properly applied in the RangeSlider/RangeSliderInterval components.
  This occurred when the RangeSlider/RangeSliderInterval components were used with vertical orientation and placed inside an element with a much wider width.    

• ROU-4030 - Fixed an issue that caused the vertical Tab active indicator to have a size bigger than expected.
  This occurred when the vertical Tab was placed in the content of another Tab.    

• ROU-4055 - Fixed an issue that caused the FloatingActions to disappear when we navigated between screens on native mobile applications.
  This occurred in the OnDestroy event that wasn't properly removing the element because of the way the pattern was dealing with the moving element in the DOM (native mobile only).

Improvements

• Changed icons for CarouselGoTo, CarouselNext and CarouselPrevious actions.
• Fixed Lightbox issues previewing a recent uploaded image.

Fixed Issues:

• JSONSharp license information was removed from the Licenses text