Add file extension to react-dates import (#2079)

sumup-oss · May 2, 2023 · 36351df · 36351df
1 parent f1b72a4
commit 36351df
Show file tree

Hide file tree

Showing 7 changed files with 14 additions and 12 deletions.
diff --git a/.changeset/odd-ducks-jog.md b/.changeset/odd-ducks-jog.md
@@ -0,0 +1,5 @@
+---
+'@sumup/circuit-ui': patch
+---
+
+Added file extensions to imports from `react-dates`.
diff --git a/.storybook/components/Statuses.tsx b/.storybook/components/Statuses.tsx
@@ -31,10 +31,10 @@ const descriptionStyles = css`
 `;
 
 const variants = {
-  stable: { variant: 'confirm', label: 'Stable' },
-  deprecated: { variant: 'alert', label: 'Deprecated' },
-  inReview: { variant: 'notify', label: 'In Review' },
-  experimental: { variant: 'notify', label: 'Experimental' },
+  stable: { variant: 'success', label: 'Stable' },
+  deprecated: { variant: 'danger', label: 'Deprecated' },
+  inReview: { variant: 'warning', label: 'In Review' },
+  experimental: { variant: 'warning', label: 'Experimental' },
 } as const;
 
 const Status = ({ variant: status = 'stable', children }: StatusProps) => {

diff --git a/packages/circuit-ui/components/Calendar/RangePicker.tsx b/packages/circuit-ui/components/Calendar/RangePicker.tsx
@@ -17,7 +17,7 @@ import { css } from '@emotion/react';
 import { ArrowRight, ArrowLeft, Close } from '@sumup/icons';
 import { DateRangePicker } from 'react-dates';
 import type { DateRangePickerShape } from 'react-dates';
-import 'react-dates/initialize';
+import 'react-dates/initialize.js';
 
 import styled from '../../styles/styled.js';
 

diff --git a/packages/circuit-ui/components/Calendar/RangePickerController.tsx b/packages/circuit-ui/components/Calendar/RangePickerController.tsx
@@ -16,7 +16,7 @@
 import { ArrowRight, ArrowLeft } from '@sumup/icons';
 import { DayPickerRangeController } from 'react-dates';
 import type { DayPickerRangeControllerShape } from 'react-dates';
-import 'react-dates/initialize';
+import 'react-dates/initialize.js';
 
 import { CalendarWrapper } from './components/index.js';
 

diff --git a/packages/circuit-ui/components/Calendar/SingleDayPicker.tsx b/packages/circuit-ui/components/Calendar/SingleDayPicker.tsx
@@ -16,7 +16,7 @@
 import { ArrowRight, ArrowLeft, Close } from '@sumup/icons';
 import { SingleDatePicker } from 'react-dates';
 import type { SingleDatePickerShape } from 'react-dates';
-import 'react-dates/initialize';
+import 'react-dates/initialize.js';
 
 import styled from '../../styles/styled.js';
 

diff --git a/packages/circuit-ui/components/CalendarTag/CalendarTag.tsx b/packages/circuit-ui/components/CalendarTag/CalendarTag.tsx
@@ -20,6 +20,7 @@ import type { ClickEvent } from '../../types/events.js';
 import styled from '../../styles/styled.js';
 import { RangePickerController } from '../Calendar/index.js';
 import Tag from '../Tag/index.js';
+import { START_DATE } from '../Calendar/constants.js';
 
 export interface CalendarTagProps {
   /**
@@ -43,8 +44,6 @@ type DateRange = {
 };
 type FocusedInput = 'startDate' | 'endDate' | null;
 
-const START_DATE = 'startDate';
-
 const CalendarWrap = styled.div`
   margin-top: ${({ theme }) => theme.spacings.byte};
 `;

diff --git a/packages/circuit-ui/components/CalendarTagTwoStep/CalendarTagTwoStep.tsx b/packages/circuit-ui/components/CalendarTagTwoStep/CalendarTagTwoStep.tsx
@@ -22,6 +22,7 @@ import styled from '../../styles/styled.js';
 import { RangePickerController } from '../Calendar/index.js';
 import Tag from '../Tag/index.js';
 import ButtonGroup from '../ButtonGroup/index.js';
+import { END_DATE, START_DATE } from '../Calendar/constants.js';
 
 export interface CalendarTagTwoStepProps {
   /**
@@ -54,9 +55,6 @@ type DateRange = {
 };
 type FocusedInput = 'startDate' | 'endDate' | null;
 
-const START_DATE = 'startDate';
-const END_DATE = 'endDate';
-
 const buttonGroupStyles = () => css`
   /* based on react dates */
   padding: 0 23px 18px 0;