Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

✨ Charm Release (v3) #1774

Merged
merged 129 commits into from
Nov 25, 2024
Merged

✨ Charm Release (v3) #1774

merged 129 commits into from
Nov 25, 2024

Conversation

literat
Copy link
Collaborator

@literat literat commented Nov 25, 2024

✨ Charm Release Notes

📢 🚀 🎉 Ahoy, we have great news for you today: The third major release of the Spirit Design System has just rolled out! It is called ✨ Charm and it is packed with improvements and features we had tested during past minor versions.

General Changes

💅 We have refactored the design tokens structure to be able to accommodate more products and designs. In our migration guide you will find more about the changes.

🪄 Most of the breaking changes in the web-react package are covered with codemods! You can run automated scripts we have prepared for you to make the transition to this release even easier.

📜 For all changes, please, visit our migration guides.

News in Packages

📦 Web 3.0.0 @lmc-eu/spirit-web

Breaking Changes

  • New design tokens structure

Features

  • Stabilization of ProductLogo component
  • Stabilization of PartnerLogo component

📜 Please, see the migration guide to upgrade smoothly or check the full changelog for the complete list of changes.

📦 Web React 3.0.0 @lmc-eu/spirit-web-react

Breaking Changes

  • The Button/ButtonLink component have isSymmetrical prop instead of isSquare
  • Remove default elementType value for Heading component
  • Remove isUnderlined prop from Link component

Features

  • Prop hasSafeAreaDisabled changed to hasSafeArea in PartnerLogo component
  • Stabilization of ProductLogo component
  • Stabilization of PartnerLogo component
  • Add the option to allow visited state in Link
  • Add spacingX and spacingY to Flex
  • Introduce Plain Button

📜 Please, see the migration guide to upgrade smoothly, or check the full changelog for the complete list of changes.

📦 Web Twig 4.0.0 @lmc-eu/spirit-web-twig

Features

  • Introduce Plain Button

📜 Please, see the migration guide to upgrade smoothly, or check the full changelog for the complete list of changes.

📦 Design Tokens 3.0.0 @lmc-eu/spirit-design-tokens

Breaking Changes

  • token group action was removed
  • action/link moved to top level link
  • rest of action subgroup moved to component group
  • all state tokens have state prefix, eg default in emotion is state-default or hover is now state-hover
  • tokens - added form-field subgroup filled and filled it (hehe) with tokens that would differ if we introduced outlined version
  • we no longer have @global or @global-tokens, we moved back to @tokens where you can find everything
  • we no longer use token CSS variables directly in our SCSS, we use SCSS variables from @tokens file which are validated and compiled into the CSS variable
    themes classes no longer have spirit- prefix
  • we introduced token-prefix token which contains spirit- and can be used in components (fun fact, this token will be called css-variable-prefix before the final release)

Full changelog

What's Next 🔮

  • New components like Card, Navigation, Drawer, etc are on their way, and many more will come 🎉 .
  • We are starting with the deprecation of the web-twig package. From now it is in maintenance mode and no more features will be added. Only bug fixes. In the next major release, we will remove the package from our project.

🎯 You can see more of our quarterly targets outlook in Notion.

We'd Love to Hear Your Feedback

:slack: If you need help or want to report a bug or wrong behavior, please reach us in our Slack channel: #spirit-design-system-support_cs_en.

:github: Everything is available in our repository on GitHub.

Thank you for staying with us! ❤️

Fun fact: the next major version of the Spirit Design System will be called 🌈 Divine.

Additional context

Issue reference

crishpeen and others added 30 commits November 22, 2024 17:08
curdaj and others added 16 commits November 25, 2024 11:40
 - @almacareer/spirit-example-next-with-app-router@0.2.3-alpha.2
 - @almacareer/spirit-example-next-with-pages-router@0.2.3-alpha.2
 - @lmc-eu/spirit-web@3.0.0-alpha.3
 - @lmc-eu/spirit-web-react@3.0.0-alpha.3
  - @lmc-eu/spirit-design-tokens@3.0.0-alpha.2
  - @lmc-eu/spirit-web@3.0.0-alpha.4
  - @lmc-eu/spirit-web-react@3.0.0-alpha.4
- Wrap list with div and move class from list to div
- Reset css for this list

- Solves #DS-1255
- Multiple errors are now displayed in a list
- List of errors is now wrapped in a div
- `role="alert"`` is now dynamically added when list changes
 - @almacareer/spirit-example-next-with-app-router@0.2.3-alpha.3
 - @almacareer/spirit-example-next-with-pages-router@0.2.3-alpha.3
 - @lmc-eu/spirit-design-tokens@3.0.0-alpha.3
 - @lmc-eu/spirit-form-validations@2.0.8
 - @lmc-eu/spirit-web@3.0.0-alpha.5
 - @lmc-eu/spirit-web-react@3.0.0-alpha.5
 - @lmc-eu/spirit-web-twig@4.0.0-alpha.2
Copy link

netlify bot commented Nov 25, 2024

Deploy Preview for spirit-design-system-storybook ready!

Name Link
🔨 Latest commit 2c09d62
🔍 Latest deploy log https://app.netlify.com/sites/spirit-design-system-storybook/deploys/67445e07b930f60008ee8421
😎 Deploy Preview https://deploy-preview-1774--spirit-design-system-storybook.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@literat literat changed the title ✨ Charm Release ✨ Charm Release (v3) Nov 25, 2024
Copy link

netlify bot commented Nov 25, 2024

Deploy Preview for spirit-design-system ready!

Name Link
🔨 Latest commit 2c09d62
🔍 Latest deploy log https://app.netlify.com/sites/spirit-design-system/deploys/67445e072720160008e7a97c
😎 Deploy Preview https://deploy-preview-1774--spirit-design-system.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
1 paths audited
Performance: 96 (🟢 up 1 from production)
Accessibility: 91 (🔴 down 2 from production)
Best Practices: 100 (no change from production)
SEO: 91 (🟢 up 1 from production)
PWA: -
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify site configuration.

@crishpeen crishpeen added the run-visual-tests Runs visual regression testing on this PR label Nov 25, 2024
@literat literat marked this pull request as ready for review November 25, 2024 15:08
@literat literat merged commit 2c09d62 into main Nov 25, 2024
50 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
run-visual-tests Runs visual regression testing on this PR
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants