Date: 2024-11-14 11:05:00
Enhancements
- Datagrid: columns can be hidden by default.
Fixes
- Password Input: copy button now works in iframes.
- Modals: inner content now can be scrollable.
- Tooltip: fixed screen reader bug.
- Multiselect: false value doesn’t appear as empty string anymore.
Icon Library Updates
Deprecation
- "iframe-fit" component has been deprecated.
Date: 2024-10-10 11:25:00
Enhancements
- Checkbox: added ability to use different checkbox labels for screen readers through “sr-label” attribute.
- Theme selector: UI theme now can be changed based on system settings.
- Utility: API for user authentication (thank you Security Team!).
Changes
- Datagrid: added tooltip to column sort button.
- Datagrid: bulk action accessibility improvements.
- Date-Time Picker: accessibility improvements.
- Pagination: screen reader accessibility improvements.
Fixes
- Datagrid: fixed bulk selection display issues.
- Dialog Action: fixed issue with disabled state.
- Icon: fixed display issues in dark mode.
- Order: fixed display issues.
Date: 2024-09-10 14:20:00
Enhancements
- Datagrid: search function now searches in the items' non-visible data.
- Datagrid: added feature to manually hide-show columns.
- Dropdown: buttons with “data-open-disabled” option won't open popup.
Changes
- Action List: search query is cleared on disconnect.
- Datagrid: HTML columns are sorted by text content (excluding HTML tags).
- Datagrid: Searching Numeric columns return results for both source and formatted data.
- Datagrid: Searching Time columns only return results for formatted data.
Fixes
- Button: fixed screen reader accessibility issue for icon only buttons.
- Datagrid: fixed rendering issue on window resize.
- Datagrid: loading performance improvements.
- Validator: fixed spacing issue.
Date: 2024-08-12 14:05:00
New Releases
Ellipsis: the Ellipsis component truncates text by number of rows and appends an ellipsis at the end.
Enhancements
- Datagrid: new "List" column type.
- Validator: added support for buttons.
- Separator: added faint variant.
- Duration:
max-precision
attribute can define the largest unit to display (e.g. minutes).
Changes
- Duration: support for screen readers.
- Duration: changed UI text, made localization easier.
- Time Picker: support for screen readers.
- Accordion: support for screen readers.
- Truncate: support for screen readers.
- Select: support for screen readers.
- Multi Select: support for screen readers.
- Disabled state in components: cursor changes to
not-allowed
.
Fixes
- Dialog: fixed focus when Dialog is opened from iframe.
Deprecation
- Deprecated unused color tokens (e.g.
gray-850
).
- Deprecated legacy component "Info Layer".
Date: 2024-06-04 11:55:00
New Releases
Component List and Collections: we've been doing some housekeeping here on the documentation site, to make it easier to find components! From now on, you'll find an alphabetical list of all our main components under the Components section. And under the new Collections section, you'll find various component sets based on use-case (e.g. creating forms), function (e.g. data input), looks (e.g. floating), and other attributes!
Enhancements
- Password Input: added read-only state.
- Password Input: clicking the copy password button shows feedback.
- Rule List: added read-only state.
Fixes
- Tooltip: fixed bug affecting screen readers.
Guidelines Updates
- Toolbox: rewritten examples.
Date: 2024-05-09 10:55:00
New Releases
- Separator: the new Separator web component can be used both horizontally and vertically, and also display a text label.
Enhancements
- Action List and Select: the new "item limit" feature limits how many options are loaded in the list. This fixes performance issues when there are too many items. The default value is 1000, but can be overwritten with the
item-limit
attribute.
- Card: added support for labels in hover state.
Changes
- Chart: improved display for null values.
Fixes
- Button: fixed alignment for back button in dialog.
- Date-Time Picker: fixed issue with AM-PM selectors when changing time.
Date: 2024-04-04 09:15:00
New Component
- Rule List: this new component is replacing Rule Builder. We've made it more flexible by removing use-case specific features, and enabling product teams to build their own logic.
Enhancements
- Utility Function: the
getTopOrigin
method helps navigate in Suite from iframes by returning the origin of the top window.
- Layout: in
.e-layout__content_vertical
blocks, sections will be placed vertically, not horizontally.
- Datagrid: bulk action buttons can be disabled, and a tooltip can be displayed for them.
- Datagrid: dispatching event on selection in bulk select mode.
Icon Library Updates
Added new icons: logo-line
, logo-mparticle
, logo-viber
, logo-whatsapp
.
Deprecation
- Rule Builder (has been replaced by Rule List)
- Datepicker and Date Select (replaced by Date-Time Picker)
- Top Nav
Date: 2024-02-08 09:20:00
Enhancements
- Charts: line charts now display
null
values as greyed-out "data not available" areas instead of not displaying anything at all.
- Datagrid: added support for custom empty state and error state.
- Tab Bar: added support for screen readers.
- Tooltip: added support for screen readers.
Changes
- Datagrid: the empty state in Datagrid now uses Illustrated Message.
- Date-Time Picker: updated error message upon validation so it's more concrete about the nature of the error.
- Input: changed component height.
Fixes
- Tooltip: fixed issue where disabled tooltips could be selected with tabbing.
Icon Library Updates
- Added new icon
ai
.
- Renamed icon
update
to insert
(kept original name as alias).
Deprecation
- Deprecated the Token Input component.
- Deprecated the old Emoji and Emojipicker components.
Date: 2024-01-09 12:05:00
Changes
- Dialog Action: added support for keyboard focusing.
- Colors: removed old utility colors.
Fixes
- Password Input: the password input now sends one event instead of two events.
- Select: disabled items are no longer recognized as selection in JavaScript.
Icon Library Updates
- Added new icon 'logo-sinch-engage`.
Deprecation
- Deprecated the "Upgrade" component, which was used to show upselling and cross-selling opportunities to our customers.
Date: 2023-12-13 10:40:00
Enhancements
- Multiselect, Action List: the number of items selectable by the user can be limited with the
selection-max
attribute.
- Slider: added support for fraction numbers.
- Flex Grid: added class for a full-height grid, with both horizontal and vertical alignment.
Changes
- Icons: the Icon component is now displaying icons as webfont glyphs instead of SVGs.
- Action List: made component work better with screen readers.
- Step Bar: made component work better with screen readers.
Fixes
- Notification: component now uses color tokens instead of legacy colors.
- Popup Panel: fixed issue where clicking an element with a tooltip didn’t close other open popups.
Icon Library Updates
- Updated graphics for
edit-copy
and edit-paste
icons.
Documentation Site Updates
- Added Product Components section, for less generic components which are designed to be used by specific Emarsys products.
Date: 2023-11-06 14:50:00
Enhancements
- Step Bar: changed behavior for numbering steps. Steps now will increase the number count, even if the step doesn't display a number but an icon, unless it's excluded from this logic using the
count-excluded
attribute.
Changes
- Truncate: component is now screen reader accessible.
- Button: changed look to match the latest Horizon update.
- Input: changed look to match the latest Horizon update.
- Table: selected row now has a blue background to match Horizon style.
- Removed "glow" effect from most components to match the latest Horizon update.
Fixes
- Checkbox: fixed issue with displaying the indeterminate state icon.
- Multiselect: fixed issue where disabled options could be removed.
- Datagrid: fixed issue with autofocus.
Icon Library Updates
- Added
wallet
, logo-x
, logo-google-analytics
Documentation Site Updates
Date: 2023-10-05 13:40:00
Enhancements
- Emoji Picker: the new Emoji Picker component is replacing the old Emoji Input component. The main enhancement of the new component is the ability to use the picker panel on its own, without depending on the Emoji input field.
Changes
- Added theming support for components used in the HTML email editor and the Block-based email editor.
- Added theming support for legacy components to avoid issues in the products.
- Chart component: uses color tokens to support theming.
- Color token usage are now more consistent across components.
Deprecation
- Emoji Input component is replaced by Emoji Picker.
Date: 2023-09-14 10:50:00
New Releases
-
Dark Theme: we're excited to announce that the Emarsys Design System now supports themes! 🎉 It's a long-awaited feature, and we've had to make huge changes under the hood to enable our UI Framework to work with multiple themes. The first new theme we added is the dark version of the default Horizon theme, called Evening Horizon. Emarsys users can switch between themes by opening the "Appearance" options under the Profile menu.
-
Image Component: the new Image Component can display image assets from our shared image library, so products can easily pick logos and illustrations to show on their UI without the need for them to host it.
Enhancements
- Action list: the component now sends events when a list item is hovered or focused.
- Chart: animation now can be disabled for charts.
- Chart: data now can be highlighted to make it more prominent.
- Popup: we added a new keyboard accessibility option to our Popup Component called ”loop focus”, which keeps the tab focus in the popup until the user closes the popup.
Changes
- Switch: updated visual style for hover state.
- Tooltip, Popup Panel, Dialog: we increased the contrast of the borders for better accessibility and better theme supports.
Fix
- Datagrid: the Multiselect component now won't close when an item is selected.
- Login Page: fixed style bugs on components used on the Login Page.
Date: 2023-08-09 10:45:00
Enhancements
- Datagrid: added event for sorting columns.
- Slider: added attribute to hide the bubble over the slider’s thumb.
- File Upload: added disabled state.
Changes
- Navigation: added support for screen readers (accessibility).
Date: 2023-07-12 12:15:00
Enhancements
- Radio Button: added semantic styles (warning, success, etc.).
- Color Picker: clicking the color swatch next to the HEX code in the color input now brings up the browser's native color input interface. The look and functionality of this interface will vary between OS-es and browsers, but generally it enables the user to choose a color from the full spectrum, and also pick any color from the screen to use.
- Rule Builder: added ability to access any values in templates.
Changes
- Action List: single select and multiselect modes now use different checkmarks icons for selected items.
Fixes
- Icons: fixed icon display issue when 3rd party cookies were blocked in the browser.
Guidelines
Icon Library Updates
- Added
e-editable
and e-email-preview
Other
- We started to display commit messages in a categorized manner for
ui-framework-service
on its GitHub Releases page, which is essentially a "rawer" version of this Release Notes section. Give it a look!
Date: 2023-06-07 10:15:00
Enhancements
- Action List: list items now can be colored with the
color
attribute.
- Date-Time Picker: start date, end date, and preset selector can be disabled individually.
- Time Picker: added disabled state.
Changes
- Notification: added countdown indicator for Notifications that disappear automatically.
- Notification: component is now keyboard accessible.
Icon Library Updates
- Added
e-logo-tiktok
, e-logo-tiktok-clr
, e-twitter-clr
, e-linkedin-clr
Date: 2023-05-12 15:10:00
Enhancements
- Rule Builder: the component now can validate with custom summary.
- Rule Builder: support for checkbox, radio button, and switch components.
- Rule Builder: rules now have an error state, and the component provides an API to validate the content.
Fixes
- Inputs: fixed issue that made inputs appear incorrectly on darker backgrounds.
- Datagrid: fixed issue that resulted in duplicate selection in Bulk Edit mode.
Date: 2023-04-06 16:50:00
New Releases
Horizon Icons: we've updated the icons in our library to match the Fiori Horizon icon style. The content of the icons didn't change, only their style, so they should work well in their existing place on the UI.
Enhancements
- Numeric: currency now can be formatted with 3 letter currency code with
type=currency-code
.
- Notification: added support for auto-close through HTML insertion.
- Rule Builder: templates now support select, multiselect, and date-time.
- Rule Builder: added read-only and disabled states.
- Date-Time Picker: added
content
property that gives back human readable string instead of the default machine readable value.
- Emoji Picker: added keyboard accessibility.
- Accordion: now has
open
and close
events, which can be used to change the title of the accordion based on their opened-closed state.
Changes
- Multiselect: "Select All" button has been moved to the footer.
- Humanize: changed abbreviations in some languages (German, Spanish, Czech).
- Rule Builder: editing and adding rules now display the rule’s name.
- Suggest Input: "Use…" button has been moved to the footer.
- Datagrid: moved column sorting and column settings button in right-aligned columns.
- Date-Time Picker: added labels and buttons.
- Emoji Picker: iterated on the look and feel of the emoji picker.
Fixes
- Rule Builder: fixed issue when editing the rule’s name, it started editing the group's name.
- Rule Builder: fixed issue where summary was not displayed properly when loaded via javascript.
- Accordion: fixed issue when content didn't work with event handlers and javascript.
- Popup Utility: cleans up global event handler.
Guideline Updates
Icon Examples: removed deprecated color variants.
Icon Library Updates
Date: 2023-03-07 10:05:00
Enhancements
- Tab Bar: label and icon now can be hidden separately.
- Numeric: now can humanize 1024-base content with
type=digital-binary
.
- Popup Panel: added semantic styles.
- Widget: added semantic styles.
- Illustrated Message: now can handle small-sized icons.
- Datagrid: added support for humanized output for numbers in numeric columns.
- Token Input: improved keyboard accessibility.
- Color Picker: improved keyboard accessibility.
Changes
- Rule Builder: changed gray background to white background.
Fixes
- Input: fixed issue where the read-only input didn't have the correct background color.
- Dialog: fixed issue where the drop shadow of the dialog was cropped by the shell bar.
- Notification: fixed issue where notifications couldn't be closed inside dialogs.
- Dialog: fixed issue where the destructive button didn't appear in the correct style.
- Validator: fixed issue with changing text color when status was set via javascript.
- Radio: fixed misaligned graphic in the block radio variant.
Date: 2023-02-06 14:55:00
Enhancements
- Multiselect: value setter can be used to set the value of the selected item via JavaScript.
- Datagrid: time columns with duration type has precision now.
- Colors: added contrast spectrum for chart colors (
chart-01-100
to chart-01-900
)
- Color Picker: combined color picker input and color picker panel into a single color picker web component for better accessibility support.
- Time Picker: input value now loops.
- Time Picker: the inputs now can have empty state.
- Duration: now handles milliseconds.
- Typography: added monospace font family as available CSS style.
Changes
- Updated focus style for inline links and helper links.
- Utility: “target=_blank” now can be used in sanitization.
- Select: the component now doesn’t throw change event when selecting an already selected event.
Fixes
- Button: updated style for link buttons.
- Tooltip: fixed performance issue when too many tooltips were on the page.
- Date-Time Picker: fixed issue with keyboard accessibility.
Guideline Updates