Migrating x dash components to v8

tl;dr x-dash components no longer bundle CSS; you should import the SCSS directly

1. your app must be using npm v7 or more recent

x-dash components now use peerDependencies to install Origami components. versions of npm before v7 do not automatically install peerDependencies of your app's dependencies, so if you're on an old version of npm, it won't install the Origami components that x-dash components need.

https://github.com/Financial-Times/next/wiki/npm-7-Migration-Guide

2. make sure your app CSS is importing x-dash components correctly

if your app is importing the bundled CSS for x-dash components, e.g.:

@import '@financial-times/x-gift-article/dist/GiftArticle.css';

you should instead import the source Sass directly:

@import '@financial-times/x-gift-article/src/GiftArticle.scss';

the Sass entry point for each component is listed in the styles field in its package.json. some tooling for compiling Sass, e.g. Webpack's css-loader, automatically resolves this, so if your tooling is configured correctly you should be able to do:

@import '@financial-times/x-gift-article';

idk tho

3. don't have been doing any shenanigans with x-dash CSS in your apps

i dunno, you tell me