Your bookmarks

Road to React 1.0.0

All needed adjustments in Orbit React components for an upcoming major release.

We aim to release major React components release it during October 2019.

Main tasks

WhatStatus
Sketch v1.0.0โœ… Released
Dictionary for strings inside of Orbit componentsโœ… Released in 0.40.0
Z-index Framework
There is a mess in frontend z-indexes, this should fix it.
๐Ÿงช Defined, currently in testing
New icons
We will replace icon set with one that works better with new typography โ€“ it’s more rounded and personal.
โœ… Released in 0.61.0
Improving the accessibility of colorsโœ… Released in 0.42.0
Improving the accessibility of componentsโณ In progress
Check status in Jira (only Kiwi.com)
Reviewing the API
We know that we’ve got some inconsistencies inside the API of our components. We need to review it and make consistent as much as we can.
โณ In progress
Check planned breaking changes
Error/help states for inputs
We have an ongoing problem with error and help texts in our form inputs โ€“ it’s not possible to have more than 1 line.
๐Ÿ•ฐ Moved to 2.0.0

New components

New componentStatus
Popoverโœ… Released in 0.39.0
Show component
SkipNavigationโœ… Released in 0.40.0
Show component
Paginationโœ… Released in 0.48.0
Show component
Layoutโœ… Release in 0.44.0
Show component
Sliderโœ… Released in 0.51.0
Show component
Collapseโœ… Released in 0.52.0
Show component
Truncateโœ… Released in 0.53.0
Show component
CalloutBannerโœ… Released in 0.51.0
Show component
PricingTableโœ… Released in 0.61.0
Show component
Drawerโณ In progress
Show how it looks
NavigationBarโณ In progress
NavigationListโณ In progress

Planned breaking changes

As much as we want to not do any breaking changes, we also need to do some bigger refactoring, visual or interaction update or support consistency across all components. We aim to bring all breaking changes (code & visual) to this update, so we are not handling them separately.

ComponentChangeDescriptionMigration guide
ButtonGroupDeprecation of connected property.
ButtonGroup will be connected by default.
Use Stack component for unconnected behavior.Migration can be done before v1 release.
DestinationCardNew look + properties refactoringWe need to make it less specific to prepare it for future component changes, it means removing some props and introducing new.
Form componentsVisual breaking change.We have an ongoing problem with error and help texts in our form inputs โ€“ it’s not possible to have more than 1 line.
TripSector & TripSegmentRenaming to ItinerarySector and ItinerarySegment.Based on company’s definitions how to name itinerary parts.
CardRenaming subTitle to description.Consistency reasons.
ButtonRenaming block to fullWidth.Consistency reasons.
ButtonType of width will change to string.We need to support more flexibility in usage of this property.
TileRenaming expanded to initialExpanded.Consistency reasons.
SkipLinkRenaming description to buttonLabel.
SliderRenaming min to minValue. Renaming max to maxValue.
InputFileRenaming title to buttonLabel.
PortalRenaming element to renderInto.
Heading, Text, Layout & GridRenaming element to as.
TextLink, Button & ButtonLinkRenaming component to asComponent.
ChoiceGroupRenaming labelElement to labelAs.
RatingStarsDeprecating color attention.No more needed. Use primary that has the same shade of ink color.Can done before v1 release. Change use of attention to primary.
IconsDeprecating color attention.No more needed. Use primary that has the same shade of ink color.Can done before v1 release. Change use of attention to primary.
TextDeprecating color attention.No more needed. Use primary that has the same shade of ink color.Can done before v1 release. Change use of attention to primary.

Icons

We will switch to a new icon set and it’s possible that some icons will be renamed.

Old nameNew name
airplaneOffairplaneUpOff
baggageNonebaggageCheckedNone
gpsgpsFixed

Icons going to be deleted

There are some icons which are going to be deleted with coming release of 1.0.0 version. Please replace these icons in advance by following icons:

Icon nameReplace by
airplaneRightairplane
ticketFlightticket
ticketTrainticket
loadingLoading component
routeNoStopsStopoverArrow component
routeOneStopStopoverArrow component
routeTwoStopsStopoverArrow component