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 attributefull-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
andellipsis
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 witherror | warning | success
values for more accessible indication of states;icon
prop allows to display an icon next to the text;
- renamed from
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 tooptional-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 textoptional-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 from300px
to100%
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 structuredisabled
elements (tabs or panels missing/disabled situations); - Issues with
required
attr onr-input
,r-select
,r-textarea
and validation (happend in Stencil project); r-input
,r-select
,r-textarea
now havename
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>
varianttext-link
now has button dimensions.hamburger-menu
andlink-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>
.
- Affected in this version:
- Thoroughly redesigned focus styles across all components. Visibility is improved regardless of background color, and presentation is more
Changed
<r-icon>
accepts any formats tocolor
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 iftype='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>
attributeswidth
andheight
were removed (usesize
instead) –<r-icon>
attributefill
was removed (usecolor
and css variables instead)
- now has standardized
- Update the
background-color
of the arrow when expanded inr-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 resolvesicon-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>
attributevariant
removed - Breaking change:
<r-radiobutton>
attributevariant
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 thehref
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
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/.