@transferwise/components 0.0.0-experimental-baf653e → 0.0.0-experimental-278276c

package/src/dateLookup/DateLookup.view.spec.js

@@ -1,5 +1,7 @@
 import { shallow } from 'enzyme';
 
+import { mockMatchMedia } from '../test-utils';
+
 import DateTrigger from './dateTrigger';
 import DayCalendar from './dayCalendar';
 import MonthCalendar from './monthCalendar';
@@ -7,6 +9,8 @@ import YearCalendar from './yearCalendar';
 
 import DateLookup from '.';
 
+mockMatchMedia();
+
 const defaultLocale = 'en-GB';
 jest.mock('react-intl', () => ({
   injectIntl: (Component) =>

package/src/dateLookup/dateHeader/DateHeader.js

@@ -1,8 +1,10 @@
+import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import { useIntl } from 'react-intl';
 
 import Chevron from '../../chevron';
 import { Position, Size, Typography } from '../../common';
+import { useLayout } from '../../common/hooks';
 import Title from '../../title';
 import messages from '../DateLookup.messages';
 
@@ -10,9 +12,9 @@ const buttonClasses = 'btn-link p-a-0 text-no-decoration np-text-body-large-bold
 
 const DateHeader = ({ label, onLabelClick, onPreviousClick, onNextClick, dateMode }) => {
   const intl = useIntl();
-
+  const { isMobile } = useLayout();
   return (
-    <div className="text-xs-center p-t-1 p-b-2 clearfix">
+    <div className={classNames('text-xs-center', !isMobile && ['clearfix', 'p-y-1'])}>
       <div className="pull-left-single-direction">
         <button
           type="button"

package/src/drawer/Drawer.css

@@ -1 +1 @@
-.np-drawer{display:flex;flex-direction:column;height:100vh;height:100dvh;justify-content:space-between;max-height:100vh;max-height:100dvh;max-width:600px;width:100vw}.np-drawer .np-drawer-header{display:flex;flex-wrap:nowrap;min-height:56px;min-height:var(--size-56);padding:24px 16px;padding:var(--size-24) var(--size-16)}.np-theme-personal .np-drawer .np-drawer-header{padding:24px;padding:var(--size-24)}.np-theme-personal .np-drawer .np-drawer-header .np-text-title-body{margin-bottom:0;padding-top:0}.np-theme-personal .np-drawer .np-drawer-header .np-close-button{margin-bottom:-8px;margin-bottom:calc(var(--size-8)*-1);margin-right:-8px;margin-right:calc(var(--size-8)*-1);margin-top:-8px;margin-top:calc(var(--size-8)*-1)}.np-drawer .np-drawer-header.np-drawer-header--withborder{box-shadow:inset 0 -1px 0 0 #e2e6e8}.np-theme-personal .np-drawer .np-drawer-header.np-drawer-header--withborder{box-shadow:inset 0 -1px 0 0 #0000001a;box-shadow:inset 0 -1px 0 0 var(--color-border-neutral)}.np-drawer .np-drawer-header .np-text-title-body{font-size:1.125rem;font-size:var(--font-size-18);letter-spacing:-.01em;letter-spacing:var(--letter-spacing-negative-xs);line-height:1.5rem;line-height:var(--line-height-24);margin-bottom:-2px;margin-right:16px;margin-right:var(--size-16);padding-top:2px}.np-drawer .np-drawer-header .np-close-button{margin-left:auto}.np-drawer .np-drawer-header .tw-icon{fill:#00b9ff;cursor:pointer;display:block}.np-drawer .np-drawer-content{flex:1;overflow-y:auto}.np-drawer .np-drawer-content,.np-drawer .np-drawer-footer{padding:16px;padding:var(--size-16)}.np-drawer .np-drawer-footer{box-shadow:inset 0 1px 0 0 #e2e6e8}.np-theme-personal .np-drawer .np-drawer-footer{box-shadow:inset 0 1px 0 0 #0000001a;box-shadow:inset 0 1px 0 0 var(--color-border-neutral)}@media (min-width:768px){.np-drawer .np-drawer-header{padding:32px 24px;padding:var(--size-32) var(--size-24)}.np-drawer .np-drawer-content,.np-drawer .np-drawer-footer,.np-theme-personal .np-drawer .np-drawer-header{padding:24px;padding:var(--size-24)}}
+.np-drawer{display:flex;flex-direction:column;height:100vh;height:100dvh;justify-content:space-between;max-height:100vh;max-height:100dvh;max-width:600px;width:100vw}@media (max-width:770px){.np-drawer{max-width:unset}}.np-drawer .np-drawer-header{align-items:center;display:flex;flex-wrap:nowrap;min-height:56px;min-height:var(--size-56);padding:24px 16px;padding:var(--size-24) var(--size-16)}.np-theme-personal .np-drawer .np-drawer-header{padding:24px;padding:var(--size-24)}@media (max-width:320px){.np-theme-personal .np-drawer .np-drawer-header{padding:16px;padding:var(--size-16)}}.np-theme-personal .np-drawer .np-drawer-header .np-close-button{margin-bottom:-8px;margin-bottom:calc(var(--size-8)*-1);margin-right:-8px;margin-right:calc(var(--size-8)*-1);margin-top:-8px;margin-top:calc(var(--size-8)*-1)}.np-drawer .np-drawer-header.np-drawer-header--withborder{box-shadow:inset 0 -1px 0 0 #e2e6e8}.np-theme-personal .np-drawer .np-drawer-header.np-drawer-header--withborder{box-shadow:inset 0 -1px 0 0 #0000001a;box-shadow:inset 0 -1px 0 0 var(--color-border-neutral)}.np-drawer .np-drawer-header .np-text-title-body{font-size:1.125rem;font-size:var(--font-size-18);letter-spacing:-.01em;letter-spacing:var(--letter-spacing-negative-xs);line-height:1.5rem;line-height:var(--line-height-24);margin-right:16px;margin-right:var(--size-16)}.np-drawer .np-drawer-header .np-close-button{margin-left:auto}.np-drawer .np-drawer-header .tw-icon{fill:#00b9ff;cursor:pointer;display:block}.np-drawer .np-drawer-content{flex:1;overflow-y:auto}.np-drawer .np-drawer-content,.np-drawer .np-drawer-footer{padding:16px;padding:var(--size-16)}.np-drawer .np-drawer-footer{box-shadow:inset 0 1px 0 0 #e2e6e8}.np-theme-personal .np-drawer .np-drawer-footer{box-shadow:inset 0 1px 0 0 #0000001a;box-shadow:inset 0 1px 0 0 var(--color-border-neutral)}@media (min-width:768px){.np-drawer .np-drawer-header{padding:32px 24px;padding:var(--size-32) var(--size-24)}.np-drawer .np-drawer-content,.np-drawer .np-drawer-footer,.np-theme-personal .np-drawer .np-drawer-header{padding:24px;padding:var(--size-24)}}

package/src/drawer/Drawer.less

@@ -7,6 +7,9 @@
   justify-content: space-between;
   width: 100vw;
   max-width: 600px;
+  @media (max-width: 770px) {
+    max-width: unset;
+  }
   height: 100vh;
   height: 100dvh;
   max-height: 100vh;
@@ -14,16 +17,15 @@
 
   .np-drawer-header {
     display: flex;
+    align-items: center;
     flex-wrap: nowrap;
     min-height: var(--size-56);
     padding: var(--size-24) var(--size-16);
 
     .np-theme-personal & {
       padding: var(--size-24);
-
-      .np-text-title-body {
-        padding-top: 0;
-        margin-bottom: 0;
+      @media (--screen-400-zoom) {
+        padding: var(--size-16);
       }
 
       .np-close-button {
@@ -44,14 +46,10 @@
     }
 
     .np-text-title-body {
-      @vertical-alignment-shift: 2px;
-
       margin-right: var(--size-16);
       font-size: var(--font-size-18);
       letter-spacing: var(--letter-spacing-negative-xs);
       line-height: var(--line-height-24);
-      padding-top: @vertical-alignment-shift;
-      margin-bottom: -@vertical-alignment-shift;
     }
 
     .np-close-button {

package/src/drawer/Drawer.story.js

@@ -2,7 +2,8 @@ import { select } from '@storybook/addon-knobs';
 import { useState } from 'react';
 
 import { Section, Button, Input, Modal } from '..';
-import { Position } from '../common';
+import { Position, Priority } from '../common';
+import { storyConfig } from '../test-utils';
 
 import Drawer from './Drawer';
 
@@ -40,7 +41,10 @@ export const Basic = () => {
         footerContent={
           <>
             <Button block onClick={() => {}}>
-              Action
+              Action 1
+            </Button>
+            <Button block priority={Priority.SECONDARY} onClick={() => {}}>
+              Action 2
             </Button>
           </>
         }
@@ -77,6 +81,42 @@ export const Basic = () => {
             onClose={handleModalClose}
           />
         </Section>
+        <p>
+          I am baby actually poke kickstarter, street art jean shorts bespoke chambray activated
+          charcoal ramps marfa shoreditch tumeric tumblr. Mixtape cred palo santo, cliche lyft marfa
+          ethical waistcoat poke jean shorts. Scenester readymade selvage disrupt pok pok. La croix
+          stumptown try-hard chartreuse.
+        </p>
+        <p>
+          I am baby actually poke kickstarter, street art jean shorts bespoke chambray activated
+          charcoal ramps marfa shoreditch tumeric tumblr. Mixtape cred palo santo, cliche lyft marfa
+          ethical waistcoat poke jean shorts. Scenester readymade selvage disrupt pok pok. La croix
+          stumptown try-hard chartreuse.
+        </p>
+        <p>
+          I am baby actually poke kickstarter, street art jean shorts bespoke chambray activated
+          charcoal ramps marfa shoreditch tumeric tumblr. Mixtape cred palo santo, cliche lyft marfa
+          ethical waistcoat poke jean shorts. Scenester readymade selvage disrupt pok pok. La croix
+          stumptown try-hard chartreuse.
+        </p>
+        <p>
+          I am baby actually poke kickstarter, street art jean shorts bespoke chambray activated
+          charcoal ramps marfa shoreditch tumeric tumblr. Mixtape cred palo santo, cliche lyft marfa
+          ethical waistcoat poke jean shorts. Scenester readymade selvage disrupt pok pok. La croix
+          stumptown try-hard chartreuse.
+        </p>
+        <p>
+          I am baby actually poke kickstarter, street art jean shorts bespoke chambray activated
+          charcoal ramps marfa shoreditch tumeric tumblr. Mixtape cred palo santo, cliche lyft marfa
+          ethical waistcoat poke jean shorts. Scenester readymade selvage disrupt pok pok. La croix
+          stumptown try-hard chartreuse.
+        </p>
+        <p>
+          I am baby actually poke kickstarter, street art jean shorts bespoke chambray activated
+          charcoal ramps marfa shoreditch tumeric tumblr. Mixtape cred palo santo, cliche lyft marfa
+          ethical waistcoat poke jean shorts. Scenester readymade selvage disrupt pok pok. La croix
+          stumptown try-hard chartreuse.
+        </p>
       </Drawer>
     </>
   );

package/src/flowNavigation/FlowNavigation.css

@@ -1 +1 @@
-.np-flow-navigation{min-height:97px;width:100%}.np-flow-navigation--border-bottom{border-bottom:1px solid #0000001a;border-bottom:1px solid var(--color-border-neutral);min-height:96px}.np-flow-navigation__content{max-width:1164px;min-width:320px;width:100%}.np-flow-navigation__stepper{padding-bottom:0!important}[dir=rtl] .np-flow-navigation__stepper{padding-right:0!important}[dir=rtl] .np-flow-navigation__stepper,html:not([dir=rtl]) .np-flow-navigation__stepper{padding-left:0!important}html:not([dir=rtl]) .np-flow-navigation__stepper{padding-right:0!important}.np-flow-navigation--xs-max .np-flow-navigation__stepper .tw-stepper-steps{display:none}.np-flow-navigation--xs-max .np-flow-navigation__stepper .progress{margin-bottom:0}.np-flow-navigation--xs-max .np-animated-label{height:auto}.np-flow-navigation--sm .np-flow-navigation__stepper{min-height:56px}[dir=rtl] .np-flow-navigation--sm .np-flow-navigation__stepper{padding-right:24px!important}[dir=rtl] .np-flow-navigation--sm .np-flow-navigation__stepper,html:not([dir=rtl]) .np-flow-navigation--sm .np-flow-navigation__stepper{padding-left:24px!important}html:not([dir=rtl]) .np-flow-navigation--sm .np-flow-navigation__stepper{padding-right:24px!important}.np-flow-navigation--lg .np-flow-navigation__stepper{max-width:562px}.np-flow-navigation--lg .np-flow-header__left,.np-flow-navigation--lg .np-flow-header__right{width:180px}.np-flow-navigation .separator{background-color:#0000001a;background-color:var(--color-border-neutral);height:32px;height:var(--size-32);min-width:1px;width:1px}[dir=rtl] .np-flow-navigation .separator{margin-right:16px!important}[dir=rtl] .np-flow-navigation .separator,html:not([dir=rtl]) .np-flow-navigation .separator{margin-left:16px!important}html:not([dir=rtl]) .np-flow-navigation .separator{margin-right:16px!important}.np-flow-navigation--hidden{visibility:hidden}.np-theme-personal--bright-green .np-flow-navigation .np-flow-header__left path,.np-theme-personal--dark .np-flow-navigation .np-flow-header__left path,.np-theme-personal--forest-green .np-flow-navigation .np-flow-header__left path{fill:var(--color-interactive-primary)}
+.np-flow-navigation{min-height:97px;width:100%}.np-flow-navigation--border-bottom{border-bottom:1px solid #0000001a;border-bottom:1px solid var(--color-border-neutral);min-height:96px}.np-flow-navigation__content{max-width:1164px;min-width:320px;width:100%}.np-flow-navigation__stepper{padding-bottom:0!important}[dir=rtl] .np-flow-navigation__stepper{padding-right:0!important}[dir=rtl] .np-flow-navigation__stepper,html:not([dir=rtl]) .np-flow-navigation__stepper{padding-left:0!important}html:not([dir=rtl]) .np-flow-navigation__stepper{padding-right:0!important}.np-flow-navigation--xs-max .np-flow-navigation__stepper .tw-stepper-steps{display:none}.np-flow-navigation--xs-max .np-flow-navigation__stepper .progress{margin-bottom:0}.np-flow-navigation--xs-max .np-animated-label{height:auto}.np-flow-navigation--sm .np-flow-navigation__stepper{min-height:56px}[dir=rtl] .np-flow-navigation--sm .np-flow-navigation__stepper{padding-right:24px!important;padding-right:var(--size-24)!important}[dir=rtl] .np-flow-navigation--sm .np-flow-navigation__stepper,html:not([dir=rtl]) .np-flow-navigation--sm .np-flow-navigation__stepper{padding-left:24px!important;padding-left:var(--size-24)!important}html:not([dir=rtl]) .np-flow-navigation--sm .np-flow-navigation__stepper{padding-right:24px!important;padding-right:var(--size-24)!important}.np-flow-navigation--lg .np-flow-navigation__stepper{max-width:562px}.np-flow-navigation--lg .np-flow-header__left,.np-flow-navigation--lg .np-flow-header__right{width:180px}.np-flow-navigation .separator{background-color:#0000001a;background-color:var(--color-border-neutral);height:32px;height:var(--size-32);min-width:1px;width:1px}[dir=rtl] .np-flow-navigation .separator{margin-right:16px!important;margin-right:var(--size-16)!important}[dir=rtl] .np-flow-navigation .separator,html:not([dir=rtl]) .np-flow-navigation .separator{margin-left:16px!important;margin-left:var(--size-16)!important}html:not([dir=rtl]) .np-flow-navigation .separator{margin-right:16px!important;margin-right:var(--size-16)!important}.np-flow-navigation--hidden{visibility:hidden}.np-theme-personal--bright-green .np-flow-navigation .np-flow-header__left path,.np-theme-personal--dark .np-flow-navigation .np-flow-header__left path,.np-theme-personal--forest-green .np-flow-navigation .np-flow-header__left path{fill:var(--color-interactive-primary)}

package/src/i18n/cs.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "načítání",
   "neptune.Chips.ariaLabel": "Vyčistit {choice}",
   "neptune.ClearButton.ariaLabel": "Vyčistit",
   "neptune.CloseButton.ariaLabel": "Zavřít",
   "neptune.DateInput.day.label": "Den",
   "neptune.DateInput.month.label": "Měsíc",
   "neptune.DateInput.year.label": "Rok",
+  "neptune.DateLookup.day": "den",
+  "neptune.DateLookup.goTo20YearView": "Go to 20 year view",
+  "neptune.DateLookup.month": "měsíc",
+  "neptune.DateLookup.next": "další",
+  "neptune.DateLookup.previous": "předchozí",
+  "neptune.DateLookup.selected": "vybráno",
+  "neptune.DateLookup.twentyYears": "20 let",
+  "neptune.DateLookup.year": "rok",
+  "neptune.FlowNavigation.back": "back to previous step",
+  "neptune.Link.opensInNewTab": "(opens in new tab)",
   "neptune.MoneyInput.Select.placeholder": "Vybrat možnost...",
-  "neptune.Pagination.ariaLabel": "Navigace v Pagination",
-  "neptune.PaginationLink.ariaLabel.active": "Přejít na stránku {pageNumber}",
-  "neptune.PaginationLink.ariaLabel.inactive": "Současná stránka, stránka {pageNumber}",
   "neptune.Select.searchPlaceholder": "Hledat...",
   "neptune.Summary.statusDone": "Položka dokončena",
   "neptune.Summary.statusNotDone": "Položka k dokončení",

package/src/i18n/de.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "wird geladen",
   "neptune.Chips.ariaLabel": "{choice} zurücksetzen",
   "neptune.ClearButton.ariaLabel": "Zurücksetzen",
   "neptune.CloseButton.ariaLabel": "Schließen",
   "neptune.DateInput.day.label": "Tag",
   "neptune.DateInput.month.label": "Monat",
   "neptune.DateInput.year.label": "Jahr",
+  "neptune.DateLookup.day": "Tag",
+  "neptune.DateLookup.goTo20YearView": "Zur 20-Jahres-Ansicht",
+  "neptune.DateLookup.month": "Monat",
+  "neptune.DateLookup.next": "weiter",
+  "neptune.DateLookup.previous": "zurück",
+  "neptune.DateLookup.selected": "ausgewählt",
+  "neptune.DateLookup.twentyYears": "20 Jahre",
+  "neptune.DateLookup.year": "Jahr",
+  "neptune.FlowNavigation.back": "zurück zum vorherigen Schritt",
+  "neptune.Link.opensInNewTab": "(wird in einem neuen Tab geöffnet)",
   "neptune.MoneyInput.Select.placeholder": "Wähle eine der Möglichkeiten aus...",
-  "neptune.Pagination.ariaLabel": "Seitennummer-Navigation",
-  "neptune.PaginationLink.ariaLabel.active": "Weiter zur Seite {pageNumber}",
-  "neptune.PaginationLink.ariaLabel.inactive": "Aktuelle Seite – Seite {pageNumber}",
   "neptune.Select.searchPlaceholder": "Wird gesucht...",
   "neptune.Summary.statusDone": "Schritt erledigt",
   "neptune.Summary.statusNotDone": "Schritt noch zu erledigen",

package/src/i18n/es.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "cargando",
   "neptune.Chips.ariaLabel": "Descartar {choice}",
   "neptune.ClearButton.ariaLabel": "Borrar",
   "neptune.CloseButton.ariaLabel": "Cerrar",
   "neptune.DateInput.day.label": "Día",
   "neptune.DateInput.month.label": "Mes",
   "neptune.DateInput.year.label": "Año",
+  "neptune.DateLookup.day": "día",
+  "neptune.DateLookup.goTo20YearView": "Ir a vista de 20 años",
+  "neptune.DateLookup.month": "mes",
+  "neptune.DateLookup.next": "siguiente",
+  "neptune.DateLookup.previous": "anterior",
+  "neptune.DateLookup.selected": "seleccionado",
+  "neptune.DateLookup.twentyYears": "20 años",
+  "neptune.DateLookup.year": "año",
+  "neptune.FlowNavigation.back": "volver al paso anterior",
+  "neptune.Link.opensInNewTab": "(se abre en una pestaña nueva)",
   "neptune.MoneyInput.Select.placeholder": "Selecciona una opción...",
-  "neptune.Pagination.ariaLabel": "Navegación por las páginas",
-  "neptune.PaginationLink.ariaLabel.active": "Ve a la página {pageNumber}",
-  "neptune.PaginationLink.ariaLabel.inactive": "Página actual, página {pageNumber}",
   "neptune.Select.searchPlaceholder": "Buscar...",
   "neptune.Summary.statusDone": "Apartado listo",
   "neptune.Summary.statusNotDone": "Apartado a completar",

package/src/i18n/fr.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "chargement",
   "neptune.Chips.ariaLabel": "Effacer {choice}",
   "neptune.ClearButton.ariaLabel": "Effacer",
   "neptune.CloseButton.ariaLabel": "Fermer",
   "neptune.DateInput.day.label": "Jour",
   "neptune.DateInput.month.label": "Mois",
   "neptune.DateInput.year.label": "Année",
+  "neptune.DateLookup.day": "jour",
+  "neptune.DateLookup.goTo20YearView": "Accéder à la vue sur 20 ans",
+  "neptune.DateLookup.month": "mois",
+  "neptune.DateLookup.next": "suivant",
+  "neptune.DateLookup.previous": "précédent",
+  "neptune.DateLookup.selected": "sélectionnée",
+  "neptune.DateLookup.twentyYears": "20 ans",
+  "neptune.DateLookup.year": "année",
+  "neptune.FlowNavigation.back": "revenir à l'étape précédente",
+  "neptune.Link.opensInNewTab": "(ouvre dans un nouvel onglet)",
   "neptune.MoneyInput.Select.placeholder": "Sélectionner une option...",
-  "neptune.Pagination.ariaLabel": "Navigation par pagination",
-  "neptune.PaginationLink.ariaLabel.active": "Aller à la page {pageNumber}",
-  "neptune.PaginationLink.ariaLabel.inactive": "Page actuelle, page {pageNumber}",
   "neptune.Select.searchPlaceholder": "Recherche...",
   "neptune.Summary.statusDone": "Validé",
   "neptune.Summary.statusNotDone": "À compléter",

package/src/i18n/hu.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "betöltés",
   "neptune.Chips.ariaLabel": "{choice} törlése",
   "neptune.ClearButton.ariaLabel": "Törlés",
   "neptune.CloseButton.ariaLabel": "Bezárás",
   "neptune.DateInput.day.label": "Nap",
   "neptune.DateInput.month.label": "Hónap",
   "neptune.DateInput.year.label": "Év",
+  "neptune.DateLookup.day": "nap",
+  "neptune.DateLookup.goTo20YearView": "Ugrás a 20 éves nézetre",
+  "neptune.DateLookup.month": "hónap",
+  "neptune.DateLookup.next": "következő",
+  "neptune.DateLookup.previous": "előző",
+  "neptune.DateLookup.selected": "kiválasztva",
+  "neptune.DateLookup.twentyYears": "20 év",
+  "neptune.DateLookup.year": "év",
+  "neptune.FlowNavigation.back": "vissza az előző lépéshez",
+  "neptune.Link.opensInNewTab": "(új lapon nyílik meg)",
   "neptune.MoneyInput.Select.placeholder": "Válassz ki egy lehetőséget...",
-  "neptune.Pagination.ariaLabel": "Lapszámos navigáció",
-  "neptune.PaginationLink.ariaLabel.active": "Ugrás a(z) {pageNumber}. oldalra",
-  "neptune.PaginationLink.ariaLabel.inactive": "Jelenlegi oldal, {pageNumber}. oldal",
   "neptune.Select.searchPlaceholder": "Keresés...",
   "neptune.Summary.statusDone": "Kész",
   "neptune.Summary.statusNotDone": "Hátravan",

package/src/i18n/id.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "memuat",
   "neptune.Chips.ariaLabel": "Hapus {choice}",
   "neptune.ClearButton.ariaLabel": "Hapus",
   "neptune.CloseButton.ariaLabel": "Tutup",
   "neptune.DateInput.day.label": "Hari",
   "neptune.DateInput.month.label": "Bulan",
   "neptune.DateInput.year.label": "Tahun",
+  "neptune.DateLookup.day": "hari",
+  "neptune.DateLookup.goTo20YearView": "Lihat tampilan 20 tahun",
+  "neptune.DateLookup.month": "bulan",
+  "neptune.DateLookup.next": "berikutnya",
+  "neptune.DateLookup.previous": "sebelumnya",
+  "neptune.DateLookup.selected": "terpilih",
+  "neptune.DateLookup.twentyYears": "20 tahun",
+  "neptune.DateLookup.year": "tahun",
+  "neptune.FlowNavigation.back": "kembali ke langkah sebelumnya",
+  "neptune.Link.opensInNewTab": "(terbuka di tab baru)",
   "neptune.MoneyInput.Select.placeholder": "Pilih opsi...",
-  "neptune.Pagination.ariaLabel": "Halaman navigasi",
-  "neptune.PaginationLink.ariaLabel.active": "Lanjut ke halaman {pageNumber}",
-  "neptune.PaginationLink.ariaLabel.inactive": "Halaman saat ini, halaman {pageNumber}",
   "neptune.Select.searchPlaceholder": "Cari...",
   "neptune.Summary.statusDone": "Item selesai",
   "neptune.Summary.statusNotDone": "Item yang harus dilakukan",

package/src/i18n/it.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "caricamento",
   "neptune.Chips.ariaLabel": "Rimuovi {choice}",
   "neptune.ClearButton.ariaLabel": "Elimina",
   "neptune.CloseButton.ariaLabel": "Chiudi",
   "neptune.DateInput.day.label": "Giorno",
   "neptune.DateInput.month.label": "Mese",
   "neptune.DateInput.year.label": "Anno",
+  "neptune.DateLookup.day": "giorno",
+  "neptune.DateLookup.goTo20YearView": "Vai alla vista su 20 anni",
+  "neptune.DateLookup.month": "mese",
+  "neptune.DateLookup.next": "continua",
+  "neptune.DateLookup.previous": "indietro",
+  "neptune.DateLookup.selected": "selezionata",
+  "neptune.DateLookup.twentyYears": "20 anni",
+  "neptune.DateLookup.year": "anno",
+  "neptune.FlowNavigation.back": "torna al passaggio precedente",
+  "neptune.Link.opensInNewTab": "(si apre in una nuova scheda)",
   "neptune.MoneyInput.Select.placeholder": "Seleziona un'opzione...",
-  "neptune.Pagination.ariaLabel": "Navigazione",
-  "neptune.PaginationLink.ariaLabel.active": "Via a pagina {pageNumber}",
-  "neptune.PaginationLink.ariaLabel.inactive": "Pagina corrente, pagina {pageNumber}",
   "neptune.Select.searchPlaceholder": "Cerca...",
   "neptune.Summary.statusDone": "Completato",
   "neptune.Summary.statusNotDone": "Da completare",

package/src/i18n/ja.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "読み込み中…",
   "neptune.Chips.ariaLabel": "{choice} をクリア",
   "neptune.ClearButton.ariaLabel": "消去",
   "neptune.CloseButton.ariaLabel": "閉じる",
   "neptune.DateInput.day.label": "日",
   "neptune.DateInput.month.label": "月",
   "neptune.DateInput.year.label": "年",
+  "neptune.DateLookup.day": "日",
+  "neptune.DateLookup.goTo20YearView": "20年表示に移動する",
+  "neptune.DateLookup.month": "月",
+  "neptune.DateLookup.next": "次",
+  "neptune.DateLookup.previous": "前",
+  "neptune.DateLookup.selected": "選択済み",
+  "neptune.DateLookup.twentyYears": "20年",
+  "neptune.DateLookup.year": "年",
+  "neptune.FlowNavigation.back": "前のステップに戻る",
+  "neptune.Link.opensInNewTab": "（新しいタブで開きます）",
   "neptune.MoneyInput.Select.placeholder": "選択してください...",
-  "neptune.Pagination.ariaLabel": "ページネーションナビゲーション",
-  "neptune.PaginationLink.ariaLabel.active": "{pageNumber}のページへ移動します",
-  "neptune.PaginationLink.ariaLabel.inactive": "現在のページ、{pageNumber}ページ",
   "neptune.Select.searchPlaceholder": "検索... ",
   "neptune.Summary.statusDone": "完了",
   "neptune.Summary.statusNotDone": "未対応",

package/src/i18n/pl.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "ładowanie",
   "neptune.Chips.ariaLabel": "Wyczyść {choice}",
   "neptune.ClearButton.ariaLabel": "Wyczyść",
   "neptune.CloseButton.ariaLabel": "Zamknij",
   "neptune.DateInput.day.label": "Dzień",
   "neptune.DateInput.month.label": "Miesiąc",
   "neptune.DateInput.year.label": "Rok",
+  "neptune.DateLookup.day": "dzień",
+  "neptune.DateLookup.goTo20YearView": "Przejdź do widoku 20-letniego",
+  "neptune.DateLookup.month": "miesiąc",
+  "neptune.DateLookup.next": "następny",
+  "neptune.DateLookup.previous": "poprzedni",
+  "neptune.DateLookup.selected": "wybrano",
+  "neptune.DateLookup.twentyYears": "20 lat",
+  "neptune.DateLookup.year": "rok",
+  "neptune.FlowNavigation.back": "wróć do poprzedniego kroku",
+  "neptune.Link.opensInNewTab": "(otworzy się w nowej zakładce)",
   "neptune.MoneyInput.Select.placeholder": "Wybierz opcję...",
-  "neptune.Pagination.ariaLabel": "Nawigacja w paginacji",
-  "neptune.PaginationLink.ariaLabel.active": "Przejdź do strony {pageNumber}",
-  "neptune.PaginationLink.ariaLabel.inactive": "Obecna strona, strona {pageNumber}",
   "neptune.Select.searchPlaceholder": "Wyszukaj...",
   "neptune.Summary.statusDone": "Czynność wykonana",
   "neptune.Summary.statusNotDone": "Czynność do wykonania",

package/src/i18n/pt.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "carregando",
   "neptune.Chips.ariaLabel": "Remover {choice}",
   "neptune.ClearButton.ariaLabel": "Remover",
   "neptune.CloseButton.ariaLabel": "Fechar",
   "neptune.DateInput.day.label": "Dia",
   "neptune.DateInput.month.label": "Mês",
   "neptune.DateInput.year.label": "Ano",
+  "neptune.DateLookup.day": "dia",
+  "neptune.DateLookup.goTo20YearView": "Go to 20 year view",
+  "neptune.DateLookup.month": "mês",
+  "neptune.DateLookup.next": "próximo",
+  "neptune.DateLookup.previous": "anterior",
+  "neptune.DateLookup.selected": "selecionada",
+  "neptune.DateLookup.twentyYears": "20 anos",
+  "neptune.DateLookup.year": "ano",
+  "neptune.FlowNavigation.back": "back to previous step",
+  "neptune.Link.opensInNewTab": "(abrir a página em uma nova aba)",
   "neptune.MoneyInput.Select.placeholder": "Escolha uma opção...",
-  "neptune.Pagination.ariaLabel": "Navegação pelas páginas",
-  "neptune.PaginationLink.ariaLabel.active": "Ir para a página {pageNumber}",
-  "neptune.PaginationLink.ariaLabel.inactive": "Página atual, página {pageNumber}",
   "neptune.Select.searchPlaceholder": "Buscar...",
   "neptune.Summary.statusDone": "Pronto",
   "neptune.Summary.statusNotDone": "Não iniciado",

package/src/i18n/ro.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "se încarcă",
   "neptune.Chips.ariaLabel": "Șterge {choice}",
   "neptune.ClearButton.ariaLabel": "Elimină",
   "neptune.CloseButton.ariaLabel": "Închide",
   "neptune.DateInput.day.label": "Zi",
   "neptune.DateInput.month.label": "Lună",
   "neptune.DateInput.year.label": "An",
+  "neptune.DateLookup.day": "zi",
+  "neptune.DateLookup.goTo20YearView": "Accesează vizualizarea pe 20 de ani",
+  "neptune.DateLookup.month": "luna",
+  "neptune.DateLookup.next": "înainte",
+  "neptune.DateLookup.previous": "precedenta",
+  "neptune.DateLookup.selected": "selectată",
+  "neptune.DateLookup.twentyYears": "20 de ani",
+  "neptune.DateLookup.year": "anul",
+  "neptune.FlowNavigation.back": "înapoi la pasul anterior",
+  "neptune.Link.opensInNewTab": "(se deschide într-o filă nouă)",
   "neptune.MoneyInput.Select.placeholder": "Selectează o opţiune...",
-  "neptune.Pagination.ariaLabel": "Navigare prin pagină",
-  "neptune.PaginationLink.ariaLabel.active": "Du-te la pagina {pageNumber}",
-  "neptune.PaginationLink.ariaLabel.inactive": "Pagina curentă, pagina {pageNumber}",
   "neptune.Select.searchPlaceholder": "Caută...",
   "neptune.Summary.statusDone": "Finalizat",
   "neptune.Summary.statusNotDone": "De făcut",

package/src/i18n/ru.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "загрузка",
   "neptune.Chips.ariaLabel": "Очистить {choice}",
   "neptune.ClearButton.ariaLabel": "Очистить",
   "neptune.CloseButton.ariaLabel": "Закрыть",
   "neptune.DateInput.day.label": "День",
   "neptune.DateInput.month.label": "Месяц",
   "neptune.DateInput.year.label": "Год",
+  "neptune.DateLookup.day": "день",
+  "neptune.DateLookup.goTo20YearView": "Перейти к обзору 20 лет",
+  "neptune.DateLookup.month": "месяц",
+  "neptune.DateLookup.next": "далее",
+  "neptune.DateLookup.previous": "предыдущий",
+  "neptune.DateLookup.selected": "выбрано",
+  "neptune.DateLookup.twentyYears": "20 лет",
+  "neptune.DateLookup.year": "год",
+  "neptune.FlowNavigation.back": "вернуться к предыдущему шагу",
+  "neptune.Link.opensInNewTab": "(откроется в новой вкладке)",
   "neptune.MoneyInput.Select.placeholder": "Выберите вариант...",
-  "neptune.Pagination.ariaLabel": "Постраничная навигация",
-  "neptune.PaginationLink.ariaLabel.active": "Перейти на страницу {pageNumber}",
-  "neptune.PaginationLink.ariaLabel.inactive": "Текущая страница, страница {pageNumber}",
   "neptune.Select.searchPlaceholder": "Поиск...",
   "neptune.Summary.statusDone": "Этап завершен",
   "neptune.Summary.statusNotDone": "Этап к выполнению",

package/src/i18n/th.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "กำลังโหลด",
   "neptune.Chips.ariaLabel": "เคลียร์ {choice}",
   "neptune.ClearButton.ariaLabel": "ชัดเจน",
   "neptune.CloseButton.ariaLabel": "ปิด",
   "neptune.DateInput.day.label": "วัน",
   "neptune.DateInput.month.label": "เดือน",
   "neptune.DateInput.year.label": "ปี",
+  "neptune.DateLookup.day": "วัน",
+  "neptune.DateLookup.goTo20YearView": "Go to 20 year view",
+  "neptune.DateLookup.month": "เดือน",
+  "neptune.DateLookup.next": "ถัดไป",
+  "neptune.DateLookup.previous": "ก่อนหน้า",
+  "neptune.DateLookup.selected": "เลือกแล้ว",
+  "neptune.DateLookup.twentyYears": "20 ปี",
+  "neptune.DateLookup.year": "ปี",
+  "neptune.FlowNavigation.back": "back to previous step",
+  "neptune.Link.opensInNewTab": "(opens in new tab)",
   "neptune.MoneyInput.Select.placeholder": "เลือกตัวเลือก...",
-  "neptune.Pagination.ariaLabel": "การนำทางเลขหน้า",
-  "neptune.PaginationLink.ariaLabel.active": "ไปที่หน้า {pageNumber}",
-  "neptune.PaginationLink.ariaLabel.inactive": "หน้าปัจจุบัน หน้า {pageNumber}",
   "neptune.Select.searchPlaceholder": "ค้นหา...",
   "neptune.Summary.statusDone": "รายการที่ทำแล้ว",
   "neptune.Summary.statusNotDone": "รายการที่ต้องทำ",

package/src/i18n/tr.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "yükleniyor",
   "neptune.Chips.ariaLabel": "{choice} temizle",
   "neptune.ClearButton.ariaLabel": "Sil",
   "neptune.CloseButton.ariaLabel": "Kapat",
   "neptune.DateInput.day.label": "Gün",
   "neptune.DateInput.month.label": "Ay",
   "neptune.DateInput.year.label": "Yıl",
+  "neptune.DateLookup.day": "gün",
+  "neptune.DateLookup.goTo20YearView": "20 yıl görünümüne git",
+  "neptune.DateLookup.month": "ay",
+  "neptune.DateLookup.next": "devam et",
+  "neptune.DateLookup.previous": "önceki",
+  "neptune.DateLookup.selected": "seçili",
+  "neptune.DateLookup.twentyYears": "20 yıl",
+  "neptune.DateLookup.year": "yıl",
+  "neptune.FlowNavigation.back": "önceki adıma dön",
+  "neptune.Link.opensInNewTab": "(yeni sekmede açılır)",
   "neptune.MoneyInput.Select.placeholder": "Bir seçenek seçin...",
-  "neptune.Pagination.ariaLabel": "Sayfalandırma gezintisi",
-  "neptune.PaginationLink.ariaLabel.active": "{pageNumber} numaralı sayfaya git",
-  "neptune.PaginationLink.ariaLabel.inactive": "Mevcut sayfa, sayfa {pageNumber}",
   "neptune.Select.searchPlaceholder": "Ara...",
   "neptune.Summary.statusDone": "Tamamlanan aşama",
   "neptune.Summary.statusNotDone": "Yapılacak",

package/src/i18n/uk.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "завантаження",
   "neptune.Chips.ariaLabel": "Очистити {choice}",
   "neptune.ClearButton.ariaLabel": "Очистити",
   "neptune.CloseButton.ariaLabel": "Закрити",
   "neptune.DateInput.day.label": "День",
   "neptune.DateInput.month.label": "Місяць",
   "neptune.DateInput.year.label": "Рік",
+  "neptune.DateLookup.day": "дня",
+  "neptune.DateLookup.goTo20YearView": "Go to 20 year view",
+  "neptune.DateLookup.month": "місяць",
+  "neptune.DateLookup.next": "уперед",
+  "neptune.DateLookup.previous": "назад",
+  "neptune.DateLookup.selected": "вибрано",
+  "neptune.DateLookup.twentyYears": "20 років",
+  "neptune.DateLookup.year": "рік",
+  "neptune.FlowNavigation.back": "back to previous step",
+  "neptune.Link.opensInNewTab": "(opens in new tab)",
   "neptune.MoneyInput.Select.placeholder": "Виберіть варіант…",
-  "neptune.Pagination.ariaLabel": "Перехід за сторінками",
-  "neptune.PaginationLink.ariaLabel.active": "Перейти на сторінку {pageNumber}",
-  "neptune.PaginationLink.ariaLabel.inactive": "Ця сторінка, сторінка {pageNumber}",
   "neptune.Select.searchPlaceholder": "Пошук…",
   "neptune.Summary.statusDone": "Виконано",
   "neptune.Summary.statusNotDone": "Не виконано",

package/src/i18n/zh-CN.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "正在加载",
   "neptune.Chips.ariaLabel": "清除 {choice}",
   "neptune.ClearButton.ariaLabel": "清晰",
   "neptune.CloseButton.ariaLabel": "关闭",
   "neptune.DateInput.day.label": "日",
   "neptune.DateInput.month.label": "月",
   "neptune.DateInput.year.label": "年",
+  "neptune.DateLookup.day": "日",
+  "neptune.DateLookup.goTo20YearView": "Go to 20 year view",
+  "neptune.DateLookup.month": "月",
+  "neptune.DateLookup.next": "下一页",
+  "neptune.DateLookup.previous": "上一页",
+  "neptune.DateLookup.selected": "已选",
+  "neptune.DateLookup.twentyYears": "20年",
+  "neptune.DateLookup.year": "年",
+  "neptune.FlowNavigation.back": "back to previous step",
+  "neptune.Link.opensInNewTab": "(opens in new tab)",
   "neptune.MoneyInput.Select.placeholder": "请选择...",
-  "neptune.Pagination.ariaLabel": "分页导航",
-  "neptune.PaginationLink.ariaLabel.active": "转到第 {pageNumber} 页",
-  "neptune.PaginationLink.ariaLabel.inactive": "当前页面，第 {pageNumber} 页",
   "neptune.Select.searchPlaceholder": "搜索",
   "neptune.Summary.statusDone": "已完成",
   "neptune.Summary.statusNotDone": "未完成",

package/src/i18n/zh-HK.json

@@ -1,14 +1,22 @@
 {
+  "neptune.Button.loadingAriaLabel": "載入中",
   "neptune.Chips.ariaLabel": "清除{choice}",
   "neptune.ClearButton.ariaLabel": "清除",
   "neptune.CloseButton.ariaLabel": "關閉",
   "neptune.DateInput.day.label": "日",
   "neptune.DateInput.month.label": "月",
   "neptune.DateInput.year.label": "年",
+  "neptune.DateLookup.day": "日",
+  "neptune.DateLookup.goTo20YearView": "切換至20年視圖",
+  "neptune.DateLookup.month": "月",
+  "neptune.DateLookup.next": "下一個",
+  "neptune.DateLookup.previous": "上一個",
+  "neptune.DateLookup.selected": "已選",
+  "neptune.DateLookup.twentyYears": "20年",
+  "neptune.DateLookup.year": "年",
+  "neptune.FlowNavigation.back": "返回上一個步驟",
+  "neptune.Link.opensInNewTab": "（在新分頁中開啟）",
   "neptune.MoneyInput.Select.placeholder": "選擇一個選項…",
-  "neptune.Pagination.ariaLabel": "分頁導航",
-  "neptune.PaginationLink.ariaLabel.active": "前往第{pageNumber}頁",
-  "neptune.PaginationLink.ariaLabel.inactive": "目前在第{pageNumber}頁",
   "neptune.Select.searchPlaceholder": "搜尋…",
   "neptune.Summary.statusDone": "已完成事項",
   "neptune.Summary.statusNotDone": "未完成事項",