2.3 KiB
| title | published | description | date | tags | eleventyNavigation | |||||
|---|---|---|---|---|---|---|---|---|---|---|
| Introducing Lion UI | false | Lion introduces the new package @lion/ui which is a collection of all lion UI components. | 2023-03-20 |
|
|
A new package
Lion introduces a new package @lion/ui which is a collection of UI components that can be used in your application.
It contains all the components/systems that used to be distributed via separate @lion/* packages.
This brings back around 40 packages to just 1.
Better dependency management
Since @lion/ui is now a single package, the dependencies of the individual components are now managed in a single
package.json file. This results in a single folder of dependencies for all components instead of a folder
for each component separately.
This means you will now have less dependencies that are easier to manage.
New entrypoints
All components are now imported from @lion/ui instead of @lion/* packages and therefore this is a breaking change.
Where before you would import from @lion/<package>, you will now import from @lion/ui/<package>.js.
For example:
- import { LionAccordion } from '@lion/accordion';
+ import { LionAccordion } from '@lion/ui/accordion.js';
Element registrations have changed as well. For example:
- import '@lion/accordion/define';
+ import '@lion/ui/define/lion-accordion.js';
All available entrypoints for the packages in Lion can now easily be found in the /packages/ui/exports folder which
makes the public API much more clear. This is now possible because Node.js supports the exports field in package.json
where these entrypoints are defined.
For example, @lion/ui/accordion.js maps to /packages/exports/accordion.js and @lion/ui/define/lion-accordion.js
maps to /packages/exports/define/lion-accordion.js.
Support for this exports field was added to TypeScript 4.7 so for that reason, @lion/ui only supports TypeScript
4.7+ with "moduleResolution": "Node16" or "moduleResolution": "NodeNext".
A new changelog
@lion/ui has a new single CHANGELOG.md in /packages/ui for the whole package. The older individual changelogs can be
found in the /packages/ui/_legacy-changelogs folder.