ODC release of version 2.18.0 (2023-11-14)

What's New

• Deprecated the InputSearch and a new version was created and converted to the new architecture.

Fixed Issues and Improvements

• Improved accessibility on the Notification component.Now, the Notification’s role attribute value was changed from alert to alertdialog in order to improve accessibility in a way that the Screen Readers can report the information about it being shown as a dialogue instead of inline.
• Improved accessibility on the StackedCards component.Now, the user can hear the changes that were applied to the component using a Screen Reader, we also improve the information accessible and clean data that was duplicated.
• Improved accessibility on the Tabs component.Now, Tabs have support for the Home and End keys, so it changes the tab for the first or last TabsHeaderItem, respectively. Support for Apple’s VoiceOver Screen Reader was also improved.
• Improved accessibility on the Tooltip component.Now, you can close the Tooltip by using the Escape or Tab keys and, the Screen Reader will read the tooltip content when its trigger is focused.
• Improved accessibility on the DropdownServerSide component.Now, it supports the ArrowUp and ArrowDown keys in order to open the dropdown balloon.An aria-hidden attribute was added to the search input (if exists) and managed in accordance with the dropdown being open or closed.Improved the outline style for the elements that are in focus mode.
• Improved accessibility on the DatePicker and DatePickerRange components.
  Now, these patterns follow the best accessibility practices in terms of readability for assistive technologies and keyboard support, is possible to navigate between all interactive elements, inside the dialog, using the keyboard.
• Improved accessibility on the Submenu component.Now, the Submenu has proper keyboard interactions to close, open and tab between items inside.
• Improved accessibility on the BottomSheet component.Now, it has the correct role attribute and supports the Home and End keys, to focus on the first and last focusable items, respectively.
• Improved accessibility on the FloatingActions component.Improved the Screen Reader support to correctly return information about each FloatingActionsItem.
• Improved accessibility on the ActionSheet component.Now, it follows the best accessibility practices and the Screen Reader readability was improved when using the ActionSheet component.
• Improved accessibility on the ChatMessage component.Now, the ChatMessage gives the proper feedback about its status when using a Screen Reader.
• Improved accessibility on the DropdownSearch and DropdownTags components.
• Improved accessibility on the ButtonLoading component by adding new HTML attributes.
• Improved accessibility on the Pagination component.Now, it follows the best accessibility practices and the Screen Reader readability was improved when using the GoToPage feature.
• Improved accessibility on the Rating component.Now, it follows the best accessibility practices and the Screen Reader readability was improved when using the Rating component.
• Improved accessibility on the OverflowMenu component.Now, it is possible to open the OverflowMenu and navigate between the links using the Arrow Up and Down Keys.
• Fixed an issue that caused the DropdownSearch and DropdownTags to remain open and visible when not supposed to.This occurred when using these components inside the Tabs component, and changing the active tab with a Dropdown still open.
• Fixed an issue in the SkipContent link present on OutSystems UI layouts, that was throwing an error on some accessibility checkers. Now, the SkipContent anchor has the correct related content on the link.
• Fixed an issue that caused the DropdownServerSide component to open when disabled.This occurred when the end user used the keyboard to navigate and pressed Enter while focusing on the component.
• Fixed an issue that caused all the time-related components to display the platform input widget in runtime. This occurred in runtime when the platform inputs were inside a container or an InputWithIcon.
• Fixed an issue on the Header preview when using the LayoutBase block. Now, the Header elements appear correctly aligned inside the Service Studio.
• Fixed an issue that caused the DropdownServerSide component to not open.This occurred when clicking on the DropdownServerSide component on a Tablet device.
• Fixed an issue that caused the OverflowMenu to always occupy 100% width. This occurred when placing elements side by side with an OverflowMenu component.
• Fixed an issue that caused the OverflowMenu to get cut.This occurred when used inside elements with overflow: hidden, like Tabs or Accordions.
• Fixed an issue that caused the OverflowMenu to close.This occurred when clicking inside the component.
• Fixed an issue that caused the DatePicker and DatePickerRange components to never focus on their input when opened via API.This occurred when the DatePicker/DatePickerRange open was triggered and the focus was the button clicked. Now, the focus is the input, after the API is triggered.
• Fixed an issue that caused the DatePicker, DatePickerRange, TimePicker, and MonthPicker components to show their hidden input in an invalid validation status. This occurred when the pickers were inside a Form widget that was submitted with an invalid validation status.
• Fixed an issue that was blocking the configuration of a custom favicon. This occurred when the user was using a PWA application.
• Added missing translations to the PasswordPolicy component for the supported languages.Also reviewed Dutch (nl) translations.
• To mitigate a platform issue when dealing with the translation mechanisms for the validation messages that the ones in OutSystems UI were overriding, all of these literals were marked as not to be translated for all locales.

Release of version 2.17.0 (2023-09-11)

What's New:

• ROU-4266 - Created a new component called OverflowMenu, under the Navigation category. This is a clickable element that displays hidden actions, settings, or secondary options. Use this pattern to show additional options when there is a space constraint (e.g. in toolbars or other places where a group of actions is required).
  Created a new client action called OverflowMenuClose to allow closing an OverflowMenu with a given identifier.Created a new client action called OverflowMenuOpen to allow closing an OverflowMenu with a given identifier.
• ROU-4391 - Created two new client actions called OverflowMenuEnable and OverflowMenuDisable to allow enabling or disabling the OverflowMenu component.
• ROU-4250 - The Video component was converted to the new architecture. Now, the Video component has an Initialized event to run actions when the component is initialized and has a StateChanged event to return the reproduction state of the video (Unstarted, Playing, Paused & Ended).
• ROU-3280 - Created the new client actions VideoPlay and VideoPause, to play or pause a given video in runtime.
  Created the new client action VideoGetState, to return the state of the video (Unstarted, Playing, Paused or Ended).
• ROU-4410 - Created a new client action called VideoJumpToTime to jump to a specific time of a Video component of a given video in runtime.
• ROU-4440 - Created a new client action called ShowPassword (the previous one was deprecated) so that we can apply it to a specific input element on a screen.
  Now, a new optional input parameter called WidgetId will be available so that we can specify the input element to which we will toggle the password visibility.

Fixed Issues and Improvements:

• ROU-4231 - Fixed an issue that caused the Tabs indicator not to adapt its width correctly, after changing the browser or system zoom.
  This occurred when using the Tabs UI Pattern and the zoom level was different than 100%.
• ROU-4327 - Fixed an issue that caused the OrientationChange event not to be added on Mobile Apps. This occurred when navigating to another screen.ROU-4348 - Fixed an accessibility issue that caused the screen reader to not read the Progress Bar and Progress Circle contents.
• ROU-4364/RPM-4016 - Improved the Accordion and AccordionItem accessibility:
  Now, interactive elements (buttons, links, inputs, etc.) placed inside the Accordion Header are not focusable using the keyboard or announced by screen readers when the AccordionItem is collapsed. This aims to mitigate an accessibility issue regarding nested interactive elements.
  Now, the Accordion Content is not focusable using the Tab key, since it is not a focusable element. Interactive elements placed in the Accordion Content remain focusable via the Tab key when the Accordion is expanded.
  Now, the Accordion and AccordionItem are not structured as a tablist and fit the best structure followed by accessibility standards.
• ROU-4366/RPM-4016 - Improved accessibility on the RangeSlider and RangeSliderInterval components.
  Now, the screen readers will be able to properly read the content and, the sliders are now correctly unreachable with the keyboard when disabled.
• ROU-4392 - Improved the AnimatedLabel TypeScript typification.
  This was having an impact when the data bound was already loaded and it was removed programmatically making the component not to be updated. Thank you João Franco for the contribution.
• ROU-4412 - Fixed an issue that caused the DropdownServerSide component to not close properly when clicking on the overlay.
  This occurred on Phone devices when opening the DropdownServerSide component.
• ROU-4420 - Fixed an issue that caused the AnimatedLabel component to not show the text on top when having an input filled in or when focused. This occurred when the AnimatedLabel component was placed inside a list.
• ROU-4422 - Fixed an issue that caused the Carousel component not to adapt its width correctly, after a window resize.
  This occurred when using the Carousel component inside the LayoutBaseSection block.
• ROU-4443 - Fixed an issue that caused the DropdownSearch component to show all options as pre-selected.This occurred when passing a list with a single empty option, on the StartingSelection parameter.
• ROU-4446 - Fixed an issue that caused the Tooltip component to not close when clicking outside of it.
  This occurred when the Tooltip was being used inside a Notification component and with the optional configuration InteractToClose set as “True”.
• ROU-4462 - Improved the Sidebar and Notification focus behavior to follow the best accessibility guidelines.
  Now, when these components close, the focus returns to the previously focused element if any, otherwise, the focus is set to the first focusable element in the page.
• ROU-4482 - Fixed an issue that caused all the time-related components to not display the platform input widget in Service Studio.
  This occurred in design-time only and there was no impact on runtime.
• ROU-4490 - Now, Dropdown Search and Dropdown Tags will be using the latest version of their library provider (VirtualSelect v1.0.40).
  • RPM-4279 - Fixed an issue that caused the Dropdown Search and Dropdown Tags components to have a focus when entering a screen.
    This occurred when the Dropdown Search and Dropdown Tags components had StartingOptions being set.
• ROU-4493/RPM-4263 - Fixed an issue that caused the DatePicker component to not set the correct InitialDate when MinDate or MaxDate was equal to the InitialDate.
• ROU-4500 - Fixed an issue that caused the AccordionItem component not to return the AccordionItemId when the OnToggle event was triggered.
• ROU-4505 - Now, Chinese (zh-Hant + zh-Hans), French (fr-FR) and Korean (ko-KR) are available in Multilingual Locales.
  The following locales were also translated/reviewed - Arabic (ar), Chinese (zh-CN), German (de-DE), Spanish (es), Japanese (ja-JP), Dutch (nl) and Portuguese (pt + pt-BR).

Release of version 2.16.0 (2023-07-10)

What's New:

• ROU-3349 - The InlineSVG block was converted to the new architecture. Now, the InlineSVG component has an Initialized event to run actions when the component is initialized.
• ROU-3417 - We created a new way to manage z-index values across all the UI Patterns - a Layer System - that offers better maintainability on our side, but also easier customization. This new system meant changing the values of all z-index across the UI Framework. Check the official documentation page for more details about the change and mitigation options for customers with custom CSS and z-index implementations.
• ROU-4208 - Created a new client action called SubmenuClickOutsideToClose to disable the behaviour that closes the pattern when clicking on the body. This client action can be used on the Submenu’s Initialized event or the parent block/screen OnReady event.
• ROU-4247 - Created a new client action called MonthPickerUpdateMonth to allow the update of the selected month shown in a given MonthPicker component.
• ROU-4307 / RPM-3995 - Created the actions DatePickerUpdatePrompt, MonthPickerUpdatePrompt and TimePickerUpdatePrompt to allow updating the prompt message on the associated input, so that we can use it to match some business rules.

Fixed Issues and Improvements:

• ROU-3656 / ROU-4265 - Now, the following components have the non-mandatory Initialized event: SectionIndex, SectionIndexItem, Accordion, AccordionItem, Tabs, TabsContentItem, TabsHeaderItem, DropdownServerSideItem, Gallery, FlipContent, BottomSheet, ProgressBar, ProgressCircle, Rating, ButtonLoading and AnimatedLabel.Also added the following input parameters:
  • Rating - RatingId input param to the OnSelect event.
  • Sidebar- SidebarId input param to the OnToggle event.
  • AccordionItem - AccordionItemId input param to the OnToggle event.
  • FlipContent - FlipContentId input param to the ToggleFlip event.
  • BottomSheet - BottomSheetId input param to the OnToggle event.
  • Carousel -CarouselId input param to the OnSlideMoved event.
  • RangeSlider - RangeSliderId input param to the OnValueChange event.
  • RangeSliderInterval - RangeSliderIntervalId input param to the OnValueChange event.
  • Tabs - TabsId input param to the OnTabChange event.
• ROU-3970 - Improved accessibility on DatePiker, DatePickerRange, MonthPicker and MonthPicker components, mostly focusing on screen readers when translations are applied. Fixed an issue on the DropdpwnServerSideItem component that was causing the outline when focused to be lost. This occurred when the accessibility features were enabled.
• ROU-4114 - Fixed an issue that caused some UI components to not adapt correctly with RTL. This occurred when switching to RTL in runtime. Now, the provider-based components will correctly adapt in runtime - DatePicker / DatePickerRange / TimePicker / MonthPicker / Carousel / DropdownSearch / DropdownTags / RangeSlider / RangeSliderInterval.
• ROU-4126 - Fixed visual issues (margins and alignments) on LightBoxImage, ChatMessage, Popup, Upload and Table when using RTL.
• ROU-4142 - Fixed an issue that caused difficulty to drag content inside Tab’s content in the Service Studio preview.
• ROU-4154 - Fixed an issue that caused some misalignment of the error validation messages. This occurred when using inputs inside forms, without enclosing them in containers.
• ROU-4202 - Now, the ScrollToElement client action was improved to check if the element exists after the ScrollDelay is applied. This will guarantee better control to the users for validations and showing elements on the page based on conditions.
• ROU-4203 - Now, the Tooltip and DropdownServerSide can be used outside an OutSystems Layout. The detached elements are now moved to the active-screen element level on the DOM.
• ROU-4217 - Fixed an issue that caused the OnScrollEnding list event not to be triggered. This occurred when lists were placed inside the Tabs component. Now, according to the Tab component Height input variable, the overflow will be applied accordingly.
• ROU-4223 - Fixed an issue that caused the Sidebar to close on some unwanted scenarios. This occurred when any element placed inside Sidebar was detached and moved to the body level. Now, the Sidebar will only close if we click on the overlay or via client action.
• ROU-4224 - Fixed an issue that caused the DropdownServerSide component not to properly be initialized in the disabled state. This occurred when the IsDisable configuration was initialized with True.
• ROU-4225 - Fixed an issue that caused the Date Picker's balloon (DatePicker, DatePickerRange, MonthPicker and TimePicker) not to be properly positioned. This occurred when it was used on a LayoutSideMenu with RTL enabled.
• ROU-4227 - Fixed an issue that caused the Tabs component active’s indicator to be misaligned when using Edge. This occurred when Tabs were on a screen running on Edge and using the browser’s zoom. For now, only Safari will not cover this use case, being a known issue.
• ROU-4228 - Fixed an issue that caused the DropdownSearch, DropdownTags and DropdownServerSide to not behave properly when using the Open/Close client actions in runtime. This occurred due to an event conflict related to the Body OnClick event when the developer didn’t implement a setTimeout on their end.
• ROU-4232 - Fixed an issue on the Pagination component that was causing the Keypress event not to be properly removed. Now, the Pagination will only have at maximum one Keypress event, when the ShowGoToPage option is used.
• ROU-4241 - Fixed an accessibility issue that caused the Dropdown Search and Dropdown Tags components to not allow Screen Readers to read the option selected using the keyboard. This occurred when using the keyboard key Tab with the dropdowns opened, which resulted in the focus being on the window itself and not on the right element.
• ROU-4245 - Fixed an issue that caused the DatePicker to return a Null Date. This occurred when setting the MaxDate to CurrDate() and clicking on the Today Button.
• ROU-4259 - Fixed an issue that caused the Sidebar to close when a Popup was closed. This occurred when closing a Popup with an open Sidebar.
• ROU-4263 - Fixed an issue that caused the date icon misalignment when input was used as a Date or a DateTime type. This issue was introduced with the latest versions of Chrome, pushing the icon to the left, and ignoring the flex properties.
• ROU-4277 - Fixed an accessibility issue that caused the Dropdown Search and Dropdown Tags components to not allow Screen Readers to read the option items properly while navigating through options using the keyboard. This occurred when navigating on the list using the keyboard keys Arrow Down and Arrow Up. Now, the use case works fine with Windows Narrator and Apple's VoiceOver and, using NVDA it will always say 'blank' first but then reads the option correctly.
• ROU-4280 / RPM-4155 - Fixed an issue on the Tabs component that was causing rendering issues. This occurred when changing CSS properties on the screen, which would cause the Tab's width to readjust. The accessibility was also improved, as now the TabsContentItem itself will receive focus, as per W3C recommendations.
• ROU-4317 / RPM-4004 - Fixed an issue on the Date Pickers that caused the date not to be properly updated in the provider’s input.
  This occurred when the input was set as editable and the end user pasted a date directly into that input or when typing the date and clicking outside. This issue was introduced by the Flatpickr provider’s library in version 4.6.13.
• ROU-4328 - Improved the implementation of the client action AddFavicon in order to have a more explicit way to avoid adding multiple favicon tags to the DOM.
• ROU-4333 - Fixed an issue on the TimePicker and MonthPicker components that were not updating properly the associated value. This occurred when these components had platform variables bound.
• ROU-4343 - Fixed an issue that caused the DatePicker and DatePickerRange to not recognize the Norwegian Bokmål (nb-NO) language. Also, the ‘en' was set as a default language code so that, if a given language does not exist a console error will be shown without blocking screen rendering. This occurred when setting a non-existing language during the screen initialization.
• ROU-4355 - Now, Dropdown Search and Dropdown Tags will be using the latest version of their library provider (VirtualSelect v1.0.39).
  This version also brings new extensibility configurations that were added to the VirtualSelectConfigs structure that contains the properties available on the SetVirtualSelectConfigs client action - ariaLabelText, emptyValue, search, searchFormLabel, searchGroup, searchNormalize, showDropboxAsPopup, textDirection. Now, Dropdown Search and Dropdown Tags components will allow a normalized search (ignoring diacritics).
• ROU-4360 / RPM-3730 - Fixed an issue that caused the Dropdown Search and Dropdown Tags components not to close. This occurred when the end-user was fast enough to open the dropdown before all data was loaded.
• ROU-4378 - Fixed an issue that caused a Button platform widget to have its text misaligned. This occurred when the Button was placed inside the Footer placeholder of the Layout Native and enclosed in a container. The fix can cause a potential visual breaking change in the button’s height.
• ROU-4400 / RPM-4139 - Fixed an issue that caused the Sidebar component not to close when clicking on the Overlay. This occurred when using a Sidebar component inside another Sidebar.
• ROU-4408 - Now, German (de-DE) is available in Multilingual Locales.

ODC release of version 2.12.0 (2023-04-17)

• A new high-code event is now triggered when the setProviderConfigs is applied.

Note:

• This release has the 1.1.2 numbering in ODC that was not aligned previously with the O11 release cadence, being equivalent to version 2.12.0

Release of version 2.15.0 (2023-03-27)

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 its 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.

Release of version 2.14.0 (2023-01-23)

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 v1.4.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).

Breaking changes

• Now, the DEPRECATED_jQuery script was removed, as informed in the previous version 2.8.1. If you wish to continue using this library, please import the JQuery version you want to your application scripts folder. This will cause a breaking change if you're referencing this script.
  To keep using the same jQuery version, you can download it here.
• Themes and Scripts reorganization into folders will need consumers to have their references refreshed.
• Now, some of the utility client actions that use the OutSystems UI API return an error message, code and success for a more consistent error handling, so consumers will need to have their references refreshed.
• 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, so consumers will need to have their references refreshed.

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.