From 54d7e9bf6cb52c0a422b8ddf77961afdbf606a95 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Connor=20B=C3=A4r?= Date: Wed, 4 Sep 2024 16:22:55 +0200 Subject: [PATCH 1/4] Remove the legacy calendar components --- .../components/legacy/Calendar/Calendar.mdx | 90 -- .../legacy/Calendar/Calendar.stories.tsx | 22 - .../legacy/Calendar/RangePicker.spec.tsx | 40 - .../legacy/Calendar/RangePicker.stories.tsx | 55 -- .../legacy/Calendar/RangePicker.tsx | 58 -- .../legacy/Calendar/RangePickerController.tsx | 51 - .../legacy/Calendar/SingleDayPicker.spec.tsx | 38 - .../Calendar/SingleDayPicker.stories.tsx | 42 - .../legacy/Calendar/SingleDayPicker.tsx | 47 - .../__snapshots__/RangePicker.spec.tsx.snap | 83 -- .../SingleDayPicker.spec.tsx.snap | 39 - .../CalendarWrapper/CalendarImportedStyles.ts | 906 ------------------ .../CalendarWrapper/CalendarWrapper.spec.tsx | 28 - .../CalendarWrapper/CalendarWrapper.tsx | 280 ------ .../components/CalendarWrapper/index.ts | 16 - .../legacy/Calendar/components/index.ts | 16 - .../components/legacy/Calendar/constants.ts | 58 -- .../components/legacy/Calendar/index.ts | 25 - .../legacy/CalendarTag/CalendarTag.spec.tsx | 44 - .../CalendarTag/CalendarTag.stories.tsx | 27 - .../legacy/CalendarTag/CalendarTag.tsx | 141 --- .../__snapshots__/CalendarTag.spec.tsx.snap | 18 - .../components/legacy/CalendarTag/index.ts | 18 - .../CalendarTagTwoStep.spec.tsx | 44 - .../CalendarTagTwoStep.stories.tsx | 38 - .../CalendarTagTwoStep/CalendarTagTwoStep.tsx | 198 ---- .../CalendarTagTwoStep.spec.tsx.snap | 18 - .../legacy/CalendarTagTwoStep/index.ts | 18 - packages/circuit-ui/legacy.ts | 15 - 29 files changed, 2473 deletions(-) delete mode 100644 packages/circuit-ui/components/legacy/Calendar/Calendar.mdx delete mode 100644 packages/circuit-ui/components/legacy/Calendar/Calendar.stories.tsx delete mode 100644 packages/circuit-ui/components/legacy/Calendar/RangePicker.spec.tsx delete mode 100644 packages/circuit-ui/components/legacy/Calendar/RangePicker.stories.tsx delete mode 100644 packages/circuit-ui/components/legacy/Calendar/RangePicker.tsx delete mode 100644 packages/circuit-ui/components/legacy/Calendar/RangePickerController.tsx delete mode 100644 packages/circuit-ui/components/legacy/Calendar/SingleDayPicker.spec.tsx delete mode 100644 packages/circuit-ui/components/legacy/Calendar/SingleDayPicker.stories.tsx delete mode 100644 packages/circuit-ui/components/legacy/Calendar/SingleDayPicker.tsx delete mode 100644 packages/circuit-ui/components/legacy/Calendar/__snapshots__/RangePicker.spec.tsx.snap delete mode 100644 packages/circuit-ui/components/legacy/Calendar/__snapshots__/SingleDayPicker.spec.tsx.snap delete mode 100644 packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/CalendarImportedStyles.ts delete mode 100644 packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/CalendarWrapper.spec.tsx delete mode 100644 packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/CalendarWrapper.tsx delete mode 100644 packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/index.ts delete mode 100644 packages/circuit-ui/components/legacy/Calendar/components/index.ts delete mode 100644 packages/circuit-ui/components/legacy/Calendar/constants.ts delete mode 100644 packages/circuit-ui/components/legacy/Calendar/index.ts delete mode 100644 packages/circuit-ui/components/legacy/CalendarTag/CalendarTag.spec.tsx delete mode 100644 packages/circuit-ui/components/legacy/CalendarTag/CalendarTag.stories.tsx delete mode 100644 packages/circuit-ui/components/legacy/CalendarTag/CalendarTag.tsx delete mode 100644 packages/circuit-ui/components/legacy/CalendarTag/__snapshots__/CalendarTag.spec.tsx.snap delete mode 100644 packages/circuit-ui/components/legacy/CalendarTag/index.ts delete mode 100644 packages/circuit-ui/components/legacy/CalendarTagTwoStep/CalendarTagTwoStep.spec.tsx delete mode 100644 packages/circuit-ui/components/legacy/CalendarTagTwoStep/CalendarTagTwoStep.stories.tsx delete mode 100644 packages/circuit-ui/components/legacy/CalendarTagTwoStep/CalendarTagTwoStep.tsx delete mode 100644 packages/circuit-ui/components/legacy/CalendarTagTwoStep/__snapshots__/CalendarTagTwoStep.spec.tsx.snap delete mode 100644 packages/circuit-ui/components/legacy/CalendarTagTwoStep/index.ts diff --git a/packages/circuit-ui/components/legacy/Calendar/Calendar.mdx b/packages/circuit-ui/components/legacy/Calendar/Calendar.mdx deleted file mode 100644 index ff3db3854c..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/Calendar.mdx +++ /dev/null @@ -1,90 +0,0 @@ -import { Meta, Status, Story } from '../../../../../.storybook/components'; -import * as RangePickerStories from './RangePicker.stories'; -import * as SingleDayPickerStories from './SingleDayPicker.stories'; -import * as CalendarTagStories from '../CalendarTag/CalendarTag.stories'; -import * as CalendarTagTwoStepStories from '../CalendarTagTwoStep/CalendarTagTwoStep.stories'; -import * as Stories from './Calendar.stories'; - - - -# Calendar - -Does not meet accessibility and performance requirements. - -A calendar contains a view with actionable buttons in order to pick a range of dates -and time frames for a specific task. - -## Dependencies - -The calendar components depend on [`react-dates`](https://github.com/react-dates/react-dates), [`moment`](https://momentjs.com/) and [Emotion.js](https://github.com/emotion-js/emotion) which are no longer included in Circuit UI. Install them manually before using the components: - -```bash -# npm -npm install react-dates@^21.8 moment@^2.29 @emotion/react@^11 @emotion/styled@^11 -# yarn v1 -yarn add react-dates@^21.8 moment@^2.29 @emotion/react@^11 @emotion/styled@^11 -``` - -Note that `react-dates` isn't compatible with React 18 yet ([ref](https://github.com/react-dates/react-dates/issues/2199)) and might cause a peer dependency error when using npm. Override the warning with `npm install --force` at your own risk. - -The calendar components depend on the legacy JSON theme. Wrap the component or your entire application in the `ThemeProvider` from Emotion.js: - -```tsx -import { ThemeProvider } from '@emotion/react'; -import { light } from '@sumup-oss/design-tokens'; -import { SingleDayPicker } from '@sumup-oss/circuit-ui/legacy'; - -export default function App() { - return ( - - - - ); -} -``` - -## When to use it - -Calendars are used when we need our users to pick a specific time period in order to complete a task -or filter a subset of dated items (such as the transaction history, for example). - -## Usage guidelines - -- **Do** suggest frequently used selections, such as "Today", "Last month", and others. -- **Do** use the proper component variation depending on how you need the data input -- **Do not** use it when requiring dates very far from the present, such as a birth date. - -## Component variations - -### Range Picker - - - -Used when the user needs to have clear visibility of selected start and end dates after the selection, -for instance when a user needs to pick a time period within a form. - - - -### Single Day Picker - - - -Used when you the user only needs to select a single specific date. - - - -### Calendar Tag - - - -Used for cases where the user needs to select dates within the same month and that selection affects the data displayed. - - - -### Calendar Tag Two Step - - - -Used for cases where the user needs to select dates that could be outside the same month and that selection affects the data displayed. - - diff --git a/packages/circuit-ui/components/legacy/Calendar/Calendar.stories.tsx b/packages/circuit-ui/components/legacy/Calendar/Calendar.stories.tsx deleted file mode 100644 index dd43ecbb4c..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/Calendar.stories.tsx +++ /dev/null @@ -1,22 +0,0 @@ -/** - * Copyright 2024, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -export default { - title: 'Forms/Calendar', -}; - -export const Hidden = () =>
; - -Hidden.tags = ['hidden']; diff --git a/packages/circuit-ui/components/legacy/Calendar/RangePicker.spec.tsx b/packages/circuit-ui/components/legacy/Calendar/RangePicker.spec.tsx deleted file mode 100644 index 2627feb242..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/RangePicker.spec.tsx +++ /dev/null @@ -1,40 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { describe, expect, it, vi } from 'vitest'; - -import { render } from '../../../util/test-utils.js'; - -import { RangePicker } from './index.js'; - -describe('RangePicker', () => { - /** - * Style tests. - */ - it('should render with default styles', () => { - const { container } = render( - , - ); - expect(container).toMatchSnapshot(); - }); -}); diff --git a/packages/circuit-ui/components/legacy/Calendar/RangePicker.stories.tsx b/packages/circuit-ui/components/legacy/Calendar/RangePicker.stories.tsx deleted file mode 100644 index dd04657d02..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/RangePicker.stories.tsx +++ /dev/null @@ -1,55 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { useState } from 'react'; -import type { Moment } from 'moment'; -import type { FocusedInputShape } from 'react-dates'; - -import { RangePicker, type RangePickerProps } from './RangePicker.js'; - -export default { - title: 'Forms/Calendar/RangePicker', - component: RangePicker, - argTypes: { - showClearDates: { control: 'boolean' }, - }, -}; - -export const Base = (args: RangePickerProps) => { - const [{ startDate, endDate }, setRange] = useState<{ - startDate: Moment | null; - endDate: Moment | null; - }>({ startDate: null, endDate: null }); - const [focusedInput, setFocusedInput] = useState( - null, - ); - - return ( - - ); -}; - -Base.args = { - showClearDates: true, -}; diff --git a/packages/circuit-ui/components/legacy/Calendar/RangePicker.tsx b/packages/circuit-ui/components/legacy/Calendar/RangePicker.tsx deleted file mode 100644 index 02bd86b9da..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/RangePicker.tsx +++ /dev/null @@ -1,58 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/** @jsxImportSource @emotion/react */ - -import { css } from '@emotion/react'; -import { ArrowRight, ArrowLeft, Close } from '@sumup-oss/icons'; -// eslint-disable-next-line import/no-extraneous-dependencies -import { DateRangePicker } from 'react-dates'; -import type { DateRangePickerShape } from 'react-dates'; -// eslint-disable-next-line import/no-extraneous-dependencies -import 'react-dates/initialize.js'; - -import styled from '../../../styles/styled.js'; - -import { CalendarWrapper } from './components/index.js'; - -const ArrowIcon = styled(ArrowRight)` - color: var(--cui-fg-normal); -`; - -const CloseIcon = styled(Close)( - ({ theme }) => css` - color: var(--cui-fg-normal); - margin: ${theme.spacings.bit} ${theme.spacings.bit} 0 0; /* Adjust spacing to fit in the 32px customArrowIcon container */ - `, -); - -export type RangePickerProps = DateRangePickerShape; - -/** - * @legacy - */ -export const RangePicker = (props: RangePickerProps) => ( - - } - navNext={} - navPrev={} - customCloseIcon={} - numberOfMonths={1} - hideKeyboardShortcutsPanel - {...props} - /> - -); diff --git a/packages/circuit-ui/components/legacy/Calendar/RangePickerController.tsx b/packages/circuit-ui/components/legacy/Calendar/RangePickerController.tsx deleted file mode 100644 index c086169b3c..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/RangePickerController.tsx +++ /dev/null @@ -1,51 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { ArrowRight, ArrowLeft } from '@sumup-oss/icons'; -// eslint-disable-next-line import/no-extraneous-dependencies -import { DayPickerRangeController } from 'react-dates'; -import type { DayPickerRangeControllerShape } from 'react-dates'; -// eslint-disable-next-line import/no-extraneous-dependencies -import 'react-dates/initialize.js'; - -import { deprecate } from '../../../util/logger.js'; - -import { CalendarWrapper } from './components/index.js'; - -export type RangePickerControllerProps = DayPickerRangeControllerShape; - -/** - * @deprecated Use the experimental Calendar component instead. - */ -export const RangePickerController = (props: RangePickerControllerProps) => { - if (process.env.NODE_ENV !== 'production') { - deprecate( - 'RangePickerController', - 'The RangePickerController component is deprecated. Use the experimental Calendar component instead.', - ); - } - - return ( - - } - navPrev={} - numberOfMonths={1} - hideKeyboardShortcutsPanel - {...props} - /> - - ); -}; diff --git a/packages/circuit-ui/components/legacy/Calendar/SingleDayPicker.spec.tsx b/packages/circuit-ui/components/legacy/Calendar/SingleDayPicker.spec.tsx deleted file mode 100644 index a8de6b6439..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/SingleDayPicker.spec.tsx +++ /dev/null @@ -1,38 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { describe, expect, it, vi } from 'vitest'; - -import { render } from '../../../util/test-utils.js'; - -import { SingleDayPicker } from './index.js'; - -const props = { - onDateChange: vi.fn(), - onFocusChange: vi.fn(), - id: 'date', - date: null, - focused: false, -}; - -describe('SingleDayPicker', () => { - /** - * Style tests. - */ - it('should render with default styles', () => { - const { container } = render(); - expect(container).toMatchSnapshot(); - }); -}); diff --git a/packages/circuit-ui/components/legacy/Calendar/SingleDayPicker.stories.tsx b/packages/circuit-ui/components/legacy/Calendar/SingleDayPicker.stories.tsx deleted file mode 100644 index 81f01a2ed1..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/SingleDayPicker.stories.tsx +++ /dev/null @@ -1,42 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { useState } from 'react'; -import type { Moment } from 'moment'; - -import { - SingleDayPicker, - type SingleDayPickerProps, -} from './SingleDayPicker.js'; - -export default { - title: 'Forms/Calendar/SingleDayPicker', - component: SingleDayPicker, -}; - -export const Base = (args: SingleDayPickerProps) => { - const [date, setDate] = useState(null); - const [focusedInput, setFocusedInput] = useState(false); - - return ( - setFocusedInput(focused)} - /> - ); -}; diff --git a/packages/circuit-ui/components/legacy/Calendar/SingleDayPicker.tsx b/packages/circuit-ui/components/legacy/Calendar/SingleDayPicker.tsx deleted file mode 100644 index 4973b30ea0..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/SingleDayPicker.tsx +++ /dev/null @@ -1,47 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { ArrowRight, ArrowLeft, Close } from '@sumup-oss/icons'; -// eslint-disable-next-line import/no-extraneous-dependencies -import { SingleDatePicker } from 'react-dates'; -import type { SingleDatePickerShape } from 'react-dates'; -// eslint-disable-next-line import/no-extraneous-dependencies -import 'react-dates/initialize.js'; - -import styled from '../../../styles/styled.js'; - -import { CalendarWrapper } from './components/index.js'; - -const CloseIcon = styled(Close)` - color: var(--cui-fg-normal); -`; - -export type SingleDayPickerProps = SingleDatePickerShape; - -/** - * @legacy - */ -export const SingleDayPicker = (props: SingleDayPickerProps) => ( - - } - navPrev={} - customCloseIcon={} - numberOfMonths={1} - hideKeyboardShortcutsPanel - {...props} - /> - -); diff --git a/packages/circuit-ui/components/legacy/Calendar/__snapshots__/RangePicker.spec.tsx.snap b/packages/circuit-ui/components/legacy/Calendar/__snapshots__/RangePicker.spec.tsx.snap deleted file mode 100644 index b77325fcc3..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/__snapshots__/RangePicker.spec.tsx.snap +++ /dev/null @@ -1,83 +0,0 @@ -// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html - -exports[`RangePicker > should render with default styles 1`] = ` -.circuit-0 { - color: var(--cui-fg-normal); -} - -
-
-
-
-
-
- -

- Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates. -

-
- -
- -

- Navigate backward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates. -

-
-
-
-
-
-
-`; diff --git a/packages/circuit-ui/components/legacy/Calendar/__snapshots__/SingleDayPicker.spec.tsx.snap b/packages/circuit-ui/components/legacy/Calendar/__snapshots__/SingleDayPicker.spec.tsx.snap deleted file mode 100644 index 325247712a..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/__snapshots__/SingleDayPicker.spec.tsx.snap +++ /dev/null @@ -1,39 +0,0 @@ -// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html - -exports[`SingleDayPicker > should render with default styles 1`] = ` -
-
-
-
-
-
- -

- Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates. -

-
-
-
-
-
-
-`; diff --git a/packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/CalendarImportedStyles.ts b/packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/CalendarImportedStyles.ts deleted file mode 100644 index 5912f7f7a9..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/CalendarImportedStyles.ts +++ /dev/null @@ -1,906 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { css } from '@emotion/react'; - -export const calendarInheritStyles = () => css` - .PresetDateRangePicker_panel { - padding: 0 22px 11px; - } - .PresetDateRangePicker_button { - position: relative; - height: 100%; - text-align: center; - background: 0 0; - border: 2px solid #00a699; - color: #00a699; - padding: 4px 12px; - margin-right: 8px; - font: inherit; - font-weight: 700; - line-height: normal; - overflow: visible; - -moz-box-sizing: border-box; - box-sizing: border-box; - cursor: pointer; - } - .PresetDateRangePicker_button:active { - outline: 0; - } - .PresetDateRangePicker_button__selected { - color: var(--cui-fg-on-strong); - background: #00a699; - } - .SingleDatePickerInput { - display: inline-block; - background-color: var(--cui-bg-normal); - } - .SingleDatePickerInput__withBorder { - border-radius: 2px; - border: 1px solid #dbdbdb; - } - .SingleDatePickerInput__rtl { - direction: rtl; - } - .SingleDatePickerInput__disabled { - background-color: #f2f2f2; - } - .SingleDatePickerInput__block { - display: block; - } - .SingleDatePickerInput__showClearDate { - padding-right: 30px; - } - .SingleDatePickerInput_clearDate { - background: 0 0; - border: 0; - color: inherit; - font: inherit; - line-height: normal; - overflow: visible; - cursor: pointer; - padding: 10px; - margin: 0 10px 0 5px; - position: absolute; - right: 0; - top: 50%; - -webkit-transform: translateY(-50%); - -ms-transform: translateY(-50%); - transform: translateY(-50%); - } - .SingleDatePickerInput_clearDate__default:focus, - .SingleDatePickerInput_clearDate__default:hover { - background: #dbdbdb; - border-radius: 50%; - } - .SingleDatePickerInput_clearDate__small { - padding: 6px; - } - .SingleDatePickerInput_clearDate__hide { - visibility: hidden; - } - .SingleDatePickerInput_clearDate_svg { - fill: #82888a; - height: 12px; - width: 15px; - vertical-align: middle; - } - .SingleDatePickerInput_clearDate_svg__small { - height: 9px; - } - .SingleDatePickerInput_calendarIcon { - background: 0 0; - border: 0; - color: inherit; - font: inherit; - line-height: normal; - overflow: visible; - cursor: pointer; - display: inline-block; - vertical-align: middle; - padding: 10px; - margin: 0 5px 0 10px; - } - .SingleDatePickerInput_calendarIcon_svg { - fill: #82888a; - height: 15px; - width: 14px; - vertical-align: middle; - } - .SingleDatePicker { - position: relative; - display: inline-block; - } - .SingleDatePicker__block { - display: block; - } - .SingleDatePicker_picker { - z-index: 1; - background-color: var(--cui-bg-normal); - position: absolute; - } - .SingleDatePicker_picker__rtl { - direction: rtl; - } - .SingleDatePicker_picker__directionLeft { - left: 0; - } - .SingleDatePicker_picker__directionRight { - right: 0; - } - .SingleDatePicker_picker__portal { - background-color: rgba(0, 0, 0, 0.3); - position: fixed; - top: 0; - left: 0; - height: 100%; - width: 100%; - } - .SingleDatePicker_picker__fullScreenPortal { - background-color: var(--cui-bg-normal); - } - .SingleDatePicker_closeButton { - background: 0 0; - border: 0; - color: inherit; - font: inherit; - line-height: normal; - overflow: visible; - cursor: pointer; - position: absolute; - top: 0; - right: 0; - padding: 15px; - z-index: 2; - } - .SingleDatePicker_closeButton:focus, - .SingleDatePicker_closeButton:hover { - color: darken(#cacccd, 10%); - text-decoration: none; - } - .SingleDatePicker_closeButton_svg { - height: 15px; - width: 15px; - fill: #cacccd; - } - .DayPickerKeyboardShortcuts_buttonReset { - background: 0 0; - border: 0; - border-radius: 0; - color: inherit; - font: inherit; - line-height: normal; - overflow: visible; - padding: 0; - cursor: pointer; - font-size: 14px; - } - .DayPickerKeyboardShortcuts_buttonReset:active { - outline: 0; - } - .DayPickerKeyboardShortcuts_show { - width: 33px; - height: 26px; - position: absolute; - z-index: 2; - } - .DayPickerKeyboardShortcuts_show::before { - content: ''; - display: block; - position: absolute; - } - .DayPickerKeyboardShortcuts_show__bottomRight { - bottom: 0; - right: 0; - } - .DayPickerKeyboardShortcuts_show__bottomRight::before { - border-top: 26px solid transparent; - border-right: 33px solid #00a699; - bottom: 0; - right: 0; - } - .DayPickerKeyboardShortcuts_show__bottomRight:hover::before { - border-right: 33px solid #008489; - } - .DayPickerKeyboardShortcuts_show__topRight { - top: 0; - right: 0; - } - .DayPickerKeyboardShortcuts_show__topRight::before { - border-bottom: 26px solid transparent; - border-right: 33px solid #00a699; - top: 0; - right: 0; - } - .DayPickerKeyboardShortcuts_show__topRight:hover::before { - border-right: 33px solid #008489; - } - .DayPickerKeyboardShortcuts_show__topLeft { - top: 0; - left: 0; - } - .DayPickerKeyboardShortcuts_show__topLeft::before { - border-bottom: 26px solid transparent; - border-left: 33px solid #00a699; - top: 0; - left: 0; - } - .DayPickerKeyboardShortcuts_show__topLeft:hover::before { - border-left: 33px solid #008489; - border-left: 33px solid #008489; - } - .DayPickerKeyboardShortcuts_showSpan { - color: var(--cui-fg-on-strong); - position: absolute; - } - .DayPickerKeyboardShortcuts_showSpan__bottomRight { - bottom: 0; - right: 5px; - } - .DayPickerKeyboardShortcuts_showSpan__topRight { - top: 1px; - right: 5px; - } - .DayPickerKeyboardShortcuts_showSpan__topLeft { - top: 1px; - left: 5px; - } - .DayPickerKeyboardShortcuts_panel { - overflow: auto; - background-color: var(--cui-bg-normal); - border: 1px solid #dbdbdb; - border-radius: 2px; - position: absolute; - top: 0; - bottom: 0; - right: 0; - left: 0; - z-index: 2; - padding: 22px; - margin: 33px; - text-align: left; - } - .DayPickerKeyboardShortcuts_title { - font-size: 16px; - font-weight: 700; - margin: 0; - } - .DayPickerKeyboardShortcuts_list { - list-style: none; - padding: 0; - font-size: 14px; - } - .DayPickerKeyboardShortcuts_close { - position: absolute; - right: 22px; - top: 22px; - z-index: 2; - } - .DayPickerKeyboardShortcuts_close:active { - outline: 0; - } - .DayPickerKeyboardShortcuts_closeSvg { - height: 15px; - width: 15px; - fill: #cacccd; - } - .DayPickerKeyboardShortcuts_closeSvg:focus, - .DayPickerKeyboardShortcuts_closeSvg:hover { - fill: #82888a; - } - .CalendarDay { - -moz-box-sizing: border-box; - box-sizing: border-box; - cursor: pointer; - font-size: 14px; - text-align: center; - } - .CalendarDay:active { - outline: 0; - } - .CalendarDay__defaultCursor { - cursor: default; - } - .CalendarDay__default { - border: 1px solid #e4e7e7; - color: #484848; - background-color: var(--cui-bg-normal); - } - .CalendarDay__default:hover { - background: #e4e7e7; - border: 1px solid #e4e7e7; - color: inherit; - } - .CalendarDay__hovered_offset { - background: #f4f5f5; - border: 1px double #e4e7e7; - color: inherit; - } - .CalendarDay__outside { - border: 0; - background-color: var(--cui-bg-normal); - color: #484848; - } - .CalendarDay__outside:hover { - border: 0; - } - .CalendarDay__blocked_minimum_nights { - background-color: var(--cui-bg-normal); - border: 1px solid #eceeee; - color: #cacccd; - } - .CalendarDay__blocked_minimum_nights:active, - .CalendarDay__blocked_minimum_nights:hover { - background-color: var(--cui-bg-normal); - color: #cacccd; - } - .CalendarDay__highlighted_calendar { - background: #ffe8bc; - color: #484848; - } - .CalendarDay__highlighted_calendar:active, - .CalendarDay__highlighted_calendar:hover { - background: #ffce71; - color: #484848; - } - .CalendarDay__selected_span { - background: #66e2da; - border: 1px double #33dacd; - color: var(--cui-fg-on-strong); - } - .CalendarDay__selected_span:active, - .CalendarDay__selected_span:hover { - background: #33dacd; - border: 1px double #33dacd; - color: var(--cui-fg-on-strong); - } - .CalendarDay__selected, - .CalendarDay__selected:active, - .CalendarDay__selected:hover { - background: #00a699; - border: 1px double #00a699; - color: var(--cui-fg-on-strong); - } - .CalendarDay__hovered_span, - .CalendarDay__hovered_span:hover { - background: #b2f1ec; - border: 1px double #80e8e0; - color: #007a87; - } - .CalendarDay__hovered_span:active { - background: #80e8e0; - border: 1px double #80e8e0; - color: #007a87; - } - .CalendarDay__blocked_calendar, - .CalendarDay__blocked_calendar:active, - .CalendarDay__blocked_calendar:hover { - background: #cacccd; - border: 1px solid #cacccd; - color: #82888a; - } - .CalendarDay__blocked_out_of_range, - .CalendarDay__blocked_out_of_range:active, - .CalendarDay__blocked_out_of_range:hover { - background-color: var(--cui-bg-normal); - border: 1px solid #e4e7e7; - color: #cacccd; - } - .CalendarDay__hovered_start_first_possible_end { - background: #eceeee; - border: 1px double #eceeee; - } - .CalendarDay__hovered_start_blocked_min_nights { - background: #eceeee; - border: 1px double #e4e7e7; - } - .CalendarMonth { - background-color: var(--cui-bg-normal); - text-align: center; - vertical-align: top; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - } - .CalendarMonth_table { - border-collapse: collapse; - border-spacing: 0; - } - .CalendarMonth_verticalSpacing { - border-collapse: separate; - } - .CalendarMonth_caption { - color: #484848; - font-size: 18px; - text-align: center; - padding-top: 22px; - padding-bottom: 37px; - caption-side: initial; - } - .CalendarMonth_caption__verticalScrollable { - padding-top: 12px; - padding-bottom: 7px; - } - .CalendarMonthGrid { - background-color: var(--cui-bg-normal); - text-align: left; - z-index: 0; - } - .CalendarMonthGrid__animating { - z-index: 1; - } - .CalendarMonthGrid__horizontal { - position: absolute; - left: 9px; - } - .CalendarMonthGrid__vertical, - .CalendarMonthGrid__vertical_scrollable { - margin: 0 auto; - } - .CalendarMonthGrid_month__horizontal { - display: inline-block; - vertical-align: top; - min-height: 100%; - } - .CalendarMonthGrid_month__hideForAnimation { - position: absolute; - z-index: -1; - opacity: 0; - pointer-events: none; - } - .CalendarMonthGrid_month__hidden { - visibility: hidden; - } - .DayPickerNavigation { - position: relative; - z-index: 2; - } - .DayPickerNavigation__horizontal { - height: 0; - } - .DayPickerNavigation__verticalScrollable_prevNav { - z-index: 1; - } - .DayPickerNavigation__verticalDefault { - position: absolute; - width: 100%; - height: 52px; - bottom: 0; - left: 0; - } - .DayPickerNavigation__verticalScrollableDefault { - position: relative; - } - .DayPickerNavigation__bottom { - height: auto; - } - .DayPickerNavigation__bottomDefault { - -webkit-box-pack: justify; - -ms-flex-pack: justify; - display: -webkit-box; - display: -moz-box; - display: -ms-flexbox; - display: -webkit-flex; - display: flex; - -webkit-justify-content: space-between; - justify-content: space-between; - } - .DayPickerNavigation_button { - cursor: pointer; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - border: 0; - padding: 0; - margin: 0; - } - .DayPickerNavigation_button__default { - border: 1px solid #e4e7e7; - background-color: var(--cui-bg-normal); - color: #757575; - } - .DayPickerNavigation_button__default:focus, - .DayPickerNavigation_button__default:hover { - border: 1px solid #c4c4c4; - } - .DayPickerNavigation_button__default:active { - background: #f2f2f2; - } - .DayPickerNavigation_button__disabled { - cursor: default; - border: 1px solid #f2f2f2; - } - .DayPickerNavigation_button__disabled:focus, - .DayPickerNavigation_button__disabled:hover { - border: 1px solid #f2f2f2; - } - .DayPickerNavigation_button__disabled:active { - background: 0 0; - } - .DayPickerNavigation_button__horizontal { - position: absolute; - top: 18px; - line-height: 0.78; - border-radius: 3px; - padding: 6px 9px; - } - .DayPickerNavigation_bottomButton__horizontal { - position: static; - margin: -10px 22px 30px; - } - .DayPickerNavigation_leftButton__horizontal { - left: 22px; - } - .DayPickerNavigation_rightButton__horizontal { - right: 22px; - } - .DayPickerNavigation_button__vertical { - padding: 5px; - background-color: var(--cui-bg-normal); - box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1); - position: relative; - display: inline-block; - text-align: center; - height: 100%; - width: 50%; - } - .DayPickerNavigation_nextButton__vertical { - border-left: 0; - } - .DayPickerNavigation_nextButton__verticalScrollable, - .DayPickerNavigation_prevButton__verticalScrollable { - width: 100%; - } - .DayPickerNavigation_svg__horizontal { - height: 19px; - width: 19px; - fill: #82888a; - display: block; - } - .DayPickerNavigation_svg__vertical { - height: 42px; - width: 42px; - fill: #484848; - } - .DayPickerNavigation_svg__disabled { - fill: #f2f2f2; - } - .DayPicker { - background-color: var(--cui-bg-normal); - position: relative; - text-align: left; - } - .DayPicker__horizontal { - background-color: var(--cui-bg-normal); - } - .DayPicker__verticalScrollable { - height: 100%; - } - .DayPicker__hidden { - visibility: hidden; - } - .DayPicker__withBorder { - box-shadow: 0 0 0 1px var(--cui-border-normal); - border-radius: 3px; - } - .DayPicker_portal__horizontal { - box-shadow: none; - position: absolute; - left: 50%; - top: 50%; - } - .DayPicker_portal__vertical { - position: initial; - } - .DayPicker_focusRegion { - outline: 0; - } - .DayPicker_calendarInfo__horizontal, - .DayPicker_wrapper__horizontal { - display: inline-block; - vertical-align: top; - } - .DayPicker_weekHeaders { - position: relative; - } - .DayPicker_weekHeaders__horizontal { - margin-left: 9px; - } - .DayPicker_weekHeader { - color: #757575; - position: absolute; - top: 62px; - z-index: 2; - text-align: left; - } - .DayPicker_weekHeader__vertical { - left: 50%; - } - .DayPicker_weekHeader__verticalScrollable { - top: 0; - display: table-row; - border-bottom: 1px solid #dbdbdb; - background-color: var(--cui-bg-normal); - margin-left: 0; - left: 0; - width: 100%; - text-align: center; - } - .DayPicker_weekHeader_ul { - list-style: none; - margin: 1px 0; - padding-left: 0; - padding-right: 0; - font-size: 14px; - } - .DayPicker_weekHeader_li { - display: inline-block; - text-align: center; - } - .DayPicker_transitionContainer { - position: relative; - overflow: hidden; - border-radius: 3px; - } - .DayPicker_transitionContainer__horizontal { - -webkit-transition: height 0.2s ease-in-out; - -moz-transition: height 0.2s ease-in-out; - transition: height 0.2s ease-in-out; - } - .DayPicker_transitionContainer__vertical { - width: 100%; - } - .DayPicker_transitionContainer__verticalScrollable { - padding-top: 20px; - height: 100%; - position: absolute; - top: 0; - bottom: 0; - right: 0; - left: 0; - overflow-y: scroll; - } - .DateInput { - margin: 0; - padding: 0; - background-color: var(--cui-bg-normal); - position: relative; - display: inline-block; - width: 130px; - vertical-align: middle; - } - .DateInput__small { - width: 97px; - } - .DateInput__block { - width: 100%; - } - .DateInput__disabled { - background: #f2f2f2; - color: #dbdbdb; - } - .DateInput_input { - font-weight: 200; - font-size: 19px; - line-height: 24px; - color: #484848; - background-color: var(--cui-bg-normal); - width: 100%; - padding: 11px 11px 9px; - border: 0; - border-top: 0; - border-right: 0; - border-bottom: 2px solid transparent; - border-left: 0; - border-radius: 0; - } - .DateInput_input__small { - font-size: 15px; - line-height: 18px; - letter-spacing: 0.2px; - padding: 7px 7px 5px; - } - .DateInput_input__regular { - font-weight: auto; - } - .DateInput_input__readOnly { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - } - .DateInput_input__focused { - outline: 0; - background-color: var(--cui-bg-normal); - border: 0; - border-top: 0; - border-right: 0; - border-bottom: 2px solid #008489; - border-left: 0; - } - .DateInput_input__disabled { - background: #f2f2f2; - font-style: italic; - } - .DateInput_screenReaderMessage { - border: 0; - clip: rect(0, 0, 0, 0); - height: 1px; - margin: -1px; - overflow: hidden; - padding: 0; - position: absolute; - width: 1px; - } - .DateInput_fang { - position: absolute; - width: 20px; - height: 10px; - left: 22px; - z-index: 20000; - } - .DateInput_fangShape { - fill: var(--cui-bg-normal); - } - .DateInput_fangStroke { - stroke: var(--cui-border-normal); - fill: transparent; - } - .DateRangePickerInput { - background-color: var(--cui-bg-normal); - display: inline-block; - } - .DateRangePickerInput__disabled { - background: #f2f2f2; - } - .DateRangePickerInput__withBorder { - border-radius: 2px; - border: 1px solid #dbdbdb; - } - .DateRangePickerInput__rtl { - direction: rtl; - } - .DateRangePickerInput__block { - display: block; - } - .DateRangePickerInput__showClearDates { - padding-right: 30px; - } - .DateRangePickerInput_arrow { - display: inline-block; - vertical-align: middle; - color: #484848; - } - .DateRangePickerInput_arrow_svg { - vertical-align: middle; - fill: #484848; - height: 24px; - width: 24px; - } - .DateRangePickerInput_clearDates { - background: 0 0; - border: 0; - color: inherit; - font: inherit; - line-height: normal; - overflow: visible; - cursor: pointer; - padding: 10px; - margin: 0 10px 0 5px; - position: absolute; - right: 0; - top: 50%; - -webkit-transform: translateY(-50%); - -ms-transform: translateY(-50%); - transform: translateY(-50%); - } - .DateRangePickerInput_clearDates__small { - padding: 6px; - } - .DateRangePickerInput_clearDates_default:focus, - .DateRangePickerInput_clearDates_default:hover { - background: #dbdbdb; - border-radius: 50%; - } - .DateRangePickerInput_clearDates__hide { - visibility: hidden; - } - .DateRangePickerInput_clearDates_svg { - fill: #82888a; - height: 12px; - width: 15px; - vertical-align: middle; - } - .DateRangePickerInput_clearDates_svg__small { - height: 9px; - } - .DateRangePickerInput_calendarIcon { - background: 0 0; - border: 0; - color: inherit; - font: inherit; - line-height: normal; - overflow: visible; - cursor: pointer; - display: inline-block; - vertical-align: middle; - padding: 10px; - margin: 0 5px 0 10px; - } - .DateRangePickerInput_calendarIcon_svg { - fill: #82888a; - height: 15px; - width: 14px; - vertical-align: middle; - } - .DateRangePicker { - position: relative; - display: inline-block; - } - .DateRangePicker__block { - display: block; - } - .DateRangePicker_picker { - z-index: 1; - background-color: var(--cui-bg-normal); - position: absolute; - } - .DateRangePicker_picker__rtl { - direction: rtl; - } - .DateRangePicker_picker__directionLeft { - left: 0; - } - .DateRangePicker_picker__directionRight { - right: 0; - } - .DateRangePicker_picker__portal { - background-color: rgba(0, 0, 0, 0.3); - position: fixed; - top: 0; - left: 0; - height: 100%; - width: 100%; - } - .DateRangePicker_picker__fullScreenPortal { - background-color: var(--cui-bg-normal); - } - .DateRangePicker_closeButton { - background: 0 0; - border: 0; - color: inherit; - font: inherit; - line-height: normal; - overflow: visible; - cursor: pointer; - position: absolute; - top: 0; - right: 0; - padding: 15px; - z-index: 2; - } - .DateRangePicker_closeButton:focus, - .DateRangePicker_closeButton:hover { - color: darken(#cacccd, 10%); - text-decoration: none; - } - .DateRangePicker_closeButton_svg { - height: 15px; - width: 15px; - fill: #cacccd; - } -`; diff --git a/packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/CalendarWrapper.spec.tsx b/packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/CalendarWrapper.spec.tsx deleted file mode 100644 index 85cce49620..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/CalendarWrapper.spec.tsx +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { describe, expect, it } from 'vitest'; - -import { render, screen } from '../../../../../util/test-utils.js'; - -import { CalendarWrapper } from './index.js'; - -describe('CalendarWrapper', () => { - it('should render its children', () => { - const children = 'children'; - render({children}); - expect(screen.getByText(children)).toBeVisible(); - }); -}); diff --git a/packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/CalendarWrapper.tsx b/packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/CalendarWrapper.tsx deleted file mode 100644 index fefda6729f..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/CalendarWrapper.tsx +++ /dev/null @@ -1,280 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/** @jsxImportSource @emotion/react */ - -import type { ReactNode } from 'react'; -import type { Theme } from '@sumup-oss/design-tokens'; -import { css, Global } from '@emotion/react'; - -import { - typography, - focusVisible, - disableVisually, - cx, -} from '../../../../../styles/style-mixins.js'; - -import { calendarInheritStyles } from './CalendarImportedStyles.js'; - -const dayDefault = css` - .CalendarDay__default { - border: 1px solid var(--cui-border-divider); - color: var(--cui-fg-normal); - background: var(--cui-bg-normal); - vertical-align: middle; - - &:hover { - background: var(--cui-bg-normal-hovered); - border: 1px double var(--cui-border-normal-hovered); - color: inherit; - } - } - - .CalendarDay__hovered_span { - &, - &:hover { - background: var(--cui-bg-accent-hovered); - border: 1px solid var(--cui-border-accent-hovered); - } - - &:active { - background: var(--cui-bg-accent-pressed); - border: 1px solid var(--cui-border-accent-pressed); - } - } -`; - -const daySelection = css` - .CalendarDay__selected_span { - background: var(--cui-bg-accent); - border: 1px solid var(--cui-border-accent); - - &:hover { - color: var(--cui-fg-normal-hovered); - background: var(--cui-bg-accent-hovered); - border: 1px solid var(--cui-border-accent-hovered); - } - } - .CalendarDay__last_in_range { - border-right: var(--cui-border-accent); - } - .CalendarDay__selected { - background: var(--cui-bg-accent-strong); - border: 1px solid var(--cui-border-accent); - color: var(--cui-fg-on-strong); - } - .CalendarDay__selected:hover { - background: var(--cui-bg-accent-strong-hovered); - border: 1px solid var(--cui-border-accent-hovered); - color: var(--cui-fg-on-strong-hovered); - } - .CalendarDay__selected:active { - background: var(--cui-bg-accent-strong-pressed); - border: 1px solid var(--cui-border-accent-pressed); - color: var(--cui-fg-on-strong-pressed); - } -`; - -const blockedOutOfRange = css` - .CalendarDay__blocked_out_of_range, - .CalendarDay__blocked_out_of_range:active, - .CalendarDay__blocked_out_of_range:hover { - background-color: var(--cui-bg-normal); - border: 1px solid var(--cui-border-divider); - color: var(--cui-fg-normal-disabled); - } -`; - -const dateRangePickerInput = (theme: Theme) => css` - .DateRangePickerInput, - .SingleDatePickerInput { - background-color: var(--cui-bg-normal); - padding: ${theme.spacings.kilo} ${theme.spacings.mega}; - transition: border-color ${theme.transitions.default}; - width: 100%; - ${typography('one')(theme)}; - - &.DateRangePickerInput__withBorder, - &.SingleDatePickerInput__withBorder { - border: none; - border-radius: ${theme.borderRadius.byte}; - transition: box-shadow ${theme.transitions.default}; - box-shadow: 0 0 0 1px var(--cui-border-strong); - - &:hover { - box-shadow: 0 0 0 1px var(--cui-border-strong-hovered); - } - &:focus-within { - box-shadow: 0 0 0 2px var(--cui-border-accent); - } - } - - &.DateRangePickerInput__showClearDates { - padding-right: 30px; - } - } - - .DateRangePickerInput__disabled { - background: var(--cui-bg-normal-disabled); - } - - .DateRangePickerInput_arrow { - margin: 0 ${theme.spacings.kilo}; - width: ${theme.spacings.giga}; - height: ${theme.spacings.giga}; - } - - .DateInput { - width: 90px; - vertical-align: inherit; - } - - .DateInput_input { - color: var(--cui-fg-normal); - ${typography('one')(theme)}; - font-weight: 200; - background-color: inherit; - width: 100%; - padding: 0; - border: none; - - &::placeholder { - color: var(--cui-fg-placeholder); - transition: color ${theme.transitions.default}; - } - } - - .DateInput_fang { - margin-top: -11px; - } -`; - -const navButtons = (theme: Theme) => css` - .DayPickerNavigation_button__horizontal { - display: flex; - align-items: center; - justify-content: center; - width: auto; - height: auto; - cursor: pointer; - text-align: center; - border: 1px solid var(--cui-border-normal); - background-color: var(--cui-bg-normal); - color: var(--cui-fg-normal); - padding: ${theme.spacings.byte}; - border-radius: ${theme.borderRadius.pill}; - transition: - opacity ${theme.transitions.default}, - color ${theme.transitions.default}, - background-color ${theme.transitions.default}, - border-color ${theme.transitions.default}; - - &:hover { - background-color: var(--cui-bg-normal-hovered); - border-color: var(--cui-border-normal-hovered); - } - - &:active { - background-color: var(--cui-bg-normal-pressed); - border-color: var(--cui-border-normal-pressed); - } - - ${focusVisible()}; - - &:disabled, - &[disabled] { - ${disableVisually()}; - } - } - - .DayPickerNavigation_leftButton__horizontal { - transform: scale(-1, 1); - } - - .DayPickerNavigation_button__horizontal:nth-of-type(1) { - left: 22px; - } - .DayPickerNavigation_button__horizontal:nth-of-type(2) { - right: 22px; - } -`; - -const closeButton = (theme: Theme) => css` - .DateRangePickerInput_clearDates { - margin: 0; - width: ${theme.spacings.tera}; - height: ${theme.spacings.tera}; - padding: ${theme.spacings.bit}; - } -`; - -const calendarCaption = css` - .CalendarMonth_caption { - color: var(--cui-fg-normal); - font-size: 18px; - text-align: center; - padding-top: 22px; - padding-bottom: 43px; - caption-side: initial; - } -`; - -const calendarWeekHeader = (theme: Theme) => css` - .DayPicker_weekHeader { - color: var(--cui-fg-normal); - position: absolute; - top: 67px; - z-index: 2; - padding: 0 13px; - text-align: left; - - .DayPicker_weekHeader_ul { - ${typography('two')(theme)}; - } - } -`; - -const withPortal = (theme: Theme) => css` - .DateRangePicker_picker, - .SingleDatePicker_picker { - z-index: ${theme.zIndex.modal}; - } -`; - -interface CalendarWrapperProps { - children: ReactNode; -} - -export function CalendarWrapper({ children }: CalendarWrapperProps) { - return ( -
- - {children} -
- ); -} diff --git a/packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/index.ts b/packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/index.ts deleted file mode 100644 index 6adf3272b1..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/components/CalendarWrapper/index.ts +++ /dev/null @@ -1,16 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -export { CalendarWrapper } from './CalendarWrapper.js'; diff --git a/packages/circuit-ui/components/legacy/Calendar/components/index.ts b/packages/circuit-ui/components/legacy/Calendar/components/index.ts deleted file mode 100644 index cf0fa0655c..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/components/index.ts +++ /dev/null @@ -1,16 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -export { CalendarWrapper } from './CalendarWrapper/index.js'; diff --git a/packages/circuit-ui/components/legacy/Calendar/constants.ts b/packages/circuit-ui/components/legacy/Calendar/constants.ts deleted file mode 100644 index d7fd8a01f3..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/constants.ts +++ /dev/null @@ -1,58 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -// This file needs be be kept up to date with -// https://github.com/airbnb/react-dates/blob/master/src/constants.js -// react-dates doesn't support tree-shaking. The components can be code-split, -// but these constants are often used as props which makes code-splitting much -// trickier. Moving them into Circuit UI is a simpler solution. - -export const DISPLAY_FORMAT = 'L'; -export const ISO_FORMAT = 'YYYY-MM-DD'; -export const ISO_MONTH_FORMAT = 'YYYY-MM'; - -export const START_DATE = 'startDate'; -export const END_DATE = 'endDate'; - -export const HORIZONTAL_ORIENTATION = 'horizontal'; -export const VERTICAL_ORIENTATION = 'vertical'; -export const VERTICAL_SCROLLABLE = 'verticalScrollable'; - -export const NAV_POSITION_BOTTOM = 'navPositionBottom'; -export const NAV_POSITION_TOP = 'navPositionTop'; - -export const ICON_BEFORE_POSITION = 'before'; -export const ICON_AFTER_POSITION = 'after'; - -export const INFO_POSITION_TOP = 'top'; -export const INFO_POSITION_BOTTOM = 'bottom'; -export const INFO_POSITION_BEFORE = 'before'; -export const INFO_POSITION_AFTER = 'after'; - -export const ANCHOR_LEFT = 'left'; -export const ANCHOR_RIGHT = 'right'; - -export const OPEN_DOWN = 'down'; -export const OPEN_UP = 'up'; - -export const DAY_SIZE = 39; -export const BLOCKED_MODIFIER = 'blocked'; -export const WEEKDAYS = [0, 1, 2, 3, 4, 5, 6]; - -export const FANG_WIDTH_PX = 20; -export const FANG_HEIGHT_PX = 10; -export const DEFAULT_VERTICAL_SPACING = 22; - -export const MODIFIER_KEY_NAMES = new Set(['Shift', 'Control', 'Alt', 'Meta']); diff --git a/packages/circuit-ui/components/legacy/Calendar/index.ts b/packages/circuit-ui/components/legacy/Calendar/index.ts deleted file mode 100644 index be67a789da..0000000000 --- a/packages/circuit-ui/components/legacy/Calendar/index.ts +++ /dev/null @@ -1,25 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import * as CalendarConstants from './constants.js'; - -export { RangePicker } from './RangePicker.js'; -export type { RangePickerProps } from './RangePicker.js'; -export { RangePickerController } from './RangePickerController.js'; -export type { RangePickerControllerProps } from './RangePickerController.js'; -export { SingleDayPicker } from './SingleDayPicker.js'; -export type { SingleDayPickerProps } from './SingleDayPicker.js'; - -export { CalendarConstants }; diff --git a/packages/circuit-ui/components/legacy/CalendarTag/CalendarTag.spec.tsx b/packages/circuit-ui/components/legacy/CalendarTag/CalendarTag.spec.tsx deleted file mode 100644 index d01188760c..0000000000 --- a/packages/circuit-ui/components/legacy/CalendarTag/CalendarTag.spec.tsx +++ /dev/null @@ -1,44 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { describe, expect, it, vi } from 'vitest'; - -import { axe, render } from '../../../util/test-utils.js'; - -import { CalendarTag } from './index.js'; - -describe('CalendarTag', () => { - const baseProps = { - onDatesRangeChange: vi.fn(), - onClick: vi.fn(), - }; - - /** - * Style tests. - */ - it('should render with default styles', () => { - const { container } = render(); - expect(container).toMatchSnapshot(); - }); - - /** - * Accessibility tests. - */ - it('should meet accessibility guidelines', async () => { - const { container } = render(); - const actual = await axe(container); - expect(actual).toHaveNoViolations(); - }); -}); diff --git a/packages/circuit-ui/components/legacy/CalendarTag/CalendarTag.stories.tsx b/packages/circuit-ui/components/legacy/CalendarTag/CalendarTag.stories.tsx deleted file mode 100644 index ec53013c77..0000000000 --- a/packages/circuit-ui/components/legacy/CalendarTag/CalendarTag.stories.tsx +++ /dev/null @@ -1,27 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { action } from '@storybook/addon-actions'; - -import { CalendarTag, type CalendarTagProps } from './CalendarTag.js'; - -export default { - title: 'Forms/Calendar/CalendarTag', - component: CalendarTag, -}; - -export const Base = (args: CalendarTagProps) => ( - -); diff --git a/packages/circuit-ui/components/legacy/CalendarTag/CalendarTag.tsx b/packages/circuit-ui/components/legacy/CalendarTag/CalendarTag.tsx deleted file mode 100644 index 0d08446a27..0000000000 --- a/packages/circuit-ui/components/legacy/CalendarTag/CalendarTag.tsx +++ /dev/null @@ -1,141 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -'use client'; - -import { Component, createRef } from 'react'; -import type { Moment } from 'moment'; - -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 { - /** - * Callback to receive the set of dates when the user selects them. - */ - onDatesRangeChange: (range: DateRange) => void; - /** - * Function that's called when the date tag is clicked. - */ - onClick?: (event: ClickEvent) => void; -} - -type CalendarTagState = DateRange & { - focusedInput: FocusedInput; -}; - -type CalendarDate = Moment | null; -type DateRange = { - startDate: CalendarDate; - endDate: CalendarDate; -}; -type FocusedInput = 'startDate' | 'endDate' | null; - -const CalendarWrap = styled.div` - margin-top: ${({ theme }) => theme.spacings.byte}; -`; - -function toDate(date: CalendarDate) { - return date ? date.format('MMM DD') : ''; -} - -/** - * @legacy - */ -export class CalendarTag extends Component { - state = { - startDate: null, - endDate: null, - focusedInput: null, - }; - - tagRef = createRef(); - - handleDatesChange = ({ - startDate, - endDate, - }: { - startDate: CalendarDate; - endDate: CalendarDate; - }) => { - this.setState({ startDate, endDate }); - - if (startDate && endDate) { - this.props.onDatesRangeChange({ startDate, endDate }); - } - }; - - handleFocusChange = (focusedInput: FocusedInput) => { - this.setState({ focusedInput }); - }; - - handleTagClick = (event: ClickEvent) => { - if (this.props.onClick) { - this.props.onClick(event); - } - this.setState(({ focusedInput }) => ({ - focusedInput: focusedInput !== null ? null : START_DATE, - })); - }; - - getDateRangePreview = () => { - const { startDate, endDate } = this.state; - - if (!startDate && !endDate) { - return 'Dates'; - } - - return `${toDate(startDate)} - ${toDate(endDate)}`; - }; - - handleOutsideClick = ({ target }: MouseEvent) => { - if ( - this.tagRef.current && - !this.tagRef.current.contains(target as HTMLElement) - ) { - this.handleFocusChange(null); - } - }; - - render() { - const { onDatesRangeChange, ...props } = this.props; - const { focusedInput, startDate, endDate } = this.state; - const isOpen = focusedInput !== null; - - return ( -
- - {this.getDateRangePreview()} - - {isOpen && ( - - - - )} -
- ); - } -} diff --git a/packages/circuit-ui/components/legacy/CalendarTag/__snapshots__/CalendarTag.spec.tsx.snap b/packages/circuit-ui/components/legacy/CalendarTag/__snapshots__/CalendarTag.spec.tsx.snap deleted file mode 100644 index eda3a1db3c..0000000000 --- a/packages/circuit-ui/components/legacy/CalendarTag/__snapshots__/CalendarTag.spec.tsx.snap +++ /dev/null @@ -1,18 +0,0 @@ -// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html - -exports[`CalendarTag > should render with default styles 1`] = ` -
-
-
- -
-
-
-`; diff --git a/packages/circuit-ui/components/legacy/CalendarTag/index.ts b/packages/circuit-ui/components/legacy/CalendarTag/index.ts deleted file mode 100644 index 592803a87a..0000000000 --- a/packages/circuit-ui/components/legacy/CalendarTag/index.ts +++ /dev/null @@ -1,18 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -export { CalendarTag } from './CalendarTag.js'; - -export type { CalendarTagProps } from './CalendarTag.js'; diff --git a/packages/circuit-ui/components/legacy/CalendarTagTwoStep/CalendarTagTwoStep.spec.tsx b/packages/circuit-ui/components/legacy/CalendarTagTwoStep/CalendarTagTwoStep.spec.tsx deleted file mode 100644 index 7c07f1a4c7..0000000000 --- a/packages/circuit-ui/components/legacy/CalendarTagTwoStep/CalendarTagTwoStep.spec.tsx +++ /dev/null @@ -1,44 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { describe, expect, it, vi } from 'vitest'; - -import { axe, render } from '../../../util/test-utils.js'; - -import { CalendarTagTwoStep } from './CalendarTagTwoStep.js'; - -describe('CalendarTagTwoStep', () => { - const baseProps = { - onDatesRangeChange: vi.fn(), - confirmButtonLabel: 'Confirm', - clearButtonLabel: 'Confirm', - }; - /** - * Style tests. - */ - it('should render with default styles', () => { - const { container } = render(); - expect(container).toMatchSnapshot(); - }); - - /** - * Accessibility tests. - */ - it('should meet accessibility guidelines', async () => { - const { container } = render(); - const actual = await axe(container); - expect(actual).toHaveNoViolations(); - }); -}); diff --git a/packages/circuit-ui/components/legacy/CalendarTagTwoStep/CalendarTagTwoStep.stories.tsx b/packages/circuit-ui/components/legacy/CalendarTagTwoStep/CalendarTagTwoStep.stories.tsx deleted file mode 100644 index 14e3467ae7..0000000000 --- a/packages/circuit-ui/components/legacy/CalendarTagTwoStep/CalendarTagTwoStep.stories.tsx +++ /dev/null @@ -1,38 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { action } from '@storybook/addon-actions'; - -import { - CalendarTagTwoStep, - type CalendarTagTwoStepProps, -} from './CalendarTagTwoStep.js'; - -export default { - title: 'Forms/Calendar/CalendarTagTwoStep', - component: CalendarTagTwoStep, -}; - -export const Base = (args: CalendarTagTwoStepProps) => ( - -); - -Base.args = { - clearButtonLabel: 'Clear', - confirmButtonLabel: 'Confirm', -}; diff --git a/packages/circuit-ui/components/legacy/CalendarTagTwoStep/CalendarTagTwoStep.tsx b/packages/circuit-ui/components/legacy/CalendarTagTwoStep/CalendarTagTwoStep.tsx deleted file mode 100644 index 6e67975660..0000000000 --- a/packages/circuit-ui/components/legacy/CalendarTagTwoStep/CalendarTagTwoStep.tsx +++ /dev/null @@ -1,198 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/** @jsxImportSource @emotion/react */ - -'use client'; - -import { Component, createRef } from 'react'; -import { css } from '@emotion/react'; -import type { Moment } from 'moment'; - -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 { ButtonGroup } from '../../ButtonGroup/index.js'; -import { END_DATE, START_DATE } from '../Calendar/constants.js'; - -export interface CalendarTagTwoStepProps { - /** - * Callback to receive the set of dates when the user selects them. - */ - onDatesRangeChange: (range: DateRange) => void; - /** - * Function that's called when the date tag is clicked. - */ - onClick?: (event: ClickEvent) => void; - /** - * Label for the clear action - */ - clearButtonLabel: string; - - /** - * Label for the confirm action - */ - confirmButtonLabel: string; -} - -type CalendarTagTwoStepState = DateRange & { - focusedInput: FocusedInput; -}; - -type CalendarDate = Moment | null; -type DateRange = { - startDate: CalendarDate; - endDate: CalendarDate; -}; -type FocusedInput = 'startDate' | 'endDate' | null; - -const buttonGroupStyles = () => css` - /* based on react dates */ - padding: 0 23px 18px 0; -`; - -const CalendarWrapper = styled.div` - margin-top: ${({ theme }) => theme.spacings.byte}; -`; - -function toDate(date: CalendarDate) { - return date ? date.format('MMM DD') : ''; -} - -/** - * @legacy - * - * Component composed from a and a that has - * two step process where the user has to click "Apply" to trigger onChange - */ -export class CalendarTagTwoStep extends Component< - CalendarTagTwoStepProps, - CalendarTagTwoStepState -> { - state = { - startDate: null, - endDate: null, - focusedInput: null, - }; - - tagRef = createRef(); - - handleDatesChange = ({ startDate, endDate }: DateRange) => { - this.setState({ startDate, endDate }); - - this.handleFocusChange(endDate ? START_DATE : END_DATE); - }; - - handleFocusChange = (focusedInput: FocusedInput) => - this.setState({ focusedInput }); - - handleClear = () => - this.setState({ startDate: null, endDate: null, focusedInput: null }); - - handleTagClick = (event: ClickEvent) => { - if (this.props.onClick) { - this.props.onClick(event); - } - this.setState(({ focusedInput }) => ({ - focusedInput: focusedInput !== null ? null : START_DATE, - })); - }; - - getDateRangePreview = () => { - const { startDate, endDate } = this.state; - - if (!startDate && !endDate) { - return 'Dates'; - } - - return `${toDate(startDate)} - ${toDate(endDate)}`; - }; - - handleOutsideClick = ({ target }: MouseEvent) => { - if ( - this.tagRef.current && - !this.tagRef.current.contains(target as HTMLElement) - ) { - this.handleFocusChange(null); - } - }; - - handleConfirm = () => { - const { startDate, endDate } = this.state; - - if (!startDate || !endDate) { - return; - } - - this.props.onDatesRangeChange({ startDate, endDate }); - this.handleFocusChange(null); - }; - - render() { - const { - clearButtonLabel, - confirmButtonLabel, - onDatesRangeChange, - ...props - } = this.props; - const { focusedInput, startDate, endDate } = this.state; - const isOpen = focusedInput !== null; - const isFilled = Boolean(startDate && endDate); - - return ( -
- - {this.getDateRangePreview()} - - {isOpen && ( - - {/* @ts-expect-error This worked before the component was converted to TypeScript */} - ( - - )} - /> - - )} -
- ); - } -} diff --git a/packages/circuit-ui/components/legacy/CalendarTagTwoStep/__snapshots__/CalendarTagTwoStep.spec.tsx.snap b/packages/circuit-ui/components/legacy/CalendarTagTwoStep/__snapshots__/CalendarTagTwoStep.spec.tsx.snap deleted file mode 100644 index f687f89625..0000000000 --- a/packages/circuit-ui/components/legacy/CalendarTagTwoStep/__snapshots__/CalendarTagTwoStep.spec.tsx.snap +++ /dev/null @@ -1,18 +0,0 @@ -// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html - -exports[`CalendarTagTwoStep > should render with default styles 1`] = ` -
-
-
- -
-
-
-`; diff --git a/packages/circuit-ui/components/legacy/CalendarTagTwoStep/index.ts b/packages/circuit-ui/components/legacy/CalendarTagTwoStep/index.ts deleted file mode 100644 index 4f944aa4da..0000000000 --- a/packages/circuit-ui/components/legacy/CalendarTagTwoStep/index.ts +++ /dev/null @@ -1,18 +0,0 @@ -/** - * Copyright 2019, SumUp Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -export { CalendarTagTwoStep } from './CalendarTagTwoStep.js'; - -export type { CalendarTagTwoStepProps } from './CalendarTagTwoStep.js'; diff --git a/packages/circuit-ui/legacy.ts b/packages/circuit-ui/legacy.ts index fdf8269bc4..5f8f033a62 100644 --- a/packages/circuit-ui/legacy.ts +++ b/packages/circuit-ui/legacy.ts @@ -22,21 +22,6 @@ export { Selector, type SelectorProps, } from './components/Selector/index.js'; -export { - RangePicker, - RangePickerController, - SingleDayPicker, - CalendarConstants, -} from './components/legacy/Calendar/index.js'; -export type { - RangePickerProps, - RangePickerControllerProps, - SingleDayPickerProps, -} from './components/legacy/Calendar/index.js'; -export { CalendarTag } from './components/legacy/CalendarTag/index.js'; -export type { CalendarTagProps } from './components/legacy/CalendarTag/index.js'; -export { CalendarTagTwoStep } from './components/legacy/CalendarTagTwoStep/index.js'; -export type { CalendarTagTwoStepProps } from './components/legacy/CalendarTagTwoStep/index.js'; // Layout export { Grid, Row, Col } from './components/legacy/Grid/index.js'; From edef8d710044c3b9c641798883dacd1658033c77 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Connor=20B=C3=A4r?= Date: Wed, 4 Sep 2024 16:23:23 +0200 Subject: [PATCH 2/4] Uninstall moment and react-dates --- package-lock.json | 543 ----------------------------- packages/circuit-ui/package.json | 7 - packages/circuit-ui/vite.config.ts | 7 +- 3 files changed, 1 insertion(+), 556 deletions(-) diff --git a/package-lock.json b/package-lock.json index e1c24c2ef0..dda7a613f1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11181,17 +11181,6 @@ "csstype": "^3.0.2" } }, - "node_modules/@types/react-dates": { - "version": "21.8.6", - "resolved": "https://registry.npmjs.org/@types/react-dates/-/react-dates-21.8.6.tgz", - "integrity": "sha512-fDF322SOXAxstapv0/oruiPx9kY4DiiaEHYAVvXdPfQhi/hdaONsA9dFw5JBNPAWz7Niuwk+UUhxPU98h70TjA==", - "dev": true, - "dependencies": { - "@types/react": "*", - "@types/react-outside-click-handler": "*", - "moment": "^2.26.0" - } - }, "node_modules/@types/react-dom": { "version": "18.3.0", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.0.tgz", @@ -11209,15 +11198,6 @@ "@types/react": "*" } }, - "node_modules/@types/react-outside-click-handler": { - "version": "1.3.1", - "resolved": "https://registry.npmjs.org/@types/react-outside-click-handler/-/react-outside-click-handler-1.3.1.tgz", - "integrity": "sha512-0BNan5zIIDyO5k9LFSG+60ZxQ/0wf+LTF9BJx3oOUdOaJlZk6RCe52jRB75mlvLLJx2YLa61+NidOwBfptWMKw==", - "dev": true, - "dependencies": { - "@types/react": "*" - } - }, "node_modules/@types/resolve": { "version": "1.20.6", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.20.6.tgz", @@ -13365,25 +13345,6 @@ "integrity": "sha512-hCOfMzbFx5IDutmWLAt6MZwOUjIfSM9G9FyVxytmE4Rs/5YDPWQrD/+IR1w+FweD9H2oOZEnv36TmkjhNURBVA==", "dev": true }, - "node_modules/airbnb-prop-types": { - "version": "2.15.0", - "resolved": "https://registry.yarnpkg.com/airbnb-prop-types/-/airbnb-prop-types-2.15.0.tgz", - "integrity": "sha1-UoeCAEOvHrRp9bCvDW9w2mxSqu8= sha512-jUh2/hfKsRjNFC4XONQrxo/n/3GG4Tn6Hl0WlFQN5PY9OMC9loSCoAYKnZsWaP8wEfd5xcrPloK0Zg6iS1xwVA==", - "dev": true, - "license": "MIT", - "dependencies": { - "array.prototype.find": "^2.1.0", - "function.prototype.name": "^1.1.1", - "has": "^1.0.3", - "is-regex": "^1.0.4", - "object-is": "^1.0.1", - "object.assign": "^4.1.0", - "object.entries": "^1.1.0", - "prop-types": "^15.7.2", - "prop-types-exact": "^1.2.0", - "react-is": "^16.9.0" - } - }, "node_modules/ajv": { "version": "6.12.6", "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz", @@ -13599,17 +13560,6 @@ "node": ">=8" } }, - "node_modules/array.prototype.find": { - "version": "2.1.0", - "resolved": "https://registry.yarnpkg.com/array.prototype.find/-/array.prototype.find-2.1.0.tgz", - "integrity": "sha1-Yw8ur3CjnmCKw1c+Rc+MzQ7emtc= sha512-Wn41+K1yuO5p7wRZDl7890c3xvv5UBrfVXTVIe28rSQb6LS0fZMDrQB6PAcxQFRFy6vJTLDc3A2+3CjQdzVKRg==", - "dev": true, - "license": "MIT", - "dependencies": { - "define-properties": "^1.1.3", - "es-abstract": "^1.13.0" - } - }, "node_modules/array.prototype.findlast": { "version": "1.2.5", "resolved": "https://registry.npmjs.org/array.prototype.findlast/-/array.prototype.findlast-1.2.5.tgz", @@ -15168,13 +15118,6 @@ "node": ">=8" } }, - "node_modules/brcast": { - "version": "2.0.2", - "resolved": "https://registry.yarnpkg.com/brcast/-/brcast-2.0.2.tgz", - "integrity": "sha1-LbFt5EFA5BjcN/qxC+7ANp543O8= sha512-Tfn5JSE7hrUlFcOoaLzVvkbgIemIorMIyoMr3TgvszWW7jFt2C9PdeMLtysYD9RU0MmU17b69+XJG1eRY2OBRg==", - "dev": true, - "license": "MIT" - }, "node_modules/browser-assert": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/browser-assert/-/browser-assert-1.2.1.tgz", @@ -16069,13 +16012,6 @@ "integrity": "sha512-ty/fTekppD2fIwRvnZAVdeOiGd1c7YXEixbgJTNzqcxJWKQnjJ/V1bNEEE6hygpM3WjwHFUVK6HTjWSzV4a8sQ==", "dev": true }, - "node_modules/consolidated-events": { - "version": "2.0.2", - "resolved": "https://registry.yarnpkg.com/consolidated-events/-/consolidated-events-2.0.2.tgz", - "integrity": "sha1-2o2PjCsjKDFBPZ4ZDcEWacefSpE= sha512-2/uRVMdRypf5z/TW/ncD/66l75P5hH2vM/GR8Jf8HLc2xnfJtmina6F6du8+v4Z2vTrMo7jC+W1tmEEuuELgkQ==", - "dev": true, - "license": "MIT" - }, "node_modules/content-disposition": { "version": "0.5.4", "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz", @@ -17076,16 +17012,6 @@ "node": ">=8" } }, - "node_modules/direction": { - "version": "1.0.4", - "resolved": "https://registry.yarnpkg.com/direction/-/direction-1.0.4.tgz", - "integrity": "sha1-K4b7aGln6YcIjK+LiQWTcNSDdEI= sha512-GYqKi1aH7PJXxdhTeZBFrg8vUBeKXi+cNprXsC1kpJcbcVnV9wBsrOu1cQEdG0WeQwlfHiy3XvnKfIrJ2R0NzQ==", - "dev": true, - "license": "MIT", - "bin": { - "direction": "cli.js" - } - }, "node_modules/dlv": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz", @@ -17102,16 +17028,6 @@ "node": ">=6.0.0" } }, - "node_modules/document.contains": { - "version": "1.0.1", - "resolved": "https://registry.yarnpkg.com/document.contains/-/document.contains-1.0.1.tgz", - "integrity": "sha1-oYM57I509Af6NHCbZfRWBbOKPh8= sha512-A1KqlZq1w605bwiiLqVZehWE9S9UYlUXPoduFWi64pNVNQ9vy6wwH/7BS+iEfSlF1YyZgcg5PZw5HqDi7FCrUw==", - "dev": true, - "license": "MIT", - "dependencies": { - "define-properties": "^1.1.3" - } - }, "node_modules/doiuse": { "version": "6.0.2", "resolved": "https://registry.npmjs.org/doiuse/-/doiuse-6.0.2.tgz", @@ -17431,17 +17347,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/enzyme-shallow-equal": { - "version": "1.0.1", - "resolved": "https://registry.yarnpkg.com/enzyme-shallow-equal/-/enzyme-shallow-equal-1.0.1.tgz", - "integrity": "sha1-ev4D2zgBybdt6EQGlAlkEqjZ1J4= sha512-hGA3i1so8OrYOZSM9whlkNmVHOicJpsjgTzC+wn2JMJXhq1oO4kA4bJ5MsfzSIcC71aLDKzJ6gZpIxrqt3QTAQ==", - "dev": true, - "license": "MIT", - "dependencies": { - "has": "^1.0.3", - "object-is": "^1.0.2" - } - }, "node_modules/err-code": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/err-code/-/err-code-2.0.3.tgz", @@ -19969,20 +19874,6 @@ "glob": "^7.1.6" } }, - "node_modules/global-cache": { - "version": "1.2.1", - "resolved": "https://registry.yarnpkg.com/global-cache/-/global-cache-1.2.1.tgz", - "integrity": "sha1-OcoCDT3Xs/CTTFK3U2P41TMSwW0= sha512-EOeUaup5DgWKlCMhA9YFqNRIlZwoxt731jCh47WBV9fQqHgXhr3Fa55hfgIUqilIcPsfdNKN7LHjrNY+Km40KA==", - "dev": true, - "license": "MIT", - "dependencies": { - "define-properties": "^1.1.2", - "is-symbol": "^1.0.1" - }, - "engines": { - "node": ">= 0.4" - } - }, "node_modules/global-modules": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-2.0.0.tgz", @@ -20159,19 +20050,6 @@ "node": ">=6" } }, - "node_modules/has": { - "version": "1.0.3", - "resolved": "https://registry.yarnpkg.com/has/-/has-1.0.3.tgz", - "integrity": "sha1-ci18v8H2qoJB8W3YFOAR4fQeh5Y= sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==", - "dev": true, - "license": "MIT", - "dependencies": { - "function-bind": "^1.1.1" - }, - "engines": { - "node": ">= 0.4.0" - } - }, "node_modules/has-ansi": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz", @@ -22252,13 +22130,6 @@ "node": ">=0.10.0" } }, - "node_modules/is-touch-device": { - "version": "1.0.1", - "resolved": "https://registry.yarnpkg.com/is-touch-device/-/is-touch-device-1.0.1.tgz", - "integrity": "sha1-mi/Vn2iempv2rpqGkkxLqAWkLqs= sha512-LAYzo9kMT1b2p19L/1ATGt2XcSilnzNlyvq6c0pbPRVisLbAPpLqr53tIJS00kvrTkj0HtR8U7+u8X0yR8lPSw==", - "dev": true, - "license": "MIT" - }, "node_modules/is-typed-array": { "version": "1.1.13", "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.13.tgz", @@ -31487,16 +31358,6 @@ "node": ">=0.10.0" } }, - "node_modules/moment": { - "version": "2.29.4", - "resolved": "https://registry.yarnpkg.com/moment/-/moment-2.29.4.tgz", - "integrity": "sha1-Pb4FKIn+fBsu2Wb8s6dzKJZO8Qg= sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w==", - "dev": true, - "license": "MIT", - "engines": { - "node": "*" - } - }, "node_modules/morgan": { "version": "1.10.0", "resolved": "https://registry.npmjs.org/morgan/-/morgan-1.10.0.tgz", @@ -33604,13 +33465,6 @@ "through2": "^2.0.3" } }, - "node_modules/performance-now": { - "version": "2.1.0", - "resolved": "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz", - "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=", - "dev": true, - "license": "MIT" - }, "node_modules/periscopic": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/periscopic/-/periscopic-3.1.0.tgz", @@ -34222,18 +34076,6 @@ "react-is": "^16.13.1" } }, - "node_modules/prop-types-exact": { - "version": "1.2.0", - "resolved": "https://registry.yarnpkg.com/prop-types-exact/-/prop-types-exact-1.2.0.tgz", - "integrity": "sha1-gl1r5GCUZjhII345JamMbpROmGk= sha512-K+Tk3Kd9V0odiXFP9fwDHUYRyvK3Nun3GVyPapSIs5OBkITAm15W0CPFD/YKTkMUAbc0b9CUwRQp2ybiBIq+eA==", - "dev": true, - "license": "MIT", - "dependencies": { - "has": "^1.0.3", - "object.assign": "^4.1.0", - "reflect.ownkeys": "^0.2.0" - } - }, "node_modules/property-information": { "version": "6.4.0", "resolved": "https://registry.npmjs.org/property-information/-/property-information-6.4.0.tgz", @@ -34376,16 +34218,6 @@ "node": ">=8" } }, - "node_modules/raf": { - "version": "3.4.1", - "resolved": "https://registry.yarnpkg.com/raf/-/raf-3.4.1.tgz", - "integrity": "sha1-B0LpmkplUvRF1z4+4DKK8P8e3jk= sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==", - "dev": true, - "license": "MIT", - "dependencies": { - "performance-now": "^2.1.0" - } - }, "node_modules/range-parser": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz", @@ -34429,30 +34261,6 @@ "react-dom": ">=16.8.0" } }, - "node_modules/react-dates": { - "version": "21.8.0", - "resolved": "https://registry.yarnpkg.com/react-dates/-/react-dates-21.8.0.tgz", - "integrity": "sha1-NVw8eiQ6fClWj+AKypYjHhcaXpQ= sha512-PPriGqi30CtzZmoHiGdhlA++YPYPYGCZrhydYmXXQ6RAvAsaONcPtYgXRTLozIOrsQ5mSo40+DiA5eOFHnZ6xw==", - "dev": true, - "license": "MIT", - "dependencies": { - "airbnb-prop-types": "^2.15.0", - "consolidated-events": "^1.1.1 || ^2.0.0", - "enzyme-shallow-equal": "^1.0.0", - "is-touch-device": "^1.0.1", - "lodash": "^4.1.1", - "object.assign": "^4.1.0", - "object.values": "^1.1.0", - "prop-types": "^15.7.2", - "raf": "^3.4.1", - "react-moment-proptypes": "^1.6.0", - "react-outside-click-handler": "^1.2.4", - "react-portal": "^4.2.0", - "react-with-direction": "^1.3.1", - "react-with-styles": "^4.1.0", - "react-with-styles-interface-css": "^6.0.0" - } - }, "node_modules/react-docgen": { "version": "7.0.1", "resolved": "https://registry.npmjs.org/react-docgen/-/react-docgen-7.0.1.tgz", @@ -34563,16 +34371,6 @@ "node": ">=8" } }, - "node_modules/react-moment-proptypes": { - "version": "1.7.0", - "resolved": "https://registry.yarnpkg.com/react-moment-proptypes/-/react-moment-proptypes-1.7.0.tgz", - "integrity": "sha1-iYgUeYQKdsE1dKhuO7IUxLpWTno= sha512-ZbOn/P4u469WEGAw5hgkS/E+g1YZqdves2BjYsLluJobzUZCtManhjHiZKjniBVT7MSHM6D/iKtRVzlXVv3ikA==", - "dev": true, - "license": "MIT", - "dependencies": { - "moment": ">=1.6.0" - } - }, "node_modules/react-number-format": { "version": "5.3.0", "resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-5.3.0.tgz", @@ -34585,30 +34383,6 @@ "react-dom": "^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0" } }, - "node_modules/react-outside-click-handler": { - "version": "1.3.0", - "resolved": "https://registry.yarnpkg.com/react-outside-click-handler/-/react-outside-click-handler-1.3.0.tgz", - "integrity": "sha1-ODHVQawFne7NOOxUI/gegK1g4RU= sha512-Te/7zFU0oHpAnctl//pP3hEAeobfeHMyygHB8MnjP6sX5OR8KHT1G3jmLsV3U9RnIYo+Yn+peJYWu+D5tUS8qQ==", - "dev": true, - "license": "MIT", - "dependencies": { - "airbnb-prop-types": "^2.15.0", - "consolidated-events": "^1.1.1 || ^2.0.0", - "document.contains": "^1.0.1", - "object.values": "^1.1.0", - "prop-types": "^15.7.2" - } - }, - "node_modules/react-portal": { - "version": "4.2.1", - "resolved": "https://registry.yarnpkg.com/react-portal/-/react-portal-4.2.1.tgz", - "integrity": "sha1-EsFZkjjAb7CKmADzBwvqKj94saY= sha512-fE9kOBagwmTXZ3YGRYb4gcMy+kSA+yLO0xnPankjRlfBv4uCpFXqKPfkpsGQQR15wkZ9EssnvTOl1yMzbkxhPQ==", - "dev": true, - "license": "MIT", - "dependencies": { - "prop-types": "^15.5.8" - } - }, "node_modules/react-refresh": { "version": "0.14.2", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz", @@ -34656,57 +34430,6 @@ "react": "^16.8.3 || ^17 || ^18" } }, - "node_modules/react-with-direction": { - "version": "1.3.1", - "resolved": "https://registry.yarnpkg.com/react-with-direction/-/react-with-direction-1.3.1.tgz", - "integrity": "sha1-n9QUVk8P/mlH5f8Xb2Ey3YP4uN8= sha512-aGcM21ZzhqeXFvDCfPj0rVNYuaVXfTz5D3Rbn0QMz/unZe+CCiLHthrjQWO7s6qdfXORgYFtmS7OVsRgSk5LXQ==", - "dev": true, - "license": "MIT", - "dependencies": { - "airbnb-prop-types": "^2.10.0", - "brcast": "^2.0.2", - "deepmerge": "^1.5.2", - "direction": "^1.0.2", - "hoist-non-react-statics": "^3.3.0", - "object.assign": "^4.1.0", - "object.values": "^1.0.4", - "prop-types": "^15.6.2" - } - }, - "node_modules/react-with-direction/node_modules/deepmerge": { - "version": "1.5.2", - "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-1.5.2.tgz", - "integrity": "sha512-95k0GDqvBjZavkuvzx/YqVLv/6YYa17fz6ILMSf7neqQITCPbnfEnQvEgMPNjH4kgobe7+WIL0yJEHku+H3qtQ==", - "dev": true, - "engines": { - "node": ">=0.10.0" - } - }, - "node_modules/react-with-styles": { - "version": "4.1.0", - "resolved": "https://registry.yarnpkg.com/react-with-styles/-/react-with-styles-4.1.0.tgz", - "integrity": "sha1-S/wtqpLdcgM/wZ/YYbkCJaaCpkA= sha512-zp05fyA6XFetqr07ox/a0bCFyEj//gUozI9cC1GW59zaGJ38STnxYvzotutgpzMyHOd7TFW9ZiZeBKjsYaS+RQ==", - "dev": true, - "license": "MIT", - "dependencies": { - "airbnb-prop-types": "^2.14.0", - "hoist-non-react-statics": "^3.2.1", - "object.assign": "^4.1.0", - "prop-types": "^15.7.2", - "react-with-direction": "^1.3.1" - } - }, - "node_modules/react-with-styles-interface-css": { - "version": "6.0.0", - "resolved": "https://registry.yarnpkg.com/react-with-styles-interface-css/-/react-with-styles-interface-css-6.0.0.tgz", - "integrity": "sha1-tT2n+oNZ1FLLk0z6zoc4rK73tf4= sha512-6khSG1Trf4L/uXOge/ZAlBnq2O2PEXlQEqAhCRbvzaQU4sksIkdwpCPEl6d+DtP3+IdhyffTWuHDO9lhe1iYvA==", - "dev": true, - "license": "MIT", - "dependencies": { - "array.prototype.flat": "^1.2.1", - "global-cache": "^1.2.1" - } - }, "node_modules/read": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/read/-/read-3.0.1.tgz", @@ -35082,13 +34805,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/reflect.ownkeys": { - "version": "0.2.0", - "resolved": "https://registry.yarnpkg.com/reflect.ownkeys/-/reflect.ownkeys-0.2.0.tgz", - "integrity": "sha1-dJrO7H8/34tj+SegSAnpDFwLNGA=", - "dev": true, - "license": "MIT" - }, "node_modules/regenerate": { "version": "1.4.2", "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz", @@ -42509,13 +42225,10 @@ "@types/jest-axe": "^3.5.9", "@types/node": "^18.19.39", "@types/react": "^18.3.3", - "@types/react-dates": "^21.8.6", "@types/react-dom": "^18.3.0", "@types/react-modal": "^3.16.3", "jest-axe": "^9.0.0", - "moment": "^2.29.4", "react": "^18.3.1", - "react-dates": "^21.8.0", "react-dom": "^18.3.1", "react-swipeable": "^7.0.1", "rollup-plugin-preserve-directives": "^0.4.0", @@ -42526,10 +42239,6 @@ "engines": { "node": ">=18" }, - "optionalDependencies": { - "moment": ">=2.30", - "react-dates": ">=21.8" - }, "peerDependencies": { "@emotion/is-prop-valid": "^1.2.1", "@emotion/react": "^11.11.0", @@ -49740,14 +49449,11 @@ "@types/jest-axe": "^3.5.9", "@types/node": "^18.19.39", "@types/react": "^18.3.3", - "@types/react-dates": "^21.8.6", "@types/react-dom": "^18.3.0", "@types/react-modal": "^3.16.3", "jest-axe": "^9.0.0", - "moment": "^2.29.4", "nanostores": "^0.10.3", "react": "^18.3.1", - "react-dates": "^21.8.0", "react-dom": "^18.3.1", "react-modal": "^3.16.1", "react-number-format": "5.3.0", @@ -50438,17 +50144,6 @@ "csstype": "^3.0.2" } }, - "@types/react-dates": { - "version": "21.8.6", - "resolved": "https://registry.npmjs.org/@types/react-dates/-/react-dates-21.8.6.tgz", - "integrity": "sha512-fDF322SOXAxstapv0/oruiPx9kY4DiiaEHYAVvXdPfQhi/hdaONsA9dFw5JBNPAWz7Niuwk+UUhxPU98h70TjA==", - "dev": true, - "requires": { - "@types/react": "*", - "@types/react-outside-click-handler": "*", - "moment": "^2.26.0" - } - }, "@types/react-dom": { "version": "18.3.0", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.0.tgz", @@ -50466,15 +50161,6 @@ "@types/react": "*" } }, - "@types/react-outside-click-handler": { - "version": "1.3.1", - "resolved": "https://registry.npmjs.org/@types/react-outside-click-handler/-/react-outside-click-handler-1.3.1.tgz", - "integrity": "sha512-0BNan5zIIDyO5k9LFSG+60ZxQ/0wf+LTF9BJx3oOUdOaJlZk6RCe52jRB75mlvLLJx2YLa61+NidOwBfptWMKw==", - "dev": true, - "requires": { - "@types/react": "*" - } - }, "@types/resolve": { "version": "1.20.6", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.20.6.tgz", @@ -51780,24 +51466,6 @@ "integrity": "sha512-hCOfMzbFx5IDutmWLAt6MZwOUjIfSM9G9FyVxytmE4Rs/5YDPWQrD/+IR1w+FweD9H2oOZEnv36TmkjhNURBVA==", "dev": true }, - "airbnb-prop-types": { - "version": "2.15.0", - "resolved": "https://registry.yarnpkg.com/airbnb-prop-types/-/airbnb-prop-types-2.15.0.tgz", - "integrity": "sha1-UoeCAEOvHrRp9bCvDW9w2mxSqu8= sha512-jUh2/hfKsRjNFC4XONQrxo/n/3GG4Tn6Hl0WlFQN5PY9OMC9loSCoAYKnZsWaP8wEfd5xcrPloK0Zg6iS1xwVA==", - "dev": true, - "requires": { - "array.prototype.find": "^2.1.0", - "function.prototype.name": "^1.1.1", - "has": "^1.0.3", - "is-regex": "^1.0.4", - "object-is": "^1.0.1", - "object.assign": "^4.1.0", - "object.entries": "^1.1.0", - "prop-types": "^15.7.2", - "prop-types-exact": "^1.2.0", - "react-is": "^16.9.0" - } - }, "ajv": { "version": "6.12.6", "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz", @@ -51952,16 +51620,6 @@ "resolved": "https://registry.yarnpkg.com/array-union/-/array-union-2.1.0.tgz", "integrity": "sha1-t5hCCtvrHego2ErNii4j0+/oXo0= sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==" }, - "array.prototype.find": { - "version": "2.1.0", - "resolved": "https://registry.yarnpkg.com/array.prototype.find/-/array.prototype.find-2.1.0.tgz", - "integrity": "sha1-Yw8ur3CjnmCKw1c+Rc+MzQ7emtc= sha512-Wn41+K1yuO5p7wRZDl7890c3xvv5UBrfVXTVIe28rSQb6LS0fZMDrQB6PAcxQFRFy6vJTLDc3A2+3CjQdzVKRg==", - "dev": true, - "requires": { - "define-properties": "^1.1.3", - "es-abstract": "^1.13.0" - } - }, "array.prototype.findlast": { "version": "1.2.5", "resolved": "https://registry.npmjs.org/array.prototype.findlast/-/array.prototype.findlast-1.2.5.tgz", @@ -52985,12 +52643,6 @@ "fill-range": "^7.1.1" } }, - "brcast": { - "version": "2.0.2", - "resolved": "https://registry.yarnpkg.com/brcast/-/brcast-2.0.2.tgz", - "integrity": "sha1-LbFt5EFA5BjcN/qxC+7ANp543O8= sha512-Tfn5JSE7hrUlFcOoaLzVvkbgIemIorMIyoMr3TgvszWW7jFt2C9PdeMLtysYD9RU0MmU17b69+XJG1eRY2OBRg==", - "dev": true - }, "browser-assert": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/browser-assert/-/browser-assert-1.2.1.tgz", @@ -53626,12 +53278,6 @@ "integrity": "sha512-ty/fTekppD2fIwRvnZAVdeOiGd1c7YXEixbgJTNzqcxJWKQnjJ/V1bNEEE6hygpM3WjwHFUVK6HTjWSzV4a8sQ==", "dev": true }, - "consolidated-events": { - "version": "2.0.2", - "resolved": "https://registry.yarnpkg.com/consolidated-events/-/consolidated-events-2.0.2.tgz", - "integrity": "sha1-2o2PjCsjKDFBPZ4ZDcEWacefSpE= sha512-2/uRVMdRypf5z/TW/ncD/66l75P5hH2vM/GR8Jf8HLc2xnfJtmina6F6du8+v4Z2vTrMo7jC+W1tmEEuuELgkQ==", - "dev": true - }, "content-disposition": { "version": "0.5.4", "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz", @@ -54385,12 +54031,6 @@ "path-type": "^4.0.0" } }, - "direction": { - "version": "1.0.4", - "resolved": "https://registry.yarnpkg.com/direction/-/direction-1.0.4.tgz", - "integrity": "sha1-K4b7aGln6YcIjK+LiQWTcNSDdEI= sha512-GYqKi1aH7PJXxdhTeZBFrg8vUBeKXi+cNprXsC1kpJcbcVnV9wBsrOu1cQEdG0WeQwlfHiy3XvnKfIrJ2R0NzQ==", - "dev": true - }, "dlv": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz", @@ -54404,15 +54044,6 @@ "esutils": "^2.0.2" } }, - "document.contains": { - "version": "1.0.1", - "resolved": "https://registry.yarnpkg.com/document.contains/-/document.contains-1.0.1.tgz", - "integrity": "sha1-oYM57I509Af6NHCbZfRWBbOKPh8= sha512-A1KqlZq1w605bwiiLqVZehWE9S9UYlUXPoduFWi64pNVNQ9vy6wwH/7BS+iEfSlF1YyZgcg5PZw5HqDi7FCrUw==", - "dev": true, - "requires": { - "define-properties": "^1.1.3" - } - }, "doiuse": { "version": "6.0.2", "resolved": "https://registry.npmjs.org/doiuse/-/doiuse-6.0.2.tgz", @@ -54661,16 +54292,6 @@ "integrity": "sha512-xUtoPkMggbz0MPyPiIWr1Kp4aeWJjDZ6SMvURhimjdZgsRuDplF5/s9hcgGhyXMhs+6vpnuoiZ2kFiu3FMnS8Q==", "dev": true }, - "enzyme-shallow-equal": { - "version": "1.0.1", - "resolved": "https://registry.yarnpkg.com/enzyme-shallow-equal/-/enzyme-shallow-equal-1.0.1.tgz", - "integrity": "sha1-ev4D2zgBybdt6EQGlAlkEqjZ1J4= sha512-hGA3i1so8OrYOZSM9whlkNmVHOicJpsjgTzC+wn2JMJXhq1oO4kA4bJ5MsfzSIcC71aLDKzJ6gZpIxrqt3QTAQ==", - "dev": true, - "requires": { - "has": "^1.0.3", - "object-is": "^1.0.2" - } - }, "err-code": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/err-code/-/err-code-2.0.3.tgz", @@ -56514,16 +56135,6 @@ "@types/glob": "^7.1.3" } }, - "global-cache": { - "version": "1.2.1", - "resolved": "https://registry.yarnpkg.com/global-cache/-/global-cache-1.2.1.tgz", - "integrity": "sha1-OcoCDT3Xs/CTTFK3U2P41TMSwW0= sha512-EOeUaup5DgWKlCMhA9YFqNRIlZwoxt731jCh47WBV9fQqHgXhr3Fa55hfgIUqilIcPsfdNKN7LHjrNY+Km40KA==", - "dev": true, - "requires": { - "define-properties": "^1.1.2", - "is-symbol": "^1.0.1" - } - }, "global-modules": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-2.0.0.tgz", @@ -56654,15 +56265,6 @@ "integrity": "sha512-VIZB+ibDhx7ObhAe7OVtoEbuP4h/MuOTHJ+J8h/eBXotJYl0fBgR72xDFCKgIh22OJZIOVNxBMWuhAr10r8HdA==", "dev": true }, - "has": { - "version": "1.0.3", - "resolved": "https://registry.yarnpkg.com/has/-/has-1.0.3.tgz", - "integrity": "sha1-ci18v8H2qoJB8W3YFOAR4fQeh5Y= sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==", - "dev": true, - "requires": { - "function-bind": "^1.1.1" - } - }, "has-ansi": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz", @@ -58152,12 +57754,6 @@ "text-extensions": "^1.0.0" } }, - "is-touch-device": { - "version": "1.0.1", - "resolved": "https://registry.yarnpkg.com/is-touch-device/-/is-touch-device-1.0.1.tgz", - "integrity": "sha1-mi/Vn2iempv2rpqGkkxLqAWkLqs= sha512-LAYzo9kMT1b2p19L/1ATGt2XcSilnzNlyvq6c0pbPRVisLbAPpLqr53tIJS00kvrTkj0HtR8U7+u8X0yR8lPSw==", - "dev": true - }, "is-typed-array": { "version": "1.1.13", "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.13.tgz", @@ -64182,12 +63778,6 @@ "integrity": "sha512-xV2bxeN6F7oYjZWTe/YPAy6MN2M+sL4u/Rlm2AHCIVGfo2p1yGmBHQ6vHehl4bRTZBdHu3TSkWdYgkwpYzAGSw==", "dev": true }, - "moment": { - "version": "2.29.4", - "resolved": "https://registry.yarnpkg.com/moment/-/moment-2.29.4.tgz", - "integrity": "sha1-Pb4FKIn+fBsu2Wb8s6dzKJZO8Qg= sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w==", - "dev": true - }, "morgan": { "version": "1.10.0", "resolved": "https://registry.npmjs.org/morgan/-/morgan-1.10.0.tgz", @@ -65733,12 +65323,6 @@ "through2": "^2.0.3" } }, - "performance-now": { - "version": "2.1.0", - "resolved": "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz", - "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=", - "dev": true - }, "periscopic": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/periscopic/-/periscopic-3.1.0.tgz", @@ -66158,17 +65742,6 @@ "react-is": "^16.13.1" } }, - "prop-types-exact": { - "version": "1.2.0", - "resolved": "https://registry.yarnpkg.com/prop-types-exact/-/prop-types-exact-1.2.0.tgz", - "integrity": "sha1-gl1r5GCUZjhII345JamMbpROmGk= sha512-K+Tk3Kd9V0odiXFP9fwDHUYRyvK3Nun3GVyPapSIs5OBkITAm15W0CPFD/YKTkMUAbc0b9CUwRQp2ybiBIq+eA==", - "dev": true, - "requires": { - "has": "^1.0.3", - "object.assign": "^4.1.0", - "reflect.ownkeys": "^0.2.0" - } - }, "property-information": { "version": "6.4.0", "resolved": "https://registry.npmjs.org/property-information/-/property-information-6.4.0.tgz", @@ -66283,15 +65856,6 @@ "integrity": "sha512-ARhCpm70fzdcvNQfPoy49IaanKkTlRWF2JMzqhcJbhSFRZv7nPTvZJdcY7301IPmvW+/p0RgIWnQDLJxifsQ7g==", "dev": true }, - "raf": { - "version": "3.4.1", - "resolved": "https://registry.yarnpkg.com/raf/-/raf-3.4.1.tgz", - "integrity": "sha1-B0LpmkplUvRF1z4+4DKK8P8e3jk= sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==", - "dev": true, - "requires": { - "performance-now": "^2.1.0" - } - }, "range-parser": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz", @@ -66323,29 +65887,6 @@ "dev": true, "requires": {} }, - "react-dates": { - "version": "21.8.0", - "resolved": "https://registry.yarnpkg.com/react-dates/-/react-dates-21.8.0.tgz", - "integrity": "sha1-NVw8eiQ6fClWj+AKypYjHhcaXpQ= sha512-PPriGqi30CtzZmoHiGdhlA++YPYPYGCZrhydYmXXQ6RAvAsaONcPtYgXRTLozIOrsQ5mSo40+DiA5eOFHnZ6xw==", - "dev": true, - "requires": { - "airbnb-prop-types": "^2.15.0", - "consolidated-events": "^1.1.1 || ^2.0.0", - "enzyme-shallow-equal": "^1.0.0", - "is-touch-device": "^1.0.1", - "lodash": "^4.1.1", - "object.assign": "^4.1.0", - "object.values": "^1.1.0", - "prop-types": "^15.7.2", - "raf": "^3.4.1", - "react-moment-proptypes": "^1.6.0", - "react-outside-click-handler": "^1.2.4", - "react-portal": "^4.2.0", - "react-with-direction": "^1.3.1", - "react-with-styles": "^4.1.0", - "react-with-styles-interface-css": "^6.0.0" - } - }, "react-docgen": { "version": "7.0.1", "resolved": "https://registry.npmjs.org/react-docgen/-/react-docgen-7.0.1.tgz", @@ -66437,15 +65978,6 @@ "warning": "^4.0.3" } }, - "react-moment-proptypes": { - "version": "1.7.0", - "resolved": "https://registry.yarnpkg.com/react-moment-proptypes/-/react-moment-proptypes-1.7.0.tgz", - "integrity": "sha1-iYgUeYQKdsE1dKhuO7IUxLpWTno= sha512-ZbOn/P4u469WEGAw5hgkS/E+g1YZqdves2BjYsLluJobzUZCtManhjHiZKjniBVT7MSHM6D/iKtRVzlXVv3ikA==", - "dev": true, - "requires": { - "moment": ">=1.6.0" - } - }, "react-number-format": { "version": "5.3.0", "resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-5.3.0.tgz", @@ -66454,28 +65986,6 @@ "prop-types": "^15.7.2" } }, - "react-outside-click-handler": { - "version": "1.3.0", - "resolved": "https://registry.yarnpkg.com/react-outside-click-handler/-/react-outside-click-handler-1.3.0.tgz", - "integrity": "sha1-ODHVQawFne7NOOxUI/gegK1g4RU= sha512-Te/7zFU0oHpAnctl//pP3hEAeobfeHMyygHB8MnjP6sX5OR8KHT1G3jmLsV3U9RnIYo+Yn+peJYWu+D5tUS8qQ==", - "dev": true, - "requires": { - "airbnb-prop-types": "^2.15.0", - "consolidated-events": "^1.1.1 || ^2.0.0", - "document.contains": "^1.0.1", - "object.values": "^1.1.0", - "prop-types": "^15.7.2" - } - }, - "react-portal": { - "version": "4.2.1", - "resolved": "https://registry.yarnpkg.com/react-portal/-/react-portal-4.2.1.tgz", - "integrity": "sha1-EsFZkjjAb7CKmADzBwvqKj94saY= sha512-fE9kOBagwmTXZ3YGRYb4gcMy+kSA+yLO0xnPankjRlfBv4uCpFXqKPfkpsGQQR15wkZ9EssnvTOl1yMzbkxhPQ==", - "dev": true, - "requires": { - "prop-types": "^15.5.8" - } - }, "react-refresh": { "version": "0.14.2", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz", @@ -66505,53 +66015,6 @@ "dev": true, "requires": {} }, - "react-with-direction": { - "version": "1.3.1", - "resolved": "https://registry.yarnpkg.com/react-with-direction/-/react-with-direction-1.3.1.tgz", - "integrity": "sha1-n9QUVk8P/mlH5f8Xb2Ey3YP4uN8= sha512-aGcM21ZzhqeXFvDCfPj0rVNYuaVXfTz5D3Rbn0QMz/unZe+CCiLHthrjQWO7s6qdfXORgYFtmS7OVsRgSk5LXQ==", - "dev": true, - "requires": { - "airbnb-prop-types": "^2.10.0", - "brcast": "^2.0.2", - "deepmerge": "^1.5.2", - "direction": "^1.0.2", - "hoist-non-react-statics": "^3.3.0", - "object.assign": "^4.1.0", - "object.values": "^1.0.4", - "prop-types": "^15.6.2" - }, - "dependencies": { - "deepmerge": { - "version": "1.5.2", - "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-1.5.2.tgz", - "integrity": "sha512-95k0GDqvBjZavkuvzx/YqVLv/6YYa17fz6ILMSf7neqQITCPbnfEnQvEgMPNjH4kgobe7+WIL0yJEHku+H3qtQ==", - "dev": true - } - } - }, - "react-with-styles": { - "version": "4.1.0", - "resolved": "https://registry.yarnpkg.com/react-with-styles/-/react-with-styles-4.1.0.tgz", - "integrity": "sha1-S/wtqpLdcgM/wZ/YYbkCJaaCpkA= sha512-zp05fyA6XFetqr07ox/a0bCFyEj//gUozI9cC1GW59zaGJ38STnxYvzotutgpzMyHOd7TFW9ZiZeBKjsYaS+RQ==", - "dev": true, - "requires": { - "airbnb-prop-types": "^2.14.0", - "hoist-non-react-statics": "^3.2.1", - "object.assign": "^4.1.0", - "prop-types": "^15.7.2", - "react-with-direction": "^1.3.1" - } - }, - "react-with-styles-interface-css": { - "version": "6.0.0", - "resolved": "https://registry.yarnpkg.com/react-with-styles-interface-css/-/react-with-styles-interface-css-6.0.0.tgz", - "integrity": "sha1-tT2n+oNZ1FLLk0z6zoc4rK73tf4= sha512-6khSG1Trf4L/uXOge/ZAlBnq2O2PEXlQEqAhCRbvzaQU4sksIkdwpCPEl6d+DtP3+IdhyffTWuHDO9lhe1iYvA==", - "dev": true, - "requires": { - "array.prototype.flat": "^1.2.1", - "global-cache": "^1.2.1" - } - }, "read": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/read/-/read-3.0.1.tgz", @@ -66845,12 +66308,6 @@ "which-builtin-type": "^1.1.3" } }, - "reflect.ownkeys": { - "version": "0.2.0", - "resolved": "https://registry.yarnpkg.com/reflect.ownkeys/-/reflect.ownkeys-0.2.0.tgz", - "integrity": "sha1-dJrO7H8/34tj+SegSAnpDFwLNGA=", - "dev": true - }, "regenerate": { "version": "1.4.2", "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz", diff --git a/packages/circuit-ui/package.json b/packages/circuit-ui/package.json index b1c4f9c430..80017f6d27 100644 --- a/packages/circuit-ui/package.json +++ b/packages/circuit-ui/package.json @@ -73,13 +73,10 @@ "@types/jest-axe": "^3.5.9", "@types/node": "^18.19.39", "@types/react": "^18.3.3", - "@types/react-dates": "^21.8.6", "@types/react-dom": "^18.3.0", "@types/react-modal": "^3.16.3", "jest-axe": "^9.0.0", - "moment": "^2.29.4", "react": "^18.3.1", - "react-dates": "^21.8.0", "react-dom": "^18.3.1", "react-swipeable": "^7.0.1", "rollup-plugin-preserve-directives": "^0.4.0", @@ -97,10 +94,6 @@ "react": ">=18.0.0 <19.0.0", "react-dom": ">=18.0.0 <19.0.0" }, - "optionalDependencies": { - "moment": ">=2.30", - "react-dates": ">=21.8" - }, "engines": { "node": ">=18" } diff --git a/packages/circuit-ui/vite.config.ts b/packages/circuit-ui/vite.config.ts index 1626192aaf..dfd4c9886a 100644 --- a/packages/circuit-ui/vite.config.ts +++ b/packages/circuit-ui/vite.config.ts @@ -19,11 +19,7 @@ import preserveDirectives from 'rollup-plugin-preserve-directives'; import { defineConfig, type UserConfig } from 'vitest/config'; -import { - dependencies, - peerDependencies, - optionalDependencies, -} from './package.json'; +import { dependencies, peerDependencies } from './package.json'; export const css: UserConfig['css'] = { modules: { @@ -96,7 +92,6 @@ export default defineConfig({ external: [ ...Object.keys(dependencies), ...Object.keys(peerDependencies), - ...Object.keys(optionalDependencies), // Subfolder imports 'react/jsx-runtime', '@emotion/react/jsx-runtime', From fd874dbef086b7ce4ecd15d3355db4d2efab2044 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Connor=20B=C3=A4r?= Date: Wed, 4 Sep 2024 16:28:51 +0200 Subject: [PATCH 3/4] Add changeset --- .changeset/large-adults-dance.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/large-adults-dance.md diff --git a/.changeset/large-adults-dance.md b/.changeset/large-adults-dance.md new file mode 100644 index 0000000000..173f2c673a --- /dev/null +++ b/.changeset/large-adults-dance.md @@ -0,0 +1,5 @@ +--- +"@sumup-oss/circuit-ui": major +--- + +Removed the legacy RangePicker, RangePickerController, SingleDayPicker, CalendarTag, and CalendarTagTwoStep components. Use the updated DateInput component instead. From 73543e1a4fb42377d5c24f5370e5abae86322031 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Connor=20B=C3=A4r?= Date: Wed, 4 Sep 2024 16:31:29 +0200 Subject: [PATCH 4/4] Remove obsolete reference to react-dates --- packages/circuit-ui/vite.config.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/circuit-ui/vite.config.ts b/packages/circuit-ui/vite.config.ts index dfd4c9886a..e1f91ace03 100644 --- a/packages/circuit-ui/vite.config.ts +++ b/packages/circuit-ui/vite.config.ts @@ -95,7 +95,6 @@ export default defineConfig({ // Subfolder imports 'react/jsx-runtime', '@emotion/react/jsx-runtime', - 'react-dates/initialize.js', ], }, },