d2de984f0b
* feat(input-file): create input-file component
* chore: improvements after review
* chore: update after review
* chore: update translations
* chore: - fixed demo with form submit, submit was not prevented
- fixed checking allowed file extensions
- fixed clicking on select file button in drag and drop area
* chore: since the input-file does not upload files itself but enables user to select files, I replaced "upload" and "upload" with "select" and "selected" where applicable
* chore: - removed unused properties allowedFileTypes and allowedFileExtensions from lion-input-file
- cleaned up docs
* chore: - changed type Array.<type> to Array<type>
- removed redundant type definition
* fix: - FocusMixin: moved registering events for from connectedCallback to firstUpdated since _focusableNode is sometimes not available yet
- SlotMixin: changed updated to update in since slots were rendered too late (related to previous fix in FocusMixin.js)
* fix: renamed lion-uploaded-file-list.js to lion-selected-file-list.js
* fix: fixed test for lion-selected-file-list
* fix: fixed typ
* wip
* fix: - fixed issue with multiple file selection where element would not select valid files after invalid ones
- added getMessage method to FileValidation that returns empty string to prevent message being shown that error message must be configured
- fixed tests
* chore: replaced `uploadOnFormSubmit` with `uploadOnSelect` and flipped the default value to false. When `uploadOnSelect` is set to true, the file will be uploaded as soon as it is selected.
* fix: - replaced `uploadOnFormSubmit` with `uploadOnSelect` and flipped the default value to false. When `uploadOnSelect` is set to true, the file will be uploaded as soon as it is selected.
- fixed issue where a valid file was not selected and added to the file list if it was preceded by an invalid file
* chore: removed redundant README.md
* fix: fixed failing test
* chore: added missing type annotation
* chore: annotated event param as optional
---------
Co-authored-by: Danny Moerkerke <danny.moerkerke@ing.com>
Co-authored-by: Thijs Louisse <Thijs.Louisse@ing.com>
55 lines
2.2 KiB
Markdown
55 lines
2.2 KiB
Markdown
---
|
|
title: Introducing Lion UI
|
|
published: false
|
|
description: Lion introduces the new package @lion/ui which is a collection of all lion UI components.
|
|
date: 2023-03-20
|
|
tags: [javascript]
|
|
---
|
|
|
|
### 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:
|
|
|
|
```diff
|
|
- import { LionAccordion } from '@lion/accordion';
|
|
+ import { LionAccordion } from '@lion/ui/accordion.js';
|
|
```
|
|
|
|
Element registrations have changed as well. For example:
|
|
|
|
```diff
|
|
- 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](https://github.com/ing-bank/lion/blob/master/packages/ui/CHANGELOG.md) in `/packages/ui` for the whole package. The older individual changelogs can be
|
|
found in the `/packages/ui/_legacy-changelogs` folder.
|