Skip to content

Commit

Permalink
Merge pull request #933 from SwedbankPay/feature/SWED-2379-migrate_co…
Browse files Browse the repository at this point in the history 
…mponents_snippets_icons

SWED-2379 migrate components snippets icons
  • Loading branch information
@goldenraphti
goldenraphti authored Feb 12, 2024
2 parents 28aa610 + 666adb8 commit 9d2dfce
Show file tree
Hide file tree
Showing 214 changed files with 1,848 additions and 2,096 deletions.
12 changes: 10 additions & 2 deletions RELEASE_NOTES.md
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,25 @@
# Changelog

## \[10.10.1\] - 06.02.2024
## \[10.10.1\] - xx.02.2024

## Component changes

### Non breaking UI changes

- Icons migration step 2 (still non-breaking. But the migrations is decided and is happening, so move when you can. Silent support of Material-icons until next major version release).
- Toast icons are modified. Since Toast is created entirely via a script shipped in the package, nothing is requiring from devs consuming the package. But expect a change in the icon used by the Toast component.

### NON Breaking UI changes BUT CAN & SHOULD modify code when have time

- Tags
- the close icon is now a cross set via CSS only, no need to add an `<i>` element anymore
- Dialog
- the close icon is now a cross set via CSS only, no need to add an `<i>` element anymore

## Maintenance

- npm packages dependencies upgrades

## Design System website

- Migrated the icons used on the documentation website from Material-icons to a combination of Atlas and our own custom swepay-icons
- Migrate icons used on the DS documentation website from Material-icons to Atlas + Swepay-icon custom icons
Binary file modified ...accordion.e2e.spec.js-snapshots/SwedbankPay-accordions-Mobile-Chrome-darwin.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified ...accordion.e2e.spec.js-snapshots/SwedbankPay-accordions-Mobile-Safari-darwin.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified ...ordion/accordion.e2e.spec.js-snapshots/SwedbankPay-accordions-webkit-darwin.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
130 changes: 49 additions & 81 deletions src/App/ComponentsDocumentation/components/ActionList/__snapshots__/index.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -682,7 +682,7 @@ exports[`Components: ActionList renders 1`] = `
<i
aria-hidden="true"
className="at-exclamation-triangle"
className="swepay-icon-error-triangle-filled"
/>
<p>
<b>
Expand Down Expand Up @@ -752,10 +752,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
bookmark
</i>
className="at-bookmark-star small"
/>
Add bookmark
</a>
Expand All @@ -766,10 +764,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
business_center
</i>
className="at-business-suitcase small"
/>
Add client
</a>
Expand All @@ -780,10 +776,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
add_circle
</i>
className="at-plus-circle small"
/>
Add document
</a>
Expand All @@ -794,10 +788,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
person_add
</i>
className="at-user-plus small"
/>
Add user
</a>
Expand Down Expand Up @@ -893,16 +885,16 @@ exports[`Components: ActionList renders 1`] = `
&lt;div class="action-menu" aria-labelledby="actionListToggle"&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;bookmark&lt;/i&gt;Add bookmark&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-bookmark-star small" aria-hidden="true"&gt;&lt;/i&gt;Add bookmark&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;business_center&lt;/i&gt;Add client&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-business-suitcase small" aria-hidden="true"&gt;&lt;/i&gt;Add client&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;add_circle&lt;/i&gt;Add document&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-plus-circle small" aria-hidden="true"&gt;&lt;/i&gt;Add document&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;person_add&lt;/i&gt;Add user&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-user-plus small" aria-hidden="true"&gt;&lt;/i&gt;Add user&lt;/a&gt;
&lt;/div&gt;
Expand Down Expand Up @@ -976,10 +968,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
bookmark
</i>
className="at-bookmark-star small"
/>
Add bookmark
</a>
Expand All @@ -990,10 +980,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
business_center
</i>
className="at-business-suitcase small"
/>
Add client
</a>
Expand All @@ -1004,10 +992,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
add_circle
</i>
className="at-plus-circle small"
/>
Add document
</a>
Expand All @@ -1018,10 +1004,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
person_add
</i>
className="at-user-plus small"
/>
Add user
</a>
Expand Down Expand Up @@ -1117,16 +1101,16 @@ exports[`Components: ActionList renders 1`] = `
&lt;div class="action-menu" aria-labelledby="actionListToggle"&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;bookmark&lt;/i&gt;Add bookmark&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-bookmark-star small" aria-hidden="true"&gt;&lt;/i&gt;Add bookmark&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;business_center&lt;/i&gt;Add client&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-business-suitcase small" aria-hidden="true"&gt;&lt;/i&gt;Add client&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;add_circle&lt;/i&gt;Add document&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-plus-circle small" aria-hidden="true"&gt;&lt;/i&gt;Add document&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;person_add&lt;/i&gt;Add user&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-user-plus small" aria-hidden="true"&gt;&lt;/i&gt;Add user&lt;/a&gt;
&lt;/div&gt;
Expand Down Expand Up @@ -1192,10 +1176,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
bookmark
</i>
className="at-bookmark-star small"
/>
Add bookmark
</a>
Expand All @@ -1206,10 +1188,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
business_center
</i>
className="at-business-suitcase small"
/>
Add client
</a>
Expand All @@ -1220,10 +1200,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
add_circle
</i>
className="at-plus-circle small"
/>
Add document
</a>
Expand All @@ -1234,10 +1212,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
person_add
</i>
className="at-user-plus small"
/>
Add user
</a>
Expand Down Expand Up @@ -1333,16 +1309,16 @@ exports[`Components: ActionList renders 1`] = `
&lt;div class="action-menu" aria-labelledby="actionListToggle"&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;bookmark&lt;/i&gt;Add bookmark&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-bookmark-star small" aria-hidden="true"&gt;&lt;/i&gt;Add bookmark&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;business_center&lt;/i&gt;Add client&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-business-suitcase small" aria-hidden="true"&gt;&lt;/i&gt;Add client&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;add_circle&lt;/i&gt;Add document&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-plus-circle small" aria-hidden="true"&gt;&lt;/i&gt;Add document&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;person_add&lt;/i&gt;Add user&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-user-plus small" aria-hidden="true"&gt;&lt;/i&gt;Add user&lt;/a&gt;
&lt;/div&gt;
Expand Down Expand Up @@ -1408,10 +1384,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
bookmark
</i>
className="at-bookmark-star small"
/>
Add bookmark
</a>
Expand All @@ -1422,10 +1396,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
business_center
</i>
className="at-business-suitcase small"
/>
Add client
</a>
Expand All @@ -1436,10 +1408,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
add_circle
</i>
className="at-plus-circle small"
/>
Add document
</a>
Expand All @@ -1450,10 +1420,8 @@ exports[`Components: ActionList renders 1`] = `
>
<i
aria-hidden="true"
className="material-icons"
>
person_add
</i>
className="at-user-plus small"
/>
Add user
</a>
Expand Down Expand Up @@ -1549,16 +1517,16 @@ exports[`Components: ActionList renders 1`] = `
&lt;div class="action-menu" aria-labelledby="actionListToggle"&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;bookmark&lt;/i&gt;Add bookmark&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-bookmark-star small" aria-hidden="true"&gt;&lt;/i&gt;Add bookmark&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;business_center&lt;/i&gt;Add client&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-business-suitcase small" aria-hidden="true"&gt;&lt;/i&gt;Add client&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;add_circle&lt;/i&gt;Add document&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-plus-circle small" aria-hidden="true"&gt;&lt;/i&gt;Add document&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="material-icons" aria-hidden="true"&gt;person_add&lt;/i&gt;Add user&lt;/a&gt;
&lt;a href="#"&gt;&lt;i class="at-user-plus small" aria-hidden="true"&gt;&lt;/i&gt;Add user&lt;/a&gt;
&lt;/div&gt;
Expand Down
10 changes: 5 additions & 5 deletions src/App/ComponentsDocumentation/components/ActionList/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,19 +11,19 @@ import NpmInformation from "@docutils/NpmInformation";
const items = [
{
name: "Add bookmark",
icon: "bookmark",
icon: "at-bookmark-star",
},
{
name: "Add client",
icon: "business_center",
icon: "at-business-suitcase",
},
{
name: "Add document",
icon: "add_circle",
icon: "at-plus-circle",
},
{
name: "Add user",
icon: "person_add",
icon: "at-user-plus",
},
];

Expand Down Expand Up @@ -87,7 +87,7 @@ const ActionList = () => {
<DocContainer>
<Alert
type="danger"
icon="exclamation-triangle"
icon="swepay-icon-error-triangle-filled"
text={
<p>
<b>Deprecated:</b> Be aware, this component will not be maintained
Expand Down
2 changes: 1 addition & 1 deletion src/App/ComponentsDocumentation/components/Alerts/__snapshots__/index.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ exports[`Documentation: Alerts Content guidelines renders 1`] = `
<i
aria-hidden="true"
className="at-info-circle"
className="swepay-icon-info-circle-filled"
/>
<p>
<b>
Expand Down
Loading

0 comments on commit 9d2dfce

Please sign in to comment.