@transferwise/components 0.0.0-experimental-9d9138b → 0.0.0-experimental-1fc511d

package/src/carousel/Carousel.spec.tsx

@@ -47,9 +47,7 @@ describe('Carousel', () => {
   const scrollBy = jest.fn();
 
   beforeEach(() => {
-    // eslint-disable-next-line functional/immutable-data
     window.HTMLElement.prototype.scrollIntoView = focusSpy;
-    // eslint-disable-next-line functional/immutable-data
     window.HTMLElement.prototype.scrollBy = scrollBy;
   });
 
@@ -198,13 +196,11 @@ describe('Carousel', () => {
 });
 
 const mockPositions = (scrollWidth: number, offsetWidth: number) => {
-  // eslint-disable-next-line functional/immutable-data
   Object.defineProperty(HTMLElement.prototype, 'scrollWidth', {
     configurable: true,
     value: scrollWidth,
   });
 
-  // eslint-disable-next-line functional/immutable-data
   Object.defineProperty(HTMLElement.prototype, 'offsetWidth', {
     configurable: true,
     value: offsetWidth,

package/src/carousel/Carousel.tsx

@@ -228,7 +228,6 @@ const Carousel: React.FC<CarouselProps> = ({ header, className, cards, onClick }
                 className={clsx('carousel__card-content', {
                   [card.className ?? '']: !!card.className,
                 })}
-                // eslint-disable-next-line react/forbid-dom-props
                 style={card.styles}
               >
                 {card.content}

package/src/checkbox/Checkbox.tsx

@@ -44,7 +44,6 @@ export default function Checkbox({
   const innerDisabled = disabled || readOnly;
   return (
     <div id={id} className={classList}>
-      {/* eslint-disable-next-line jsx-a11y/label-has-for */}
       <label className={clsx({ disabled })}>
         <CheckboxButton
           className="p-r-2"

package/src/checkboxButton/CheckboxButton.story.tsx

@@ -23,7 +23,6 @@ export const Basic: Story = {
     'aria-label': 'Toggle email updates',
   },
   render: (args) => {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
     const [checked, setChecked] = useState(true);
 
     return <CheckboxButton {...args} checked={checked} onChange={() => setChecked(!checked)} />;
@@ -36,7 +35,6 @@ export const Indeterminate: Story = {
     indeterminate: true,
   },
   render: (args) => {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
     const [indeterminate, setIndeterminate] = useState(true);
 
     return (

package/src/checkboxButton/CheckboxButton.tsx

@@ -19,7 +19,7 @@ const CheckboxButton = forwardRef<HTMLInputElement, CheckboxButtonProps>(functio
 
   useEffect(() => {
     if (internalRef.current) {
-      // eslint-disable-next-line functional/immutable-data, @typescript-eslint/no-unsafe-assignment
+      // eslint-disable-next-line functional/immutable-data
       internalRef.current.indeterminate = indeterminate;
     }
   }, [indeterminate, reference]);

package/src/checkboxOption/CheckboxOption.tsx

@@ -2,8 +2,7 @@ import { forwardRef } from 'react';
 
 import CheckboxButton from '../checkboxButton';
 import Option from '../common/Option';
-import { ReferenceType } from '../common/Option/Option';
-import { BaseOptionProps } from '../common/Option/Option';
+import { ReferenceType, BaseOptionProps } from '../common/Option/Option';
 
 export type CheckboxOptionProps = Omit<BaseOptionProps, 'onChange'> & {
   /**

package/src/chips/__snapshots__/Chips.spec.tsx.snap

@@ -140,7 +140,7 @@ exports[`Chips Filter Chips renders as expected 1`] = `
             width="16"
           >
             <path
-              d="m19.629 5.915-1.2-1.2-6.257 6.257-6.258-6.257-1.2 1.2 6.258 6.257-6.258 6.257 1.2 1.2 6.258-6.257 6.257 6.257 1.2-1.2-6.258-6.257 6.258-6.257Z"
+              d="m12 13.414-7.293 7.293-1.414-1.414L10.586 12 3.293 4.707l1.414-1.414L12 10.586l7.293-7.293 1.414 1.414L13.414 12l7.293 7.293-1.414 1.414z"
             />
           </svg>
         </span>

package/src/common/bottomSheet/BottomSheet.spec.tsx

@@ -2,7 +2,6 @@ import { render, mockMatchMedia } from '../../test-utils';
 
 import BottomSheet from './BottomSheet';
 
-// eslint-disable-next-line @typescript-eslint/no-unsafe-call
 mockMatchMedia();
 
 describe('BottomSheet', () => {

package/src/common/bottomSheet/BottomSheet.story.tsx

@@ -19,8 +19,8 @@ export default {
     open: true,
   },
   render: (args) => {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
     const [open, setOpen] = useState(args.open);
+
     return (
       <div style={{ height: '2000px' }}>
         <Button onClick={() => setOpen(true)}>Open BottomSheet</Button>

package/src/common/bottomSheet/BottomSheet.tsx

@@ -201,7 +201,6 @@ const BottomSheet = ({ role = 'dialog', ...props }: BottomSheetProps) => {
         position={Position.BOTTOM}
         className={clsx('np-bottom-sheet', props.className)}
       >
-        {/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */}
         <div
           id={overlayId}
           aria-labelledby={props['aria-labelledby'] || undefined}

package/src/common/bottomSheet/__snapshots__/BottomSheet.spec.tsx.snap

@@ -52,7 +52,7 @@ exports[`BottomSheet renders content when open 1`] = `
                       width="16"
                     >
                       <path
-                        d="m19.629 5.915-1.2-1.2-6.257 6.257-6.258-6.257-1.2 1.2 6.258 6.257-6.258 6.257 1.2 1.2 6.258-6.257 6.257 6.257 1.2-1.2-6.258-6.257 6.258-6.257Z"
+                        d="m12 13.414-7.293 7.293-1.414-1.414L10.586 12 3.293 4.707l1.414-1.414L12 10.586l7.293-7.293 1.414 1.414L13.414 12l7.293 7.293-1.414 1.414z"
                       />
                     </svg>
                   </span>

package/src/common/closeButton/__snapshots__/CloseButton.spec.tsx.snap

@@ -21,7 +21,7 @@ exports[`CloseButton renders as expected 1`] = `
         width="24"
       >
         <path
-          d="m19.629 5.915-1.2-1.2-6.257 6.257-6.258-6.257-1.2 1.2 6.258 6.257-6.258 6.257 1.2 1.2 6.258-6.257 6.257 6.257 1.2-1.2-6.258-6.257 6.258-6.257Z"
+          d="m12 13.414-7.293 7.293-1.414-1.414L10.586 12 3.293 4.707l1.414-1.414L12 10.586l7.293-7.293 1.414 1.414L13.414 12l7.293 7.293-1.414 1.414z"
         />
       </svg>
     </span>

package/src/common/dateUtils/isDateValid/isDateValid.ts

@@ -1,11 +1,13 @@
 export const isDateValid = (date: Date | string | null) => {
   if (date === null) {
     return false;
-  } else if (date instanceof Date) {
+  }
+
+  if (date instanceof Date) {
     return validDateObject(date);
-  } else {
-    return validDateString(date);
   }
+
+  return validDateString(date);
 };
 
 export const validDateString = (dateString: string) => validDateObject(new Date(dateString));

package/src/common/hooks/useHasIntersected/useHasIntersected.spec.js

@@ -65,7 +65,6 @@ describe('useHasIntersected', () => {
       });
 
       it('calls observer', () => {
-        // eslint-disable-next-line jest/prefer-spy-on
         window.IntersectionObserver = jest.fn(() => ({
           observe,
           unobserve,
@@ -107,7 +106,6 @@ describe('useHasIntersected', () => {
   });
 
   const setupIntersectionObserver = (isIntersecting) => {
-    // eslint-disable-next-line jest/prefer-spy-on
     window.IntersectionObserver = jest.fn((callback) => {
       callback([{ isIntersecting }], { unobserve });
       return {

package/src/common/panel/Panel.tsx

@@ -119,26 +119,15 @@ const Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(
         {...rest}
         ref={setPopperElement}
         role="dialog"
-        // eslint-disable-next-line react/forbid-dom-props
         style={{ ...styles.popper }}
         {...attributes.popper}
         className={clsx('np-panel', { 'np-panel--open': open }, rest.className)}
       >
-        <div
-          ref={reference}
-          /* eslint-disable-next-line react/forbid-dom-props */
-          style={contentStyle}
-          className={clsx('np-panel__content')}
-        >
+        <div ref={reference} style={contentStyle} className={clsx('np-panel__content')}>
           {children}
           {/* Arrow has to stay inside content to get the same animations as the "dialog" and to get hidden when panel is closed. */}
           {arrow && (
-            <div
-              ref={setArrowElement}
-              className={clsx('np-panel__arrow')}
-              // eslint-disable-next-line react/forbid-dom-props
-              style={styles.arrow}
-            />
+            <div ref={setArrowElement} className={clsx('np-panel__arrow')} style={styles.arrow} />
           )}
         </div>
       </div>

package/src/dateLookup/DateLookup.css

@@ -91,8 +91,3 @@
 .np-theme-personal .tw-date-lookup-menu td {
   border: none;
 }
-.np-theme-personal.tw-date-lookup-menu .tw-date-lookup-header-current,
-.np-theme-personal .tw-date-lookup-menu .tw-date-lookup-header-current {
-  color: #37517e;
-  color: var(--color-content-primary);
-}

package/src/dateLookup/DateLookup.less

@@ -91,9 +91,5 @@
     td {
       border: none;
     }
-
-    .tw-date-lookup-header-current {
-      color: var(--color-content-primary);
-    }
   }
 }

package/src/dateLookup/dateHeader/DateHeader.tsx

@@ -1,13 +1,13 @@
 import { clsx } from 'clsx';
 import { useIntl } from 'react-intl';
 
-import Chevron from '../../chevron';
-import { Position, Size, Typography } from '../../common';
+import { Typography } from '../../common';
 import { useLayout } from '../../common/hooks';
 import Title from '../../title';
 import messages from '../DateLookup.messages';
-
-const buttonClasses = 'btn-link p-a-0 text-no-decoration np-text-body-large-bold rounded-sm';
+import Button from '../../button/Button';
+import { ChevronDown, ChevronLeft, ChevronRight } from '@transferwise/icons';
+import IconButton from '../../iconButton';
 
 interface DateHeaderProps {
   label?: string;
@@ -29,44 +29,42 @@ const DateHeader: React.FC<DateHeaderProps> = ({
   return (
     <div className={clsx('text-xs-center', !isMobile && ['clearfix', 'p-y-1'])}>
       <div className="pull-left-single-direction">
-        <button
-          type="button"
-          className={`d-inline-flex ${buttonClasses}`}
+        <IconButton
+          size={40}
+          priority="minimal"
+          className="d-inline-flex"
           aria-label={`${intl.formatMessage(messages.previous)} ${dateMode}`}
           onClick={onPreviousClick}
         >
-          <Chevron
-            orientation={Position.LEFT}
-            className="left-single-direction"
-            size={Size.MEDIUM}
-          />
-        </button>
+          <ChevronLeft className="left-single-direction" />
+        </IconButton>
       </div>
       {label && (
         <Title type={Typography.TITLE_BODY} className="tw-date-lookup-header-current-container">
-          <button
+          <Button
+            v2
+            size="md"
             type="button"
-            className={`tw-date-lookup-header-current ${buttonClasses}`}
+            priority="tertiary"
+            className="tw-date-lookup-header-current"
             aria-label={intl.formatMessage(messages.goTo20YearView)}
+            addonEnd={{ type: 'icon', value: <ChevronDown /> }}
             onClick={onLabelClick}
           >
             {label}
-          </button>
+          </Button>
         </Title>
       )}
       <div className="pull-right-single-direction">
-        <button
-          type="button"
-          className={`d-inline-flex ${buttonClasses}`}
-          aria-label={`${useIntl().formatMessage(messages.next)} ${dateMode}`}
+        <IconButton
+          size={40}
+          className="d-inline-flex"
+          aria-label={`${intl.formatMessage(messages.next)} ${dateMode}`}
+          priority="minimal"
           onClick={onNextClick}
         >
-          <Chevron
-            orientation={Position.RIGHT}
-            className="right-single-direction"
-            size={Size.MEDIUM}
-          />
-        </button>
+          <ChevronRight className="right-single-direction" />
+        </IconButton>
       </div>
     </div>
   );

package/src/dimmer/Dimmer.story.tsx

@@ -18,7 +18,6 @@ type Story = StoryObj<typeof Dimmer>;
 
 export const Basic: Story = {
   render: (args) => {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
     const [open, setOpen] = useState(false);
 
     return (

package/src/dimmer/dimmerManager/DimmerManager.ts

@@ -5,7 +5,7 @@ export default class DimmerManager {
   /**
    * Dimmer refs
    */
-  private dimmers: Element[];
+  private readonly dimmers: Element[];
 
   constructor() {
     this.dimmers = [];

package/src/display/Display.story.tsx

@@ -1,5 +1,3 @@
-/* eslint-disable jsx-a11y/accessible-emoji */
-
 import { Typography } from '../common';
 import Money from '../money/Money';
 import Title from '../title/Title';

package/src/dropFade/DropFade.story.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable react/forbid-dom-props */
 import { action } from '@storybook/addon-actions';
 import { useState } from 'react';
 

package/src/dropFade/DropFade.tsx

@@ -26,7 +26,6 @@ const DropFade = ({ children, show }: { children: ReactElement; show: boolean })
         setHeight(0);
       }}
     >
-      {/* eslint-disable-next-line react/forbid-dom-props */}
       <div ref={reference} style={{ height }} className="np-dropfade">
         {clonedChild}
       </div>

package/src/emphasis/EmphasisHtmlTransformer.spec.tsx

@@ -7,7 +7,7 @@ describe('creates safe, enphasised html', () => {
       emphasisHtmlTransformer.transform(
         '<script>something malicious</script><p>some text & more text</p>',
       ),
-    ).toStrictEqual(
+    ).toBe(
       '&lt;script&gt;something malicious&lt;/script&gt;&lt;p&gt;some text &amp; more text&lt;/p&gt;',
     );
   });
@@ -18,7 +18,7 @@ describe('creates safe, enphasised html', () => {
       emphasisHtmlTransformer.transform(
         '<script>something malicious</script><positive>hello</positive><negative>world</negative><positive>!</positive>',
       ),
-    ).toStrictEqual(
+    ).toBe(
       '&lt;script&gt;something malicious&lt;/script&gt;<em class="emphasis emphasis--positive">hello</em><em class="emphasis emphasis--negative">world</em><em class="emphasis emphasis--positive">!</em>',
     );
   });
@@ -26,11 +26,11 @@ describe('creates safe, enphasised html', () => {
   describe('supports new line characters', () => {
     it('supports slash n in the string', () => {
       const emphasisHtmlTransformer = new EmphasisHtmlTransformer();
-      expect(emphasisHtmlTransformer.transform('hello\\nworld')).toStrictEqual('hello<br />world');
+      expect(emphasisHtmlTransformer.transform('hello\\nworld')).toBe('hello<br />world');
     });
     it('supports new line characters', () => {
       const emphasisHtmlTransformer = new EmphasisHtmlTransformer();
-      expect(emphasisHtmlTransformer.transform('hello\nworld')).toStrictEqual('hello<br />world');
+      expect(emphasisHtmlTransformer.transform('hello\nworld')).toBe('hello<br />world');
     });
   });
 });

package/src/emphasis/EmphasisHtmlTransformer.ts

@@ -13,9 +13,9 @@ type Tags = {
 };
 
 class EmphasisHtmlTransformer {
-  tags: Array<Tags>;
+  tags: Tags[];
 
-  constructor(whitelistedTags?: Array<string>) {
+  constructor(whitelistedTags?: string[]) {
     this.tags = (whitelistedTags || []).map((tag) => {
       return {
         transformed: {

package/src/flowNavigation/__snapshots__/FlowNavigation.spec.js.snap

@@ -29,7 +29,9 @@ exports[`FlowNavigation on mobile renders as expected 1`] = `
             width="16"
           >
             <path
-              d="M22.286 11.316H4.629l7.114-7.114-1.2-1.2-8.572 8.571a.829.829 0 0 0 0 1.2l8.572 8.572 1.2-1.2-7.114-7.114h17.657v-1.715Z"
+              clip-rule="evenodd"
+              d="m5.414 11 6.293-6.293-1.414-1.414L2.3 11.286a1.01 1.01 0 0 0 0 1.428l7.993 7.993 1.414-1.414L5.414 13H22v-2z"
+              fill-rule="evenodd"
             />
           </svg>
         </span>
@@ -74,7 +76,7 @@ exports[`FlowNavigation on mobile renders as expected 1`] = `
               width="24"
             >
               <path
-                d="m19.629 5.915-1.2-1.2-6.257 6.257-6.258-6.257-1.2 1.2 6.258 6.257-6.258 6.257 1.2 1.2 6.258-6.257 6.257 6.257 1.2-1.2-6.258-6.257 6.258-6.257Z"
+                d="m12 13.414-7.293 7.293-1.414-1.414L10.586 12 3.293 4.707l1.414-1.414L12 10.586l7.293-7.293 1.414 1.414L13.414 12l7.293 7.293-1.414 1.414z"
               />
             </svg>
           </span>
@@ -190,7 +192,7 @@ exports[`FlowNavigation renders as expected 1`] = `
               width="24"
             >
               <path
-                d="m19.629 5.915-1.2-1.2-6.257 6.257-6.258-6.257-1.2 1.2 6.258 6.257-6.258 6.257 1.2 1.2 6.258-6.257 6.257 6.257 1.2-1.2-6.258-6.257 6.258-6.257Z"
+                d="m12 13.414-7.293 7.293-1.414-1.414L10.586 12 3.293 4.707l1.414-1.414L12 10.586l7.293-7.293 1.414 1.414L13.414 12l7.293 7.293-1.414 1.414z"
               />
             </svg>
           </span>

package/src/i18n/cs.json

@@ -9,35 +9,52 @@
   "neptune.DateInput.year.label": "Rok",
   "neptune.DateInput.year.placeholder": "RRRR",
   "neptune.DateLookup.day": "den",
-  "neptune.DateLookup.goTo20YearView": "Go to 20 year view",
+  "neptune.DateLookup.goTo20YearView": "Přejít na zobrazení 20 let",
   "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.FlowNavigation.back": "zpět na předchozí krok",
   "neptune.Info.ariaLabel": "Více informací",
-  "neptune.Link.opensInNewTab": "(opens in new tab)",
+  "neptune.Label.optional": "(Volitelné)",
+  "neptune.Link.opensInNewTab": "(otevře se v nové kartě)",
   "neptune.MoneyInput.Select.placeholder": "Vybrat možnost...",
+  "neptune.MoneyInput.Select.selectCurrencyLabel": "Vybrat měnu",
+  "neptune.PhoneNumberInput.SelectInput.placeholder": "Vybrat možnost...",
   "neptune.Select.searchPlaceholder": "Hledat...",
   "neptune.SelectInput.noResultsFound": "Nebyly nalezeny žádné výsledky",
+  "neptune.SelectOption.action.label": "Vybrat",
+  "neptune.SelectOption.selected.action.label": "Změnit zvolenou možnost",
+  "neptune.StatusIcon.iconLabel.error": "Chyba:",
+  "neptune.StatusIcon.iconLabel.information": "Informace:",
+  "neptune.StatusIcon.iconLabel.pending": "Vyřizuje se:",
+  "neptune.StatusIcon.iconLabel.success": "Úspěšné:",
+  "neptune.StatusIcon.iconLabel.warning": "Upozornění:",
   "neptune.Summary.statusDone": "Položka dokončena",
   "neptune.Summary.statusNotDone": "Položka k dokončení",
   "neptune.Summary.statusPending": "Čekající položka",
+  "neptune.Table.actionHeader": "Akce",
+  "neptune.Table.emptyData": "Nebyly nalezeny žádné výsledky",
+  "neptune.Table.loaded": "Data tabulky byla načtena",
+  "neptune.Table.loading": "Data tabulky se načítají",
+  "neptune.Table.refreshPage": "Aktualizovat stránku",
   "neptune.Upload.csButtonText": "Nahrát další soubor?",
   "neptune.Upload.csFailureText": "Nahrání se nezdařilo. Zkuste to prosím později",
   "neptune.Upload.csSuccessText": "Úspěšně nahráno!",
-  "neptune.Upload.csTooLargeMessage": "Soubor musí být menší než {maxSize}MB",
+  "neptune.Upload.csTooLargeMessage": "Nahrajte soubor menší než {maxSize} MB",
   "neptune.Upload.csWrongTypeMessage": "Tento formát souboru není podporován. Zkuste to znovu s jiným souborem",
   "neptune.Upload.psButtonText": "Zrušit",
   "neptune.Upload.psProcessingText": "Načítání...",
+  "neptune.Upload.retry": "Opakovat",
   "neptune.Upload.usButtonText": "Nebo vyberte soubor",
   "neptune.Upload.usDropMessage": "Pusťte sem soubor pro jeho nahrání",
-  "neptune.Upload.usPlaceholder": "Přetáhněte a pusťte sem soubor menší než {maxSize}MB",
+  "neptune.Upload.usPlaceholder": "Přetáhněte soubor menší než {maxSize} MB",
   "neptune.UploadButton.allFileTypes": "Všechny typy souborů",
   "neptune.UploadButton.dropFiles": "Pusťte sem soubor pro jeho nahrání",
   "neptune.UploadButton.instructions": "{fileTypes}, menší než {size}MB",
+  "neptune.UploadButton.maximumFiles": "Max. počet souborů: {maxFiles}.",
   "neptune.UploadButton.uploadFile": "Nahrát soubor",
   "neptune.UploadButton.uploadFiles": "Nahrát soubory",
   "neptune.UploadInput.deleteModalBody": "Odstraněním tohoto souboru jej smažete z našeho systému.",

package/src/i18n/nl.json

@@ -0,0 +1,73 @@
+{
+  "neptune.Button.loadingAriaLabel": "laden",
+  "neptune.Chips.ariaLabel": "{choice} wissen",
+  "neptune.ClearButton.ariaLabel": "Wissen",
+  "neptune.CloseButton.ariaLabel": "Sluiten",
+  "neptune.DateInput.day.label": "Dag",
+  "neptune.DateInput.day.placeholder": "DD",
+  "neptune.DateInput.month.label": "Maand",
+  "neptune.DateInput.year.label": "Jaar",
+  "neptune.DateInput.year.placeholder": "JJJJ",
+  "neptune.DateLookup.day": "dag",
+  "neptune.DateLookup.goTo20YearView": "Naar 20-jaarsoverzicht",
+  "neptune.DateLookup.month": "maand",
+  "neptune.DateLookup.next": "volgende",
+  "neptune.DateLookup.previous": "vorige",
+  "neptune.DateLookup.selected": "geselecteerd",
+  "neptune.DateLookup.twentyYears": "20 jaar",
+  "neptune.DateLookup.year": "jaar",
+  "neptune.FlowNavigation.back": "terug naar vorige stap",
+  "neptune.Info.ariaLabel": "Meer informatie",
+  "neptune.Label.optional": "(Optioneel)",
+  "neptune.Link.opensInNewTab": "(wordt geopend in een nieuw tabblad)",
+  "neptune.MoneyInput.Select.placeholder": "Selecteer een optie...",
+  "neptune.MoneyInput.Select.selectCurrencyLabel": "Selecteer valuta",
+  "neptune.PhoneNumberInput.SelectInput.placeholder": "Selecteer een optie...",
+  "neptune.Select.searchPlaceholder": "Zoeken...",
+  "neptune.SelectInput.noResultsFound": "Geen resultaten gevonden",
+  "neptune.SelectOption.action.label": "Kiezen",
+  "neptune.SelectOption.selected.action.label": "Gekozen optie wijzigen",
+  "neptune.StatusIcon.iconLabel.error": "Fout:",
+  "neptune.StatusIcon.iconLabel.information": "Informatie:",
+  "neptune.StatusIcon.iconLabel.pending": "In behandeling:",
+  "neptune.StatusIcon.iconLabel.success": "Gelukt:",
+  "neptune.StatusIcon.iconLabel.warning": "Waarschuwing:",
+  "neptune.Summary.statusDone": "Item klaar",
+  "neptune.Summary.statusNotDone": "Item te doen",
+  "neptune.Summary.statusPending": "Item in behandeling",
+  "neptune.Table.actionHeader": "Actie",
+  "neptune.Table.emptyData": "Geen resultaten gevonden",
+  "neptune.Table.loaded": "Tabelgegevens zijn geladen",
+  "neptune.Table.loading": "Tabelgegevens worden geladen",
+  "neptune.Table.refreshPage": "Pagina vernieuwen",
+  "neptune.Upload.csButtonText": "Nog een bestand uploaden?",
+  "neptune.Upload.csFailureText": "Uploaden mislukt. Probeer het opnieuw",
+  "neptune.Upload.csSuccessText": "Uploaden voltooid!",
+  "neptune.Upload.csTooLargeMessage": "Upload een bestand kleiner dan {maxSize} MB",
+  "neptune.Upload.csWrongTypeMessage": "Het bestandstype wordt niet ondersteund. Probeer het opnieuw met een ander bestand.",
+  "neptune.Upload.psButtonText": "Annuleren",
+  "neptune.Upload.psProcessingText": "Uploaden...",
+  "neptune.Upload.retry": "Opnieuw proberen",
+  "neptune.Upload.usButtonText": "Of selecteer een bestand",
+  "neptune.Upload.usDropMessage": "Sleep het bestand hierheen om het te uploaden",
+  "neptune.Upload.usPlaceholder": "Sleep een bestand van maximaal {maxSize} MB",
+  "neptune.UploadButton.allFileTypes": "Alle bestandstypen",
+  "neptune.UploadButton.dropFiles": "Sleep het bestand hierheen om het te uploaden",
+  "neptune.UploadButton.instructions": "{fileTypes}, kleiner dan {size} MB",
+  "neptune.UploadButton.maximumFiles": "Maximaal {maxFiles} bestanden.",
+  "neptune.UploadButton.uploadFile": "Bestand uploaden",
+  "neptune.UploadButton.uploadFiles": "Bestanden uploaden",
+  "neptune.UploadInput.deleteModalBody": "Door dit bestand te verwijderen, wordt het uit ons systeem verwijderd.",
+  "neptune.UploadInput.deleteModalCancelButtonText": "Annuleren",
+  "neptune.UploadInput.deleteModalConfirmButtonText": "Verwijderen",
+  "neptune.UploadInput.deleteModalTitle": "Weet je zeker dat je dit bestand wilt verwijderen?",
+  "neptune.UploadInput.fileIsTooLarge": "Bestand is te groot",
+  "neptune.UploadInput.fileTypeNotSupported": "Bestandstype niet ondersteund",
+  "neptune.UploadInput.maximumFilesAlreadyUploaded": "Deze upload is mislukt omdat we maar {maxFilesAllowed} bestanden tegelijk kunnen accepteren.",
+  "neptune.UploadItem.deleting": "Verwijderen...",
+  "neptune.UploadItem.removeFile": "Bestand {filename} verwijderen",
+  "neptune.UploadItem.uploaded": "Geüpload",
+  "neptune.UploadItem.uploadedFile": "Geüpload bestand",
+  "neptune.UploadItem.uploading": "Uploaden...",
+  "neptune.UploadItem.uploadingFailed": "Uploaden mislukt"
+}

package/src/index.ts

@@ -108,7 +108,6 @@ export type {
   TableCellStatus,
   TableCellType,
 } from './table';
-export type { ItemProps, ItemAdditionalInfoProps, ItemCheckboxProps } from './item';
 
 /**
  * Components
@@ -210,7 +209,6 @@ export { default as Typeahead } from './typeahead';
 export { default as Upload } from './upload';
 export { default as UploadInput } from './uploadInput';
 export { default as Table } from './table';
-export { default as Item } from './table';
 
 /**
  * Hooks

package/src/info/Info.css

@@ -1,28 +1,5 @@
 .np-info {
-  height: 16px;
-  line-height: 1;
   vertical-align: middle;
-  color: var(--color-interactive-primary);
-}
-.np-info button,
-.np-info [data-toggle="popover"]:not(.btn) {
-  --ring-outline-offset: 0;
-  height: 16px;
-  overflow: hidden;
-  display: inline-block;
-}
-.np-info__large {
-  height: 24px;
-}
-.np-info__large button,
-.np-info__large [data-toggle="popover"]:not(.btn) {
-  height: 24px;
-  display: inline-block;
-}
-.np-info .tw-icon {
-  cursor: pointer;
-  color: var(--color-interactive-primary);
-  display: inline-block;
 }
 .np-info [data-toggle="popover"]:not(.btn) {
   border-bottom: none !important;