1.1.1 (2024-08-23)

🩹 Fixes

• select: horizontal scroll can appears on focus [DSYS-948]
• select: disabled option has no visual indication in Safari [DSYS-949]
• select: validation of the select value no key events [DSYS-950]

1.1.0 (2024-08-20)

🚀 Features

• checkbox: constraint validation API support [DSYS-931]
• radio-group: component added and radio-button constraint validation is thereby supported [DSYS-932]
• select: general overhaul to align better with native select behavior. Can affect how width of element is calculated, use CSS custom property --width to customize. Optionally use attribute full-width as a shortcut.
• icon: added upload-document

🩹 Fixes

• button: hover state unification [DSYS-934]
• select: align constraint validation to native select behavior [DSYS-892]
• select: fix required validation bug [DSYS-892]
• select: fix autocomplete showing up incorrectly [DSYS-892]

1.0.1 (2024-06-25)

🩹 Fixes

• alert: styleUrl was incorrect causing crash on import
• tabs: remove excessive focus style

1.0.0 (2024-06-25)

☀️ Major changes

This version introduces support for dark mode for all components. It requires @riverty/design-tokens or @riverty/css-framework at version 1.0.0 or higher. The updated color structure also means improvements throughout the default light mode. Color mode (or, ‘theme’) switching is fully opt-in.

Components are now created with Stencil version 4. This may be relevant to consider for package users who are also using Stencil themselves. For others, the change should mainly mean better stability and performance.

Support for modern bundlers like Vite now is better, without extra configuration needed. (Details: Stencil’s enableImportInjection flag.)

🚀 Features

• alert: new component [DSYS-843]
• button: support custom icon [DSYS-831]
• select: max-width follows native select behavior [DSYS-775]

🩹 Fixes

• badge: fix cut out top border [DSYS-885]
• button: click event no longer triggered in disabled state [DSYS-867]
• icon: correct credit-card and ellipsis stroke color [DSYS-863]
• input: error message missing icon [DSYS-877]
• select: fix scrollbars may be shown in front of every dropdown option [DSYS-894]
• select: correct placement of error hint
• pagination: arrow icon was invisible due to size bug [DSYS-881]

0.16.0 (2024-05-24)

🚀 Features

• All form-related components support the standard novalidate attribute [DSYS-815]
• icon: added to Riverty kit:
  • building-office, organization-chart, user-avatar-multiple, user-avatar-with-bars, user-avatar-with-exclamation-mark [DSYS-833]
  • pie-chart [DSYS-839]

0.15.0 (2024-05-14)

🚀 Features

• accordion: new structure to provide more accessible parts and roles (old structure supported but upgrade recommended) [DSYS-520]
• icon: ellipsis added to Riverty icon kit [DSYS-777]
• textarea: support Constraint Validation API [DSYS-751]
• select-option: added icon position, size, color [DSYS-814]
• select: constraint validation support [DSYS-811]

🩹 Fixes

• r-form-hint updated to r-hint + variant [DSYS-809]
• input: correct icon size to fully align with intended design [DSYS-746]
• select: fix option long value overflow [DSYS-778]
• select: collapse dropdown when tabbing out [DSYS-810]
• select: blank value change reveals ‘undefined’ [DSYS-816]
• select: select-option initial value definition [DSYS-816]
• select: change value collapsing dropdown on change event [DSYS-816]
• select-option: define value if undefined [DSYS-818]

0.14.0 (2024-04-19)

Added

• list item: added new list item component, also released in Figma [DSYS-493]
• form elements (input, checkbox, textarea, select, radio-button) display r-color-semantic-red-100 background color in error state;
• r-hint:
  • renamed from r-form-hint
  • variant prop with error | warning | success values for more accessible indication of states;
  • icon prop allows to display an icon next to the text;

Fixes

• textarea: fix placeholder color is incorrect [DSYS-743]
• checkbox: fix checkbox data missing in formData [DSYS-744]
• input: correct focus order for input with tooltip [DSYS-745]

[0.13.0] - 2024-03-15

Changed

• Breaking change: attribute optional-marker renamed to optional-text.
• Breaking change: re-named r-label properties:
  • icon -> tooltip-icon;
  • icon-color -> tooltip-icon-color;

Added

• Added support for form validation using standard Constraint Validation API. We are first trialing it in the Input component.
• <r-label>, <r-input>, <r-select>, <r-textarea> now support:
  • optional - boolean to allow displaying optional marker next to label text
  • optional-text - provides an ability to use custom text as an optional marker
• New icons added to Riverty set, namely: currency-dollar, currency-euro, credit-card-with-plus-sign, globe, money-coin, shield-check, splitted-circles;

Fixed

• Several internal component tweaks with improved accessibility markup.
• Fixed button type='submit' bug, where font-weight was bold.
• Fixed issue in the select component where it displays the option name instead of its corresponding value.
• Fixed bug in select component, where it defaults to displaying the first option when no value is specified.
• Fixed bug where select component wasn’t opening in Stencil app environment.

[0.12.0] - 2024-02-02

Changed

• Breaking change: Riverty set icon re-named: hamburder-menu -> hamburger;
• r-select initial max-width from 300px to 100% to be the same as other form controls;

Added

• New icons added to Riverty set: globe, money-coin, shield-check, splitted-circles;

Fixed

• r-select bug, where dynamically added options were not available for selection;
• Logic of r-tabs initial structure disabled elements (tabs or panels missing/disabled situations);
• Issues with required attr on r-input, r-select, r-textarea and validation (happend in Stencil project);
• r-input, r-select, r-textarea now have name attribute reflected, to be able to select them by attribute: [name="yourName"].

[0.11.0] - 2024-01-09

• Fix issue when consuming the package from a Stencil project. Project would fail to build because of a JSON file import.
• <r-button> variant text-link now has button dimensions.
• hamburger-menu and link-crossed-out added to default icon set.

[0.10.0] - 2023-11-20

Added

• Additional steps for Vue project added to installation guide
• Additional steps for Angular project added to installation guide
• optional indication added to <r-label> component

Changed

• CSS structure refactored and unified.

Fixed

• Bug, causing components with disabled="false" appear disabled

[0.9.0] - 2023-10-04

Added

• Extended and improved event emitting for many components. More in the event management documentation.
  • Affected in this version: <r-textarea>, <r-tabs>, <r-select>, <r-radio-button>, <r-pagination>, <r-input>, <r-checkbox>.
• Thoroughly redesigned focus styles across all components. Visibility is improved regardless of background color, and presentation is more

Changed

• <r-icon> accepts any formats to color prop: HEX, RGB, var(…) and --r-color-….

Fixed:

• <r-icon> no longer breaks when using it from NPM within a Stencil project.

[0.8.0] - 2023-09-08

• Fixed <r-input> but that caused incorrect appearance in Mobile Safari if type='search'.
• Changed <r-icon> size to be 's' | 'm' | 'l'.
• Fixed <r-icon> to properly display remote icons.
• Added to Riverty icon kit: cookie, headset, phone-with-shield, two-speech-bubbles.
• Updated bundled documentation to no longer describe icon component as ‘draft’ or ‘preview’.

[0.7.0] - 2023-08-25

Added

• This release introduces the official Riverty UI Icon kit and incorporates it into the <r-icon> component.

Changed

• <r-icon> has been adjusted and can now be safely used.
  • now has standardized size attribute (set of pre-defined values) – <r-icon> attributes width and height were removed (use size instead) – <r-icon> attribute fill was removed (use color and css variables instead)
• Update the background-color of the arrow when expanded in r-accordion-item.
• Remove console.info when icons from Streamline are used

Fixed

• <r-accordion-item>: Ensure proper ARIA roles are in place.
• <r-tooltip>: text overflow fix., – form reset returns <r-checkbox>, <r-radio-button> state and <r-select> value to initial

[0.6.0] - 2023-05-11

Changed

• <r-accordion-item> unique-id: Unique id for each accordion item/row

• <r-pagination> API update to make some attributes more self-explaining (e.g. total -> total-pages).

• Custom icon support:

  • <r-icon>: accepts inline SVG into <slot>.
  • <r-button> accepts <r-icon> into <slot>.
  • <r-button> requires no named slots, text and icon could be passed side by side.

• <r-button> automatically resolves icon-only attribute.

Fixed

– <r-pagination> api updates – <r-icon> accepts inline svg into <slot> – <r-button> accepts <r-icon> into <slot> – <r-button> requires no named slots, text and icon could be passed side by side – <r-button> automatically resolves icon-only attribute – <r-icon> attributes update: – src used to serve SVG from remote source; – size (pre-defined set of sizes) replaces attributes width and height; – fill to pass the color that fills the icon – name way of icons data serving changed (to JSON) – <slot> can also be used to display an SVG within <r-icon> – All the components using <r-icon> as an internal instance were updated

[0.5.0] - 2023-04-15

Components added

• <r-pagination>, for browsing among a set of numbered pages.
• <r-progress-bar>, a conventional progress bar.
• <r-progress-steps>, a progress indicator for a linear sequence of steps.

Removed

• Breaking change: <r-checkbox> attribute variant removed
• Breaking change: <r-radiobutton> attribute variant removed

Changed

• Breaking change: attribute invalid passes boolean to define invalid state.
• Breaking change: attribute error passes validation error text message.
• <r-button> updates:
  • icon attribute value changed from boolean to name of an icon.
  • icon-position attribute values changed from 'right' | 'left' to 'start' | 'end'.
  • icon-only attribute added to enable button with no visible text.
• <r-select> supports initial version of filtering (‘combobox’) behavior.
• <r-icon> attribute viewBox that passes viewbox settings for svg ('0 0 24 24' by default).
• <r-form-hint> attribute invalid defines style for an error. (This component is primarily used internally by other design system components.)

Fixed

• <r-tooltip> and <r-accordion> minor visual tweaks aligned with Figma.
• <r-tabs>: disabled tab could become active.

[0.4.0] - 2023-02-20

Components added

• <r-badge>, a simple status indicator.

Changed:

• <r-button> can now behave like a standard hyperlink by setting the href attribute.
• Build using Stencil v2.22.2.

Fixed

• Tabs: state could become broken on double click (DSYS-269).
• Prevent components rendering attributes to DOM when not necessary.

[0.3.0] - 2023-02-03

Components added

• <r-label>, mostly used internally as utility component for text with possible tooltip.

Changed

• Standardize attribute name error for setting form component error text.
• Tweaked attributes for <r-icon> (which is still in tech preview).

Fixed

• Spacing between labels and form components aligned with Figma.
• Select: label is clickable.
• Tooltip: improve positioning within certain DOM structures (DSYS-260).

[0.2.0] - 2023-01-23

Components added

• Input
• Tabs
• Textarea
• Tooltip

Changed

• Breaking change: Simplify radio button usage by removing <r-radio-group>.
• Checkbox and Radio button: Align box/circle and label text to top left (DSYS-232)
• Implement spacing rules for groups of checkboxes and radio buttons (DSYS-205)

Fixed

• Misalignment in expanded Select component (DSYS-208)
• Ensure disabled checkbox is not interactive (DSYS-219)
• Console error when accordion is expanded and clicked inside (DSYS-241)
• Checkbox: buggy hint/error position (DSYS-243)
• Component events fire when not intended to (DSYS-229)

[0.1.0] - 2022-12-14

Initial published version. Read more on riverty.design/components/.