Release Notes

Truncate Component

Date: 2021-02-05 12:45:00

Using our brand new Truncate component, it's super easy to cut long words and sentences into a shorter form. Just set how many characters you want to display, and the Truncate component will do the dirty work. You can also set how many characters you want to preserve from the end of the long word, in case you want to cut out the middle.

This functionality is super helpful when you have to design with user generated content, where you cannot be exactly sure how long values will be.

Learn more about this component on its documentation page

Better Datagrid Search

Date: 2021-02-05 12:40:00

We've expanded the search functionality in our Datagrid component. You can now search for multiple keywords, and also use quotation marks to search for exact matches. You can check it out in action on the documentation page

Duration Utility

Date: 2021-01-22 12:40:00

With the new Duration utility, there's now an easy way to format a duration in seconds in a human readable way. Previously this functionality was only available in the Datagrid component. Learn more about this utility on its documentation page

Time Picker Component

Date: 2020-12-11 12:40:00

We've introduced a standalone Time Picker component! Up until now, this handy input was only available as part of the date-time picker - but now, it can be used on its own, giving our users the power to select hours and minutes easily. Learn more about this component on its documentation page

Notification Component

Date: 2020-11-23 10:00:00

The new Notification component merges our old Notice and Alert components into one neat, flexible web component! This new component can be used in a myriad of different ways: for displaying useful heads-ups inside the page, or floating an error message over the whole layout. You can check out this new component at the design system website

2020 Redesign

Date: 2020-11-23 09:50

Just a while ago, we've gone public with our Emarsys redesign. This was the first major design iteration on the Emarsys UI in more than 4 years, and so far we've received incredibly positive feedback from both our customers and our colleagues! There are so many things this redesign contains, including:

  • A new vertical navigation sidebar with overhauled information architecture.
  • An improved look and feel that brings the Emarsys UI closer to the Emarsys brand with fresh colours and typography.
  • Icons have been redrawn to have a unified style.
  • A nicer and more usable login page.

Upgrade Component

Date: 2020-09-24 13:00:00

Please welcome our new family of components: e-upgrade. The various Upgrade components can help teams introduce upgrade opportunities for our beloved customers, to boost the capabilities of the Emarsys products they use.

New Components:

  • Upgrade components
  • Layout component, back button in page title

New Utilities:

  • CSS Utility Classes: border utilities added
  • Translation: you can get translations for your product via the suite

New Features:

  • The empty state of action list can now be customized
  • Select now has a loading state
  • Numeric component can auto-trim values (i.e. ditching unnecessary zeroes from the end of the value)

Fixes:

  • e-datetimerange: AM / PM issues were fixed

Updates for 2019 May

Date: 2020-05-16 12:05:00

You know how the saying goes: "pepper is small, but strong". This update is just like pepper.

  • e-actionlist: you can now hide the search field with the search-hidden attribute.
  • trackEvent(): implement analytics using our new trackEvent() JS utility. Read more about it in [Utility / Tracking](/utilities/functions/tracking.
  • CSS Border utility classes: add borders to your components with ease. Find out more in CSS Utility Classes.

Coming Soon: New Navigation

As you might already know, we're working hard on a brand new navigation bar — and since you've made it this far, let us reward you with a small sneak peek…

Widget

Date: 2020-01-03 16:10:00

Introducing the e-widget. Widgets are ideal to display standalone data, like charts and tables — but they can also be used to include some controls that make sense on their own. Widgets feel right at home in dashboard-like pages. Head over to the guidelines page to see some pointers and examples.

New Components:

  • e-inputgroup: "stick together" certain input components, like text input fields and buttons. Help a lot with rounded corners, too!

New Features:

  • e-select: a borderless variant has been added.

The Salesperson Update

Date: 2019-09-24 12:40:00

Please welcome our new family of components: e-upgrade. The various Upgrade components can help teams introduce upgrade opportunities for our beloved customers, to boost the capabilities of the Emarsys products they use.

New Components:

  • Upgrade components
  • Layout component, back button in page title

New Utilities:

  • CSS Utility Classes: border utilities added
  • Translation: you can get translations for your product via the suite

New Features:

  • The empty state of action list can now be customized
  • Select now has a loading state
  • Numeric component can auto-trim values (i.e. ditching unnecessary zeroes from the end of the value)

Fixes:

  • e-datetimerange: AM / PM issues were fixed

The Criteria Update

Date: 2019-03-29 12:35

We're introducing a new component: e-criteria. This component provides an easy-to-use interface for users to set up complex queries to filter a dataset. It's ideal for finding resources based on multiple criteria – e.g. segmentation, filtering for users, filtering for products, etc.

New Documents

  • Design Principles
  • Contribution Guideline
  • Documentation for utility functions: Flipper Service, Config, Authentication Token
  • Sample component (available in GitHub only)

New Features

  • e-actionlist: items now can be defined by item setter
  • e-actionlist: max-height now can be defined
  • e-datagrid: added search-keyword and search-keys attributes
  • e-datagrid: individual words in search query are now processed (e.g. the item "hello beautiful world" will be found when searching for "hello world")
  • e-datagrid: added Multiselect filter
  • New utility class: .e-hoverable
  • Presets can be hidden in e-datetimepicker and e-datetimerange with the attribute presets=hidden
  • e-device: now compatible with VCE components

Fixes

This time we don't want to lengthen the release note with the countless small fixes we've done — you can find them all in the repo's GitHub history.

Updates for 2018 November

Date: 2018-11-05 11:20

Breaking Change

  • The e-datagrid select filter now returns a value without the "option-" prefix.

New Features

  • New icons for various Email Campaign types: e-email-block-based, e-email-custom-html, and e-email-template-based.
  • e-dialog now has an "opened" property.
  • e-validator now has an "opened" property, and now dispatches an event on open and on close.
  • e-select now has a loading state.
  • e-actionlist now has a loading state.
  • Added documentation for config-service.
  • Added documentation for authentication token service.
  • Added a new help color, to be used for tooltip icons.
  • Datagrid filters now have a "custom" attribute. When enabled, you can override the default logic of the filter with your own custom logic.

Improvements

  • .e-label-outline labels are not in uppercase anymore.
  • Checkbox filters in datagrid can contain tooltips.
  • e-actionlist has two empty states: one for no data, one for no search results.

Bug Fixes

  • e-datepicker does not dispatch an event when disabled.
  • Datagrid filters are laid out in multiple rows if they can't fit in a single row.

Action List Component

Date: 2018-09-07 11:10:00

We're introducing e-actionlist, a brand new component which can display a list of actions — kind of like the list that's opened by our e-dropdown component. The items are searchable, group-able, and can have various different states.

This component will be used by Personalization, when users are inserting tokens: clicking on the "Insert Personalization" button brings up an Action List full of tokens, and the token is automatically inserted when the user picks it from the list.

As always, if you feel like you have something that could be replaced by this new component, go ahead and implement it — or if you'd like to have it expanded by new functionalities for your product, get in touch with us!

New Features

  • e-datetimepicker handles ISO datetime string (without timezone)
  • e-datagrid can display errors from server-side
  • e-numeric can display numbers in humanized format (e.g. 200K)
  • e-style icon
  • e-dialog handles HTML in headline attribute
  • e-daterangepicker-preset handles last hour(s) (e.g. "Last 6 hours")

Improvements

  • e-multiselect dispatches events for clear and select all
  • e-datepicker dispatches event on clear

Bug Fixes

  • e-datetimepicker time parsing if value is not a datetime
  • e-datepicker disable state in e-input fixed