Skip to content

Commit

Permalink
Upgrade to Foundry v6 (#2022)
Browse files Browse the repository at this point in the history
  • Loading branch information
@connor-baer
connor-baer authored Apr 17, 2023
1 parent 4fef0c7 commit f204756
Show file tree
Hide file tree
Showing 40 changed files with 3,348 additions and 6,977 deletions.
1 change: 1 addition & 0 deletions .eslintrc.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ module.exports = require('@sumup/foundry/eslint')({
plugins: ['@sumup/circuit-ui'],
rules: {
'@sumup/circuit-ui/no-invalid-custom-properties': 'error',
'react/no-unknown-property': ['error', { ignore: ['css'] }],
},
parserOptions: {
project: ['./packages/*/tsconfig.json', './tsconfig.eslint.json'],
Expand Down
7,866 changes: 2,093 additions & 5,773 deletions package-lock.json
View file

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
"build": "lerna run build",
"clean": "lerna run clean",
"test": "jest --watch",
"test:ci": "mkdir -p __reports__ && jest --json --outputFile=__reports__/jest-results.json --ci --coverage --runInBand",
"test:ci": "mkdir -p __reports__ && jest --json --outputFile=__reports__/jest-results.json --ci --coverage --runInBand --reporters default --reporters \"github-actions\"",
"lint": "foundry run eslint . --ext .js,.jsx,.ts,.tsx",
"lint:fix": "npm run lint -- --fix",
"docs": "npm run docs:start",
Expand Down Expand Up @@ -58,7 +58,7 @@
"@storybook/testing-library": "^0.1.0",
"@storybook/theming": "^7.0.5",
"@sumup/eslint-plugin-circuit-ui": "^0.0.1",
"@sumup/foundry": "^5.1.0",
"@sumup/foundry": "^6.0.0",
"@types/jest": "^29.5.0",
"@types/node": "^18.15.11",
"audit-ci": "^6.6.1",
Expand Down
14 changes: 8 additions & 6 deletions packages/circuit-ui/components/AspectRatio/AspectRatio.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,29 +13,31 @@
* limitations under the License.
*/

import { render } from '../../util/test-utils';

import AspectRatio from './AspectRatio';

describe('AspectRatio', () => {
it('should render with default styles', () => {
const actual = create(
const { container } = render(
<AspectRatio>
<div />
</AspectRatio>,
);
expect(actual).toMatchSnapshot();
expect(container).toMatchSnapshot();
});

it('should render with fixed aspect ratio styles', () => {
const actual = create(
const { container } = render(
<AspectRatio aspectRatio={1.618}>
<div />
</AspectRatio>,
);
expect(actual).toMatchSnapshot();
expect(container).toMatchSnapshot();
});

it('should not render without children', () => {
const actual = create(<AspectRatio spectRatio={1.618} />);
expect(actual).toBeNull();
const { container } = render(<AspectRatio aspectRatio={1.618} />);
expect(container.firstChild).toBeNull();
});
});
24 changes: 14 additions & 10 deletions packages/circuit-ui/components/AspectRatio/__snapshots__/AspectRatio.spec.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,12 +16,14 @@ exports[`AspectRatio should render with default styles 1`] = `
width: 100%;
}
<div
class="circuit-0 circuit-1"
>
<div>
<div
class="circuit-2"
/>
class="circuit-0 circuit-1"
>
<div
class="circuit-2"
/>
</div>
</div>
`;

Expand Down Expand Up @@ -54,11 +56,13 @@ exports[`AspectRatio should render with fixed aspect ratio styles 1`] = `
z-index: 2;
}
<div
class="circuit-0 circuit-1"
>
<div>
<div
class="circuit-2"
/>
class="circuit-0 circuit-1"
>
<div
class="circuit-2"
/>
</div>
</div>
`;
6 changes: 4 additions & 2 deletions packages/circuit-ui/components/Calendar/RangePicker.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,14 +13,16 @@
* limitations under the License.
*/

import { render } from '../../util/test-utils';

import { RangePicker } from '.';

describe('RangePicker', () => {
/**
* Style tests.
*/
it('should render with default styles', () => {
const actual = create(<RangePicker />);
expect(actual).toMatchSnapshot();
const { container } = render(<RangePicker />);
expect(container).toMatchSnapshot();
});
});
8 changes: 5 additions & 3 deletions packages/circuit-ui/components/Calendar/SingleDayPicker.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,16 +13,18 @@
* limitations under the License.
*/

import { render } from '../../util/test-utils';

import { SingleDayPicker } from '.';

const props = { onDateChange: () => {}, onFocusChange: () => {} };
const props = { onDateChange: jest.fn(), onFocusChange: jest.fn() };

describe('SingleDayPicker', () => {
/**
* Style tests.
*/
it('should render with default styles', () => {
const actual = create(<SingleDayPicker {...props} />);
expect(actual).toMatchSnapshot();
const { container } = render(<SingleDayPicker {...props} />);
expect(container).toMatchSnapshot();
});
});
126 changes: 64 additions & 62 deletions packages/circuit-ui/components/Calendar/__snapshots__/RangePicker.spec.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,73 +6,75 @@ exports[`RangePicker should render with default styles 1`] = `
}
<div>
<div
class="DateRangePicker DateRangePicker_1"
>
<div>
<div
class="DateRangePickerInput DateRangePickerInput_1 DateRangePickerInput__withBorder DateRangePickerInput__withBorder_2"
>
<div>
<div
class="DateRangePicker DateRangePicker_1"
>
<div>
<div
class="DateInput DateInput_1"
class="DateRangePickerInput DateRangePickerInput_1 DateRangePickerInput__withBorder DateRangePickerInput__withBorder_2"
>
<input
aria-describedby="DateInput__screen-reader-message-startDate"
aria-label="Start Date"
autocomplete="off"
class="DateInput_input DateInput_input_1"
id="startDate"
name="startDate"
placeholder="Start Date"
type="text"
value=""
/>
<p
class="DateInput_screenReaderMessage DateInput_screenReaderMessage_1"
id="DateInput__screen-reader-message-startDate"
<div
class="DateInput DateInput_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.
</p>
</div>
<div
aria-hidden="true"
class="DateRangePickerInput_arrow DateRangePickerInput_arrow_1"
role="presentation"
>
<svg
class="circuit-0 circuit-1"
fill="none"
height="24"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M23 12c0 .265-.104.52-.29.71l-9 9c-.19.186-.445.29-.71.29a1 1 0 0 1-1-1c0-.265.104-.52.29-.71l7.3-7.29H2a1 1 0 0 1 0-2h17.59l-7.3-7.29A1.013 1.013 0 0 1 12 3a1 1 0 0 1 1-1c.265 0 .52.104.71.29l9 9c.186.19.29.445.29.71z"
fill="currentColor"
<input
aria-describedby="DateInput__screen-reader-message-startDate"
aria-label="Start Date"
autocomplete="off"
class="DateInput_input DateInput_input_1"
id="startDate"
name="startDate"
placeholder="Start Date"
type="text"
value=""
/>
</svg>
</div>
<div
class="DateInput DateInput_1"
>
<input
aria-describedby="DateInput__screen-reader-message-endDate"
aria-label="End Date"
autocomplete="off"
class="DateInput_input DateInput_input_1"
id="endDate"
name="endDate"
placeholder="End Date"
type="text"
value=""
/>
<p
class="DateInput_screenReaderMessage DateInput_screenReaderMessage_1"
id="DateInput__screen-reader-message-endDate"
<p
class="DateInput_screenReaderMessage DateInput_screenReaderMessage_1"
id="DateInput__screen-reader-message-startDate"
>
Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates.
</p>
</div>
<div
aria-hidden="true"
class="DateRangePickerInput_arrow DateRangePickerInput_arrow_1"
role="presentation"
>
Navigate backward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates.
</p>
<svg
class="circuit-0 circuit-1"
fill="none"
height="24"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M23 12c0 .265-.104.52-.29.71l-9 9c-.19.186-.445.29-.71.29a1 1 0 0 1-1-1c0-.265.104-.52.29-.71l7.3-7.29H2a1 1 0 0 1 0-2h17.59l-7.3-7.29A1.013 1.013 0 0 1 12 3a1 1 0 0 1 1-1c.265 0 .52.104.71.29l9 9c.186.19.29.445.29.71z"
fill="currentColor"
/>
</svg>
</div>
<div
class="DateInput DateInput_1"
>
<input
aria-describedby="DateInput__screen-reader-message-endDate"
aria-label="End Date"
autocomplete="off"
class="DateInput_input DateInput_input_1"
id="endDate"
name="endDate"
placeholder="End Date"
type="text"
value=""
/>
<p
class="DateInput_screenReaderMessage DateInput_screenReaderMessage_1"
id="DateInput__screen-reader-message-endDate"
>
Navigate backward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates.
</p>
</div>
</div>
</div>
</div>
Expand Down
50 changes: 26 additions & 24 deletions packages/circuit-ui/components/Calendar/__snapshots__/SingleDayPicker.spec.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,33 +2,35 @@

exports[`SingleDayPicker should render with default styles 1`] = `
<div>
<div
class="SingleDatePicker SingleDatePicker_1"
>
<div>
<div
class="SingleDatePickerInput SingleDatePickerInput_1 SingleDatePickerInput__withBorder SingleDatePickerInput__withBorder_2"
>
<div>
<div
class="SingleDatePicker SingleDatePicker_1"
>
<div>
<div
class="DateInput DateInput_1"
class="SingleDatePickerInput SingleDatePickerInput_1 SingleDatePickerInput__withBorder SingleDatePickerInput__withBorder_2"
>
<input
aria-describedby="DateInput__screen-reader-message-date"
aria-label="Date"
autocomplete="off"
class="DateInput_input DateInput_input_1"
id="date"
name="date"
placeholder="Date"
type="text"
value=""
/>
<p
class="DateInput_screenReaderMessage DateInput_screenReaderMessage_1"
id="DateInput__screen-reader-message-date"
<div
class="DateInput DateInput_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.
</p>
<input
aria-describedby="DateInput__screen-reader-message-date"
aria-label="Date"
autocomplete="off"
class="DateInput_input DateInput_input_1"
id="date"
name="date"
placeholder="Date"
type="text"
value=""
/>
<p
class="DateInput_screenReaderMessage DateInput_screenReaderMessage_1"
id="DateInput__screen-reader-message-date"
>
Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates.
</p>
</div>
</div>
</div>
</div>
Expand Down
0 ...CalendarWrapper/CalendarImportedStyles.js → ...CalendarWrapper/CalendarImportedStyles.ts
View file
File renamed without changes.
9 changes: 6 additions & 3 deletions packages/circuit-ui/components/Calendar/components/CalendarWrapper/CalendarWrapper.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,14 @@
* limitations under the License.
*/

import { render } from '../../../../util/test-utils';

import CalendarWrapper from '.';

describe('CalendarWrapper', () => {
it('should render with default styles', () => {
const actual = create(<CalendarWrapper />);
expect(actual).toMatchSnapshot();
it('should render its children', () => {
const children = 'children';
const { getByText } = render(<CalendarWrapper>{children}</CalendarWrapper>);
expect(getByText(children)).toBeVisible();
});
});
Loading

1 comment on commit f204756

@vercel
Copy link

@vercel vercel bot commented on f204756 Apr 17, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

oss-circuit-ui – ./

circuit-ui.vercel.app
oss-circuit-ui.sumup-vercel.app
circuit.sumup.com
oss-circuit-ui-git-main.sumup-vercel.app

Please sign in to comment.