@engie-group/fluid-design-system-angular/CHANGELOG.md

Fluid Design System Angular

# Changelog

All notable changes to Fluid Design System Angular will be documented in this file.

The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).

## 📦 2.12.7 - 2025-07-11

### 🐛 Fixed

###### [PAGINATION]

- Current item is not interactive anymore. It was not intended to be interactive.

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-system@5.18.1

## 📦 2.12.6 - 2025-06-23

### 🐛 Fixed

###### [ICON]

- Fix icon size `2xl` not working properly

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-system@5.18.0

## 📦 2.12.5 - 2025-04-07

### 🐛 Fixed

###### [SKELETON]

- Fix styles used in skeleton component after token update

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-system@5.17.2
  - @engie-group/fluid-design-tokens@5.12.0

## 📦 2.12.4 - 2025-02-12

### 🐛 Fixed

###### [SEGMENTED-CONTROL]

- Animation has been removed to be aligned with design directions

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-tokens@5.11.0
  - @engie-group/fluid-design-system@5.17.1

## 📦 2.12.3 - 2024-12-06

### 🐛 Fixed

###### [SEARCH]

- Add background color to search input

###### [SELECT]

- Fix select options focus not working properly on webkit browsers (Safari).

### 🛠️ Maintained

- Remove engine property from package.json file which was causing install warning.
- Updated dependencies
  - @engie-group/fluid-design-tokens@5.10.0
  - @engie-group/fluid-design-system@5.17.0

## 📦 2.12.2 - 2024-10-07

### 🐛 Fixed

###### [ALERT & TAG]

- Update font size with the new font size tokens

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-system@5.16.2

## 📦 2.12.1 - 2024-10-03

### 🚀 Added

###### [GLOBAL]

- Update font family to `Roboto Mono` for monospace. Please import this font in your project

  ```diff
  - href="https://fonts.googleapis.com/css?family=Material+Icons|Lato:300,400,700,900&display=swap"
  + href="https://fonts.googleapis.com/css?family=Material+Icons|Lato:300,400,700,900|Roboto+Mono:300,400,700,900&display=swap"
  ```

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-tokens@5.9.0
  - @engie-group/fluid-design-system@5.16.1

## 📦 2.12.0 - 2024-10-02

### 🚀 Added

###### [BUTTON]

- Added a new status `isLoading` to display the button with a spinner.
  If the status is set to `isLoading`, the actions on the button will be disabled and the spinner will be displayed and will replace the button content.

  ```angular2html
  <nj-button isLoading="true" label="Label"></nj-button>
  ```

###### [PROGRESS]

- Replaced `hasDescription` input with `descriptionPosition` input in `nj-progress` component.
  Now you can choose between `none`, `bottom` and `right` for the position of the description

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-tokens@5.8.2
  - @engie-group/fluid-design-system@5.16.0

## 📦 2.11.4 - 2024-09-13

### 🐛 Fixed

###### [FORM-CONTROL]

- Update styles of all form controls due to rendering issue.

###### [SPINNER]

- Update styles of the spinner component to fix a rendering bug.

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-system@5.15.4
  - @engie-group/fluid-design-tokens@5.8.1

## 📦 2.11.3 - 2024-09-11

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-system@5.15.3

## 📦 2.11.2 - 2024-09-08

### 🐛 Fixed

###### [AVATAR]

- Avatar default icon is now correctly rendered.

###### [STATUS-INDICATOR]

- Status indicator badge is now correctly rendered

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-system@5.15.2
  - @engie-group/fluid-design-tokens@5.8.0

## 📦 2.11.1 - 2024-09-06

### 🛠️ Maintained

- Remove unpublished dependency
- Update URLs in README.md
- Updated dependencies
  - @engie-group/fluid-design-system@5.15.1

## 📦 2.11.0 - 2024-09-06

### ⚠️ Breaking changes

###### [GLOBAL]

- Build has been reworked to fix some major issues and facilitate future development.
  We strongly recommend consulting the Getting started documentation to update your project.
- The main changes are based on how you will have to import CSS in your project.
  If you encounter any issues, please come back to us.
  Components no longer import CSS automatically, you will have to import it manually in your project.

  ```json
  // In your angular.json file
  {
    "styles": [
      "@engie-group/fluid-design-tokens/lib/css/tokens.css",
      // Only if you use deprecated components
      "@engie-group/fluid-4-deprecated/tokens/lib/css/tokens.css",
      "@engie-group/fluid-design-system-angular/lib/styles/fluid-design-system.css"
    ]
  }
  ```

### 🐛 Fixed

###### [TAG]

- Fix the display of the focus ring when `TagComponent` is clickable

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-system@5.15.0

## 📦 2.10.0 - 2024-08-23

### ⚠️ Breaking changes

###### [BREADCRUMB]

- Remove default margin (32px) and padding (4px). Your layout can be affected by this change, you can add them back if needed (values provided at the start).

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-system@5.14.0

## 📦 2.9.1 - 2024-07-16

### 🐛 Fixed

###### [TOGGLE]

- Prevent accessible label of icon only toggle from being displayed.
- Remove unwanted margin when no label is provided

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-system@5.13.0

## 📦 2.9.0 - 2024-07-09

### 🚀 Added

###### [CHECKBOX]

- Add new `@Input() indeterminate` prop to set the indeterminate state of the checkbox

### 🐛 Fixed

###### [FORM-ITEM]

- Ensure the `nj-form-item` with `textarea` uses the correct font (sans-serif)

### 🛠️ Maintained

- Updated dependencies
  - @engie-group/fluid-design-tokens@5.7.2
  - @engie-group/fluid-design-system@5.12.1

## 📦 2.8.0 - 2024-06-04

### ⚠️ Breaking changes

###### [ICON-BUTTON]

- We updated the `@Input() size` values and added some more:
  - NEW `2xs` (height of `16px`)
  - NEW `xs` (height of `24px`, it is the **new default**)
  - UPDATED `small` -> `sm` (height `32px`, used to be `16px`, please use the `2xs` instead)
  - NEW `md` (height `40px`, old default, used to be `24px`)
  - UPDATED `large` -> `lg` (height `48px`, used to be `32px`, please use the `sm` instead)
  - NEW `xl` (height of `56px`)

```angular2html
<!-- To apply those changes, search and replace the following components: -->

<nj-icon-button size="small"></nj-icon-button> -> <nj-icon-button size="2xs"></nj-icon-button>
<nj-icon-button size="large"></nj-icon-button> -> <nj-icon-button size="sm"></nj-icon-button>
```

### 🚀 Added

###### [ACCORDION]

- Add a new `AccordionComponent`.
  This component is used in combination of the new `AccordionItemComponent`, `AccordionActionsComponent` and `AccordionActionDirective`.
- Add new `EngieTemplateDirective`'s `icon` and `header` selectors, which are currently used to add a leading icon or pass a custom header to an `AccordionItemComponent`.

```angular2html
<!--Complete example of the new components and directives-->
<nj-accordion>
  <nj-accordion-actions>
    <nj-button emphasis="subtle" njAccordionAction="expand">Expand all</nj-button>
    <nj-button emphasis="subtle" njAccordionAction="collapse">Collapse all</nj-button>
  </nj-accordion-actions>
  <details nj-accordion-item label="Header 1">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloremque, ex.
  </details>
  <details nj-accordion-item label="Header 2">
    <nj-icon *njTemplate="'icon'" name="info"></nj-icon>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid illo iste, sunt temporibus vero voluptas? Accusantium autem esse modi quia.
  </details>
  <details nj-accordion-item>
    <span *njTemplate="'header'">Header 3</span>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
  </details>
</nj-accordion>
```

###### [AUTOCOMPLETE]

- Add new `@Input() hasSuccess` to trigger success state when a `subscript` is provided

###### [CHECKBOX]

- Add new `@Input() subscriptMessage` to add some hint below the checkbox
- Add new `@Input() hasSuccess` to trigger success state when a `@Input() subscript` is provided

###### [FORM-ITEM]

- Add new `@Input() hasSuccess` to trigger success state when a `subscript` is provided

###### [MULTI-SELECT]

- Add new `@Input() hasSuccess` to trigger success state when a `subscript` is provided

###### [RADIO]

- Add two new `nj-radio` sizes:
  - `lg`: 24px
  - `xl`: 32px

###### [SELECT]

- Add new `@Input() hasSuccess` to trigger success state when a `subscript` is provided

###### [TEXTAREA]

- Add new `@Input() hasSuccess` to trigger success state when a `subscript` is provided

### 🖍 Changed

###### [CHECKBOX]

- Deprecated `@Input() errorMessage` in favor of `@Input() subscriptMessage` combined to `@Input() hasError`

###### [RADIO]

- Update `nj-radio` default size from 20px to 16px

### 🐛 Fixed

###### [RADIO]

- Update `nj-radio-group` error message not displaying correctly

###### [TAB]

- Fix a visual bug where the hover bar wasn't placed correctly

## 📦 2.7.0 - 2024-05-07

### 🚀 Added

###### [BADGE]

- Add a new `small` size variation with a height of `18px` (`@Input() size = 'sm'`)

### 🖍 Changed

###### [BADGE]

- Update the medium size (`@Input() size = 'md'`) to `24px`. Old was `20px`.

## 📦 2.6.2 - 2024-04-18

### 🖍 Changed

###### [GLOBAL]

- Update fluid dependencies

## 📦 2.6.1 - 2024-04-12

### 🐛 Fixed

###### [GLOBAL]

- Fix border colors on `nj-inline-message`s, `nj-badge`s and `nj-tag`s color variants

## 📦 2.6.0 - 2024-04-12

#### ⚠️ Breaking changes

###### [BUTTON]

- Add new `large` size. Previous `large` size is now `xlarge`. Please update your base code to reflect this change if needed.

```angular2html
<nj-button size="large"></nj-button> ==> <nj-button size="xlarge"></nj-button>
```

###### [CHECKBOX]

- To standardize our component sizes and for consistency with the design, we had to make modifications to the checkbox sizes:
  - ❌ REMOVED `sm`, use the normal size instead (OLD: 14px)
  - 🖍 UPDATED `md` to 16 px (OLD: 20px)
  - 🖍 UPDATED `lg` to 24px (OLD: 30px)
  - 🚀 ADDED new `xl` with a size of 32px
- We also removed the animation, and therefor removed the `isAnimated` @Input()

### 🚀 Added

###### [ENGIE TEMPLATE DIRECTIVE]

- Implement a new generic structural directive, which will be used to inject elements in our current components.
  The approach for this directive, is to have only one structural directive used in all our library for this purpose.
  We will deploy its usage step by step on existing components. You can already use it in our new `SearchComponent`.

###### [SEARCH]

- Implement new `nj-search` component
- Search component can be augmented with an action via a structural `EngieTemplateDirective` with `'action'` selector:
  - You can use a `ButtonComponent` with `SearchButtonDirective` as `action` element.

```angular2html
<nj-search>
  <nj-button *njTemplate="'action'" njSearchButton>Search</nj-button>
</nj-search>
<!--Or-->
<nj-search>
  <ng-template njTemplate="action">
    <nj-button njSearchButton>Search</nj-button>
  </ng-template>
</nj-search>
```

###### [TABS]

- Add the possibility to pass a `nj-badge` to the tab-item, via the `badgeOptions` @Input():
  - example: `<nj-tab [badgeOptions]="{ value: 50, emphasis: 'subtle', capedValue: 10 }">...</nj-tab>`

#### 🖍 Changes

###### [BUTTON]

- Add a `medium` size to replace `normal`, for better homogeneity between components. Usage of `normal` size is now deprecated.

## 📦 2.5.0 - 2024-03-20

#### ⚠️ Breaking changes

###### [GLOBAL]

- To accommodate the changes made to the border radius tokens, all components border radiuses have been set to the token `--nj-semantic-size-border-radius-none` (in order to not change their appearance).

## 📦 2.4.0 - 2024-03-05

### 🚀 Added

###### [CHECKBOX]

- Add new Input `size`: `sm` | `md` | `lg`

###### [FORM ITEM]

- Solve feature request [#989](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/989)
  Add new input `isIconClickable`, default to `true`, which define whether the icon (and custom icon) can be clicked.

### 🖍 Changed

###### [GLOBAL]

- Update dependencies to support Node >= 20

###### [CHECKBOX]

- Update the required state to properly show an asterisk when `@Input() isRequired` is set to `true`

##### ⚠️ Breaking changes

###### [CHECKBOX]

- Removed the `@Input() isInline`. You can inline elements with the `display: flexbox` CSS property on the parent.

## 📦 2.3.0 - 2024-01-31

### 🚀 Added

###### [GLOBAL]

- Add new `CustomIconDirective` to better inject icon in components:
  - Actually works with `BadgeComponent`

###### [BADGE]

- Add `iconName` input to add material icon in the badge.
- Link with `CustomIconDirective` to add custom icon in the badge:

  ```angular2html
  <nj-badge>
    <svg *njCustomIcon>...</svg>
    badge label
  </nj-badge>
  ```

###### [ICON]

- Add new icon size `xs`

### 🐛 Fixed

###### [GLOBAL]

- Fix issue [#955](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/955)
  Icons used in other components have the right colors.

###### [AUTOCOMPLETE]

- Fix issue [#900](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/900),
  Rework component to be more accessible, and shows keyboard on mobile.

###### [LINK]

- Fix issue [#926](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/926)
  Keyboard navigation and focus works as expected when using `RouterLink` on `nj-link` component.

## 📦 2.2.1 - 2024-01-04

### 🐛 Fixed

###### [MULTI-SELECT]

- Fix multi-select not working correctly with reactive forms after release 2.2.0

## 📦 2.2.0 - 2024-01-04

### 🚀 Added

###### [SIDEBAR]

- Add new `nj-sidebar` component

### 🐛 Fixed

###### [SELECT], [MULTI-SELECT]

- Fix select and multi select options not updating on provided options change issue [#937](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/937)

## 📦 2.1.0 - 2023-12-15

### 🚀 Added

###### [GLOBAL]

- Add new `planet` variant to type `TSemanticVariants`

###### [BADGE]

- Add new `planet` semantic color variant

###### [INLINE MESSAGE]

- Add new `planet` and `discovery` semantic colors variants

###### [SIDEPANEL]

- Add new `nj-sidepanel` component
- Add new `nj-sidepanel-header` component to display a title, a close button, and some action buttons in the sidepanel.
- Add new `nj-sidepanel-layout` component to attach a sidepanel aside of a content

###### [STATUS INDICATOR]

- Add new `planet` and `discovery` semantic colors variants

###### [ICON]

- Add `inherit` color variant to inherit color from context.
- Add `secondary` and `tertiary` color variant.

### 🖍 Changed

###### [BREADCRUMB]

- Change the number of displayed elements in minified mode (from 3 to 2 elements)

##### ⚠️ Breaking changes

###### [CUSTOM LABEL DIRECTIVE]

- Rename directive from `njCustomLabelDef` to `njCustomLabel`.

###### [ICON]

- Update icon default color. Icon no longer inherit color from context.
  If you want to keep the old behaviour, use the color variant `inherit`.

###### [INLINE MESSAGE]

- Rename `info` semantic color variant to `information` to homogenize with the new token names.

###### [STATUS INDICATOR]

- Rename `info` semantic color variant to `information` to homogenize with the new token names.
- Rename `in_progress` semantic color variant to `in-progress`
- Rename `do_not_disturb` semantic color variant to `do-not-disturb`

## 📦 2.0.3 - 2023-10-27

### 🖍 Changed

###### [GLOBAL]

- Update fluid dependencies

## 📦 2.0.2 - 2023-10-23

### 🖍 Changed

###### [GLOBAL]

- Update fluid dependencies

## 📦 2.0.1 - 2023-10-23

### 🐛 Fixed

###### [GLOBAL]

- Fix not being able to import components in an angular 16 project

## 📦 2.0.0 - 2023-10-20

### 🚀 Added

###### [GLOBAL]

- Add support for Angular v16+.

###### [CUSTOM LABEL DIRECTIVE]

- Create a structural directive `njCustomLabelDef` for templating the label of components.
  This directive is currently used by `SelectComponent`.

###### [SELECT]

- Implement feature [#865](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/865)
  Add the usage of `njCustomLabelDef`, a structural directive, as children to template the label of the selected item.
  This directive provides access to the value and index of the selected item in its context.
  e.g:

  ```html
  <ng-template njCustomLabelDef let-value let-index="index"> Value: {{value}} - Index: {{index}} </ng-template>
  ```

  or

  ```html
  <span *njCustomLabelDef="let value;let index=index"> Value: {{value}} - Index: {{index}} </span>
  ```

### ❌ Removed

##### ⚠️ Breaking changes

###### [GLOBAL]

- Remove support for Angular v14, v15. Fluid now supports only Angular v16+. This change may introduce some breaking changes in your project if you're on an older version of Angular (< 16).
  Please check breaking changes between your version of Angular and Angular 16.

###### [ICON]

- `isDisabled` input has been removed

###### [ICON ENGIE]

- `isDisabled` input has been removed

### 🖍 Changed

##### ⚠️ Breaking changes

###### [GLOBAL]

- Update tokens to their new nomenclature. It should not affect they way you use Fluid components.
- ⚠️ Breaking changes: If you are using Fluid tokens (for overrides on Fluid components or for custom components), please check out the `fluid-design-tokens`'s changelog. We provide a script to automatically update all tokens.

- Implement standalone component. You should now import directly the components used in your codebase.

  - In your Angular modules

    ```ts
    import { NgModule } from '@angular/core';
    import { ButtonComponent } from '@engie-group/fluid-design-system-angular';

    @NgModule({
      imports: [ButtonComponent]
    })
    export class AppModule {}
    ```

  - or directly in your components

    ```ts
    import { Component } from '@angular/core';
    import { ButtonComponent } from '@engie-group/fluid-design-system-angular';

    @Component({
      template: '<nj-button>Label</nj-button>',
      imports: [ButtonComponent]
    })
    export class CustomComponent {}
    ```

- Remove `FluidModule` in favour of standalone components. Replace all occurrences of the `FluidModule` by the components used in your codebase.
- Change import path, import must be from`@engie-group/fluid-design-system-angular` and no longer from `@engie-group/fluid-design-system-angular/lib`
  eg: before `import {FluidModule} from '@engie-group/fluid-design-system-angular/lib'` now `import {ButtonComponent} from '@engie-group/fluid-design-system-angular'`
- Remove obligation to allow JSON imports in your typescript config `tsconfig.json`. Previously you would do this:

  ```
  In your `tsconfig.json`, in the `compilerOptions` section, add the following:

  // tsconfig.json

  "resolveJsonModule": true,
  "esModuleInterop": true,

  Your tsconfig should look like something like this:
  // tsconfig.json

  {
    "compilerOptions": {
      ...
      "resolveJsonModule": true,
      "esModuleInterop": true,
    },
  }
  ```

If it was only used for `fluid`, you can now remove `"resolveJsonModule": true, "esModuleInterop": true` from your `tsconfig.json`

###### [ANIMATIONS]

- If you're now bootstrapping your application with `bootstrapApplication` function. Provide the animations capabilities with `provideAnimations` function instead of importing the `BrowserAnimationModule` in your main module.

  ```ts
  import { provideAnimations } from '@angular/platform-browser/animations';

  bootstrapApplication(AppComponent, {
    providers: [provideAnimations()]
  });
  ```

  > See [Angular documentation](https://angular.io/guide/animations#step-1-enabling-the-animations-module)

## 📦 1.4.0 - 2023-09-29

### 🐛 Fixed

###### [GLOBAL]

- Fix issue [#864](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/864)
  Buttons inside `nj-select`, `nj-multi-select` and `list-items` now correctly have the `type="button"` (default used to be `submit` and triggered ngSubmit event)

#### [SPINNER]

- Fix issue [#874](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/874)
  Spinner now correctly hidden when `isLoading` is `false`

## 📦 1.3.0 - 2023-07-06

### 🚀 Added

###### [CHECKBOX]

- Add `@Input() isPresentational` to `nj-checkbox`. When the checkbox is only presentational the state is handled by a
  parent, it can be useful for lists of checkboxes.
  When set to `true`, the checkbox won't have any interaction.

###### [SKELETON]

- Add new `nj-skeleton-container`, `nj-skeleton-rectangle`, `nj-skeleton-circle` and `nj-skeleton-area` components

###### [FORM ITEM]

- Add `@Input() size: 'small' | 'medium' | 'large' | 'xlarge'` for `nj-form-item`. This also adds the size for all the
  components depending on `nj-form-item`:
  `nj-select, nj-autocomplete`

###### [LIST GROUP]

- Add `isMultiSelect` to add accessibility props to the list if need

###### [LIST ITEM]

- Add `isCheckboxContent` property to wrap project content in a checkbox

###### [MULTI SELECT]

- Add multi-select component `nj-multi-select`, with multiple options

###### [TAG]

- Add size `xs` for tags and option `shouldAutoDestruct` set by default to true. When set to `false` click on close only
  emits event and doesn't destruct tag

### 🖍 Changed

###### [CHECKBOX]

- Checkbox host element `nj-checkbox` now has a `display: inline-flex`

### 🐛 Fixed

#### [AUTOCOMPLETE]

- Fix animation not working on opening closing

#### [SELECT]

- Fix issue [#825](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/825)
  on `nj-select`: value disappearing when opening select, value not displaying with reactive forms and first element
  being auto selected.
- Fix animation not working on opening closing

## 📦 1.2.0 - 2023-05-04

### 🚀 Added

###### [SLIDER]

- Add slider component

### 🐛 Fixed

#### [LIST ITEM]

- [A11Y] `nj-list-item` : fix markup when list item is a button or a link

###### [BADGE]

- ⚠️ Change default `nj-badge` color to `neutral` (grey)
- Add new @Input() `emphasis`:
  - Bold: default
  - Subtle: `nj-badge--subtle`
  - Minimal: `nj-badge--minimal`
- Add new @Input() `variants`:
  - Neutral: default
  - Information: `nj-badge--information`,
  - Danger: `nj-badge--danger`,
  - Warning: `nj-badge--warning`,
  - Success:`nj-badge--success`,
  - Discovery: `nj-badge--discovery`
- Add new @Input() `isUppercase`

###### [TAG]

- Add new `grey` color variant (used to be the default), which is semantically different from neutral (like blue and
  brand).
- Changed default to `neutral` color (still grey, no breaking change).

##### ⚠️ Breaking changes

###### [BADGE]

- `nj-badge` default color is now `neutral` (grey) instead of blue. You can use the @Input() `variant`: `information`
  instead.

###### [ICON]

- `nj-icon-engie` new colors (the gradient is replaced by ultramarine-900)
  - Add new values for the @Input() `variant`: `default` (ultramarine-900) | `brand` (brand-600) | `inverse` (grey-0)
  - Remove old @Input() `variant` values: `gradient` | `blue-corporate` (use 'brand') | `white` (use 'inverse')

###### [LIST]

- `nj-list-item`
  - Remove @Input() `isClickable`. Use @Input() `type` instead (with `"button"` to render a `<button>` or `"link"` to
    render a `<a>`)
  - Add @Input() `href` to use when `type="link"`

## 📦 1.1.1 - 2023-04-04

### 🖍 Changed

###### [GLOBAL]

- Update fluid dependencies

## 📦 1.1.0 - 2023-04-04

### 🚀 Added

###### [ICON BUTTON]

- Add variants tertiary and brand

### 🖍 Changed

##### ⚠️ Breaking changes

###### [ICON BUTTON]

- Change default value from (blue icon) to primary (black icon)
- Primary takes now the color of old secondary, and current variant secondary use `var(--nj-color-icon-secondary)`
- All components using icon buttons have been updated to use correct variant

## 📦 0.2.1 - 2023-03-09

### 🖍 Changed

- Update dependencies

## 📦 1.0.0 - 2023-03-02

### 🚀 Added

###### [GLOBAL]

- Add support for angular 14+

###### [AUTOCOMPLETE]

- Add component `nj-autocomplete`

###### [AVATAR]

- [A11Y] Add required `@Input() label` and optional `@Input() notificationUnitLabel` to `nj-avatar`
- Add `Input() tooltipOptions` to display tooltip for `nj-avatar`

###### [AVATAR LIST]

- Add component `nj-avatar-list`

###### [BADGE]

- [A11Y] Add `@Input() unitLabel` to `nj-badge`

###### [BUTTON]

- Add button size xsmall

###### [BREADCRUMB]

- [A11Y] Add `ariaLabel` prop to `nj-breadcrumb`
- [A11Y] Add `showMoreLabel` prop to `nj-breadcrumb`
- [A11Y] Add `label` prop to `nj-breadcrumb-item`

###### [CARD]

- Add `nj-card` component

###### [CHECKBOX]

- Add new `@Input() isAnimated` to `nj-checkbox` to toggle animation on and off
- [A11Y] Add `@Input() hasError` and `@Input() errorMessage` to `nj-checkbox`

###### [FORM ITEM]

- Add form-item component
- Add form-item input password type support
- Add form-item input select type support
- Add form-item input textarea type support

###### [HIGHLIGHT]

- Add directive `nj-highlight` that highlights occurrence of string in text

###### [ICON]

- Add size `inherit` for icon that inherit font-size from parent
- Add `@Input() isHighContrast`

###### [ICON BUTTON]

- Add new component `nj-icon-button`

###### [INLINE MESSAGE]

- Add component `nj-inline-message`

###### [LINK]

- Add `nj-link` variant `contextual`
- Add variant `inverse` and `high-contrast` to `nj-link`
- [A11Y] Add `@Input() externalLabel` to `nj-link`

###### [LIST ITEM]

- Add `list-item` and `list-group` component

###### [MODAL]

- Add `nj-modal` component, we rely on `@angular/cdk/dialog` for opening and closing
  dialogs https://material.angular.io/cdk/dialog/overview.

###### [PAGINATION]

- Add `nj-pagination` component

###### [RADIO GROUP]

- [A11Y] Add `legend`, `hasError` and `errorMessage` @Input() to `nj-radio-group`

###### [SELECT]

- Add custom `nj-select` component

###### [SEGMENTED CONTROL]

- Add components `nj-segmented-control` and `nj-segmented-control-button`

###### [SPINNER]

- Add new size `xxs` for `nj-spinner`
- [A11Y] Add optional `Input() isBlock` to `nj-spinner`

###### [STATUS INDICATOR]

- Add component `nj-status-indicator`

###### [TABS]

- Add `@Input() density` to `nj-tabs`

###### [TAG]

- Add component `nj-tag`

###### [TOGGLE]

- Add @Input() size : md | lg
- Add `@Input() isColorInherited` to `nj-toggle` to make toggle label color inherit from parent, fixes
  issue [#688](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/688

###### [TOAST]

- Add `nj-toast` component and `ToastService`

###### [TOOLTIP]

- Add `nj-tooltip` component and `njTooltip` directive

### 🖍 Changed

###### [GLOBAL]

- Update all components with new brand guidelines and latest UI design
- Disabled elements now use opacity instead of specific disabled colors
- Make components accessible

###### [BADGE]

- [A11Y] Change `nj-badge` semantic from `div` to `p`

###### [ICON]

- [A11Y] Change `nj-icon-base`, `nj-icon` and `nj-icon-engie` root element from `<i>` to `<span>`

##### ⚠️ Breaking changes

###### [GLOBAL]

- Update dependencies to work with Node latest LTS v16.16 and npm 8.15
- Change importing `FluidModule` and packages files:
  - Before you would import `FluidModule` like
    this `import {FluidModule} from '@engie-group/fluid-design-system-angular'`.
    You now need to specify the `lib` folder in the import path like this:
    `import {FluidModule} from '@engie-group/fluid-design-system-angular/lib'``
- Add `@angular/cdk` as a required peerDependency
- When installing the package via npm or importing it via CDN we recommend fixing the version with the exact package
  version to avoid breaking change affecting your live website. With never-ending topics like Accessibility and BRAND
  GUIDELINES we also have to include some minor breaking changes in some minor versions

###### [BULLET]

- `nj-bullet` doesn't take same variants as before,

```
Before:

  white
  blue-corporate
  blue-allports
  blue-venice
  green-java
  green-pine
  green
  orange-crusta
  orange
  red-mandy
  red
  blue-bigstone
  blue-rhino
  green-fun
  green-riogrande
  yellow
  yellow-bright-sun
  purple
  violet
  violet-eggplant
  cerise

After :

  brand
  teal
  pink
  orange
  red
  green
  ultramarine
  yellow
  purple
  blue
  lime
```

###### [BUTTON]

- Change how `nj-button` works:
  - `btnType` is replaced by `emphasis` and its values are replaced by `'bold' | 'subtle' | 'minimal'`, `'bold'` being
    now default
  - `variant` values are replaced by `'primary' | 'secondary' | 'destructive' | 'inverse'` `'primary'` being the default
  - Rename `hasIcon` @Input to `hasCustomIcon`

###### [CHECKBOX]

- Rename `id` @Input to `inputId`

###### [ICON]

- Icon size m is now md
- Change color variant values: primary (grey-800), inverse (grey-0), brand (ex blue-corporate), grey, teal, pink,
  orange, red, green, ultramarine, yellow, purple

###### [ICON ENGIE]

- `nj-icon-engie` new colors (the gradient is replaced by ultramarine-900)
  - Add new values for the @Input() `variant`: `default` (ultramarine-900) | `brand` (brand-600) | `inverse` (grey-0)
  - Remove old @Input() `variant` values: `gradient` | `blue-corporate` (use 'brand') | `white` (use 'inverse')

###### [LINK]

- Rename `nj-link` size value `m` to `md`
- `nj-link` now inherits its parent font-size
- Prop `rel` is no longer used to pass url. Use the new `href` prop to pass the link href.
- Prop `rel` is now used to pass `rel` to the link.

###### [PROGRESS]

- [A11Y] `nj-progress`: add `label` required @Input()

###### [RADIO]

- [A11Y] ⚠️ Breaking change `nj-radio`: rename `id` prop to `inputId`

###### [SPINNER]

- `light` variant has been renamed `inverse` icon
- `gray` variant has been renamed `grey` icon
- [A11Y] `nj-spinner`: add `isLoading` @Input to conditionally display component

###### [TABS]

- [A11Y] `nj-tabs`: add required `label` @Input

###### [TOGGLE]

- Rename `id` @Input to `inputId`

### 🐛 Fixed

###### [GLOBAL]

- Fix warning that library uses deep imports and import tokens from js instead of json

###### [AVATAR]

- Fix undefined being set to ngClass in `nj-avatar`.
  Issue [#694](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/694)

###### [BUTTON]

- [A11Y] Fix `nj-button` accessibility issues
  - Accessibly hide icons to assistive technology
  - Remove unnecessary `tabindex` and `aria-label` attributes.

###### [BREADCRUMB]

- [A11Y] Fix `nj-breadcrumb` accessibility issues
  - Add `role="navigation"` to the root `nav` element
  - Add text alternative to the "show more" button
  - When user clicks the "show more" button, focus the first revealed item
  - Add text alternative to "icon only" breadcrumb items

###### [RADIO GROUP]

- [A11Y] Fix `nj-radio-group` accessibility issues
  - Update markup structure of `nj-radio-group` with `fieldset`, `legend` and `span` for error message if needed

###### [SPINNER]

- [A11Y] Fix `nj-spinner` accessibility issues
  - Add `aria-live` and `aria-atomic` to `nj-spinner` wrapper element and update semantic of inner element

###### [TOGGLE]

- [A11Y] Fix `nj-toggle` accessibility issues
  - Add `switch` role to `nj-toggle`

### 👎 Deprecated

- ⚠️Deprecation: `nj-switch` is deprecated. You should use `nj-segmentedControl` instead

### ❌ Removed

##### ⚠️ Breaking changes

###### [GLOBAL]

- Remove support for angular 11, 12, 13. Fluid now supports only Angular v14+

###### [AVATAR]

- Remove `notificationColor` @Input from `nj-avatar`

###### [BADGE]

- Remove `variants` @Input from `nj-badge`

###### [BUTTON]

- Remove `isInverse` @Input from `nj-button`. (Replaced by `variant="inverse"`)
- Remove `btnType` values `default' | 'outline' | 'ghost'`
- `@Input() btnType` has been renamed `emphasis`
- Remove `variant` values `'danger' | 'warning' | 'success'`
- Remove `isIconButton` @Input from `nj-button`. (Will be replaced by specific component `nj-icon-button`)
- Remove `iconPosition` @Input from `nj-button`. (Buttons should always have their icon on the left now)
- Remove `size="block"` @Input from `nj-button`

###### [ICON]

- `nj-icon-base`, `nj-icon` and `nj-icon-engie`:
  - Remove `@Input() title` and `@Input() isClickable`
  - Remove `@Output() iconClick` and `@Output() iconKeyPress`

###### [LINK]

- Remove variants:
  `primary`, `success`, `danger`, `warning`, `light`
- Remove `isUnderlined` @Input from `nj-link`. Links are all underlined except for link `variant="contextual"`

###### [PROGRESS]

- Remove @Input() `variant` (colors variations)

###### [TOGGLE]

- Remove @Input() variant theme
- Remove possibility to have one label before and one after the toggle. Toggles now only have one label which is placed
  after the toggle
- Icons of `nj-toggle` should have property/directive `njToggleIcon` Eg:

```
  <nj-toggle>
    <nj-icon name="settings" njToggleIcon></nj-icon>
  </nj-toggle>
```

## 📦 1.0.0 FOR THOSE MOVING FROM RC2 - 2023-03-02

### 🚀 Added

- Add component `nj-avatar-list`
- Add `Input() tooltipOptions` to display tooltip for `nj-avatar`
- [A11Y] Add `Input() closeLabel` to label close button for `nj-modal`
- [A11Y] Add optional `Input() isBlock` to `nj-spinner`
- [A11Y] `nj-form-item` Warning icon is now added on subscript labels for forms in error state

### 🖍 Changed

- Remove focus ring on all elements on click since accessibility guidelines requires it only on keyboard navigation
- Disabled elements now use opacity instead of specific disabled colors
- Apply new transparent tokens for components needing transparency
  E.g: icon-button, button etc..
- Always display all options when not filtering field in `nj-autocomplete-input`

##### ⚠️ Breaking changes

- When installing the package via npm or importing it via CDN we recommend fixing the version with the exact package
  version to avoid breaking change affecting your live website. With never-ending topics like Accessibility and BRAND
  GUIDELINES we also have to include some minor breaking changes in some minor versions
- `nj-icon-engie` new colors (the gradient is replaced by ultramarine-900)
  - Add new values for the @Input() `variant`: `default` (ultramarine-900) | `brand` (brand-600) | `inverse` (grey-0)
  - Remove old @Input() `variant` values: `gradient` | `blue-corporate` (use 'brand') | `white` (use 'inverse')
- `nj-bullet` doesn't take same variants as before,

```
Before:

  white
  blue-corporate
  blue-allports
  blue-venice
  green-java
  green-pine
  green
  orange-crusta
  orange
  red-mandy
  red
  blue-bigstone
  blue-rhino
  green-fun
  green-riogrande
  yellow
  yellow-bright-sun
  purple
  violet
  violet-eggplant
  cerise

After :

  brand
  teal
  pink
  orange
  red
  green
  ultramarine
  yellow
  purple
  blue
  lime
```

### 🐛 Fixed

- Fix issue, failed http calls to `screenreader.css`
  file [#730](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/730)
- Fix issue where checkbox without label doesn't have correct
  outline [#731](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/731)
- [A11Y] Use semantic `<p>` tags for hidden content in `nj-avatar`
- [A11Y] Make ellipsis icon accessible in `nj-pagination`
- [A11Y] Add space before external notice in `nj-link`
- Fix issue on cards
  cover [#735](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/735)
- [A11Y] Set `required` attribute on field when `@Input() isRequired` is true in `nj-form-item`
- [A11Y] Set correct `disabled` attribute value on button in `nj-tag`
- Display option's label instead of value inside input in `nj-custom-select`, fixes
  issue [#738](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/738)
- [A11Y] Improve accessibility of `nj-autocomplete`

## 📦 1.0.0-rc.2 - 2022-12-08

### 🚀 Added

- Add `nj-pagination` component
- Add `nj-tooltip` component and `njTooltip` directive
- Add `nj-toast` component and `ToastService`
- Add size `inherit` for icon that inherit font-size from parent
- Add `@Input() isColorInherited` to `nj-toggle` to make toggle label color inherit from parent, fixes
  issue [#688](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/688
- Add `@Input() hasIcon`, `@Input() iconName` and `@Input() iconAriaLabel` to `nj-list-item`
- Add `isRequired` @Input on `nj-form-item`
- [A11Y] Add `ariaLabel` prop to `nj-breadcrumb`
- [A11Y] Add `showMoreLabel` prop to `nj-breadcrumb`
- [A11Y] Add `label` prop to `nj-breadcrumb-item`
- [A11Y] Add `@Input() hasError` and `@Input() errorMessage` to `nj-checkbox`
- [A11Y] Add `@Input() externalLabel` to `nj-link`
- [A11Y] Add `@Input() id` to `nj-modal`
- [A11Y] Add `passwordButtonLabelShow`, `passwordButtonLabelHide`, `passwordNoticeIsVisible`
  and `passwordNoticeIsHidden` @Input() to `nj-form-item`
- [A11Y] Add `ariaPressed` and `additionalClass` @Input() to `nj-icon-button`
- [A11Y] Add `legend`, `hasError` and `errorMessage` @Input() to `nj-radio-group`
- [A11Y] Add required `@Input() label` and optional `@Input() notificationUnitLabel` to `nj-avatar`
- [A11Y] Add `@Input() unitLabel` to `nj-badge`
- [A11Y] Add `fieldLabel`, `listNavigationLabel` and `buttonDefaultValueLabel` @Input to `nj-select`
- [A11Y] Add optional `ariaDescribedby` @Input to `nj-icon-button`
- [A11Y] Add optional `closeLabel` @Input to `nj-tag`
- [A11Y] Add optional `listId` @Input to `nj-list-group`

##### ⚠️ Breaking changes

- [A11Y] ⚠️ Breaking change `nj-progress`: add `label` required @Input()
- [A11Y] ⚠️ Breaking change `nj-tabs`: add required `label` @Input
- [A11Y] ⚠️ Breaking change Add required `listLabel` @Input to `nj-autocomplete`

### 🐛 Fixed

- Fix http error when using `nj-modal`.
  Issue [#665](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/665)
- Fix undefined being set to ngClass in `nj-avatar`.
  Issue [#694](https://github.tools.digital.engie.com/GBSEngieDigitalDesignSystem/fluid-design-system/issues/694)
- [A11Y] Fix `nj-button` accessibility issues
  - Accessibly hide icons to assistive technology
  - Remove unnecessary `tabindex` and `aria-label` attributes.
- [A11Y] Add `aria-invalid` and `aria-describedby` when needed on `nj-form-item` and `id` on error/hint messages.
- [A11Y] Change `nj-icon-base`, `nj-icon` and `nj-icon-engie` root element from `<i>` to `<span>`
- [A11Y] Render `nj-icon-button` label in a hidden span instead of using `aria-label` attribute
- [A11Y] Link modal with its title using `aria-labelledby`
- [A11Y] Fix `nj-status-indicator` semantic structure
- [A11Y] Fix `nj-breadcrumb` accessibility issues
  - Add `role="navigation"` to the root `nav` element
  - Add text alternative to the "show more" button
  - When user clicks the "show more" button, focus the first revealed item
  - Add text alternative to "icon only" breadcrumb items
- [A11Y] Fix `nj-select` keyboard navigation and accessibility issues
- [A11Y] Add `aria-live` and `aria-atomic` to `nj-spinner` wrapper element and update semantic of inner element
- [A11Y] Change DOM order and add description to close button in `nj-toast` and make `nj-toast-container` a live region
- [A11Y] Fix `nj-tag` semantic structure
- [A11Y] Describe `nj-tooltip` host element with `aria-describedby`
- [A11Y] Fix `nj-autocomplete` keyboard navigation and semantic structure.

### 🖍 Changed

- [A11Y] Change `nj-badge` semantic from `div` to `p`
- [A11Y] Add `switch` role to `nj-toggle`
- [A11Y] Use `nj-icon-button` to toggle password visibility in `nj-form-item` and add live region
- [A11Y] Update markup structure of `nj-radio-group` with `fieldset`, `legend` and `span` for error message if needed

##### ⚠️ Breaking changes

- ⚠️ Breaking change update `nj-icon`
  - Change color variant values: primary (grey-800), inverse (grey-0), brand (ex blue-corporate), grey, teal, pink,
    orange, red, green, ultramarine, yellow, purple
  - Add `@Input() isHighContrast`
- [A11Y] ⚠️ Breaking change `nj-spinner`: add `isLoading` @Input to conditionally display component
- [A11Y] ⚠️ Breaking change `nj-radio`: rename `id` prop to `inputId`
- [A11Y] ⚠️ Breaking change `nj-toggle`: rename `id` @Input to `inputId`
- [A11Y] ⚠️ Breaking change `NJIconButton`: Rename `ariaLabel` prop to `label`
- [A11Y] ⚠️ Breaking change `nj-checkbox`: Rename `id` @Input to `inputId`

### ❌ Removed

- ⚠️Breaking changes `nj-icon-base`, `nj-icon` and `nj-icon-engie`:
  - Remove `@Input() title` and `@Input() isClickable`
  - Remove `@Output() iconClick` and `@Output() iconKeyPress`
- Remove unnecessary attributes on `nj-radio`

## 📦 1.0.0-rc.1 - 2022-10-18

### 🚀 Added

- Add component `nj-tag`
- Add component `nj-status-indicator`
- Add variant `inverse` and `high-contrast` to `nj-link`
- Add component `nj-inline-message`
- Add components `nj-segmented-control` and `nj-segmented-control-button`
- Add `@Input() density` to `nj-tabs`

### 🖍 Changed

- Fix icon button not displaying correct size
- Update `nj-progress` color tokens, fix percentage calculation
- Update `nj-card` with new colors and ui
- Update `nj-tabs` with new colors and ui

### 👎 Deprecated

- ⚠️Deprecation: `nj-switch` is deprecated. You should use `nj-segmentedControl` instead

### ❌ Removed

- ⚠️Breaking changes `nj-progress`:
  - Remove @Input() `variant` (colors variations)

## 📦 1.0.0-beta.1 - 2022-09-30

### 🚀 Added

- Add `nj-link` variant `contextual`
- Add new component `nj-icon-button`
- add new `@Input() isAnimated` to `nj-checkbox` to toggle animation on and off
- Add new size `xxs` for `nj-spinner`

### 🖍 Changed

- ⚠️ Breaking changes `nj-button`:
  - `btnType` is replaced by `emphasis` and its values are replaced by `'bold' | 'subtle' | 'minimal'`, `'bold'` being
    now default
  - `variant` values are replaced by `'primary' | 'secondary' | 'destructive' | 'inverse'` `'primary'` being the default
  - Rename `hasIcon` @Input to `hasCustomIcon`
  - Update `nj-radio` with new color tokens
  - Update `nj-checkbox` with new color tokens and
- Update `nj-spinner`:
  - new color tokens
  - ⚠️Breaking change:
    - `light` variant has been renamed `inverse` icon
    - `gray` variant has been renamed `grey` icon
- ⚠️Breaking change `nj-list-group`, `nj-autocomplete`, `nj-select`: usage of `nj-list-item` changed.

### ❌ Removed

- ⚠️ Breaking changes `nj-button`:
  - Remove `isInverse` @Input from `nj-button`. (Replaced by `variant="inverse"`)
  - Remove `btnType` values `default' | 'outline' | 'ghost'`
  - `@Input() btnType` has been renamed `emphasis`
  - Remove `variant` values `'danger' | 'warning' | 'success'`
  - Remove `isIconButton` @Input from `nj-button`. (Will be replaced by specific component `nj-icon-button`)
  - Remove `iconPosition` @Input from `nj-button`. (Buttons should always have their icon on the left now)
  - Remove `size="block"` @Input from `nj-button`
- ⚠️ Breaking changes remove `isUnderlined` @Input from `nj-link`. Links are all underlined except for
  link `variant="contextual"`
- ⚠️ Breaking changes remove `variants` @Input from `nj-badge`
- ⚠️ Breaking changes remove `notificationColor` @Input from `nj-avatar`
- ⚠️ Breaking changes `nj-toggle`:

  - Remove possibility to have one label before and one after the toggle. Toggles now only have one label which is
    placed after the toggle
  - Icons of `nj-toggle` should have property/directive `njToggleIcon` Eg:

  ```
    <nj-toggle>
      <nj-icon name="settings" njToggleIcon></nj-icon>
    </nj-toggle>
  ```

## 📦 1.0.0-beta.0 - 2022-09-13

### 🚀 Added

- Add support for angular 14+
- Add `nj-modal` component, we rely on `@angular/cdk/dialog` for opening and closing
  dialogs https://material.angular.io/cdk/dialog/overview.
- Add `@angular/cdk` as a required peerDependency
- Add `nj-card` component

### 🖍 Changed

- ⚠️ Breaking change Link
  - Prop `rel` is no longer used to pass url. Use the new `href` prop to pass the link href.
  - Prop `rel` is now used to pass `rel` to the link.
- Replace all colors to use new primary
- Replace $spacer sass variable with css variables
- ⚠️ Breaking change importing `FluidModule` and packages files:
  - Before you would import `FluidModule` like
    this `import {FluidModule} from '@engie-group/fluid-design-system-angular'`.
    You now need to specify the `lib` folder in the import path like this:
    `import {FluidModule} from '@engie-group/fluid-design-system-angular/lib'`

### ❌ Removed

- ⚠️ Breaking changes remove variants from `nj-link`
  - Remove variants:
    `primary`, `success`, `danger`, `warning`, `light`
- ⚠️ Breaking changes Angular versions
  - Remove support for angular 11, 12, 13. Fluid now supports only Angular v14+

## 📦 1.0.0-alpha.6 - 2022-08-03

### 🐛 Fixed

- Fix version `1.0.0-alpha.5` missing `lib` folder

## 📦 1.0.0-alpha.5 - 2022-00-03

### 🚀 Added

- Add component `nj-autocomplete`
- Add directive `nj-highlight`

### 🐛 Fixed

- Fix `inputId` not being set in `nj-select` component
- Fix `nj-select` not working properly with content set after init
- Fix `nj-select` not closing panel when clicking exactly on `nj-list-item` label

### 🖍 Changed

- Update dependencies to work with Node latest LTS v16.16 and npm 8.15

## 📦 1.0.0-alpha.4 - 2022-07-19

### 🖍 Changed

- Rename `Link` size value `m` to `md`
- `Link` now inherits its parent font-size

## 📦 1.0.0-alpha.3 - 2022-05-17

### 🚀 Added

- Add list-item and list-group component
- Add native select support for form-item
- Add custom select component
- Update Toggle component
  - Add @Input() size : md | lg

### 🐛 Fixed

- Fix warning that library uses deep imports and import tokens from js instead of json

### ❌ Removed

- Update Toggle component
  - Remove @Input() variant theme

## 📦 0.7.1 - 2022-07-06

### 🚀 Added

- Update fluid dependency

## 📦 0.7.0 - 2022-05-16

### 🐛 Fixed

- Fix radio not working properly with custom content
- Fix radio focus not showing

### ❌ Removed

- Remove prop isInline from `radio` component, it is now handled by `radio-group`

## 📦 1.0.0-alpha.2 - 2022-04-26

### 🚀 Added

- Add @Input() inputId to form-item

### 🐛 Fixed

- Fix outline button not working

## 📦 1.0.0-alpha.1 - 2022-04-15

### 🚀 Added

- Add form-item
- Add form-item password
- Add form-item textarea

### 🐛 Fixed

- Fix button icon not being spaced correctly

## 📦 0.6.3 - 2022-04-15

### 🐛 Fixed

- Breadcrumb: Fix breadcrumb not rendering in some cases

## 📦 0.6.2 - 2022-02-25

### 🖍 Changed

- Update dependencies

## 📦 0.6.1 - 2022-02-16

### 🖍 Changed

- Update dependencies

## 📦 1.0.0-alpha.0 - 2022-02-04

### 🚀 Added

- Update buttons
  ⚠️ Breaking changes
  - Add button size xsmall
  - Tertiary buttons have been renamed Ghost buttons
  - `isTertiary` and `isOutlined` have been replaced by property `btnType` which can take `ghost` and `outlined`
  - Replace `light` variant by `isInverse` property for all buttons
  - Variants are now `danger`, `warning`, `success`. `light` and `primary` are deprecated, `primary` being now default
  - Variants are not applicable for ghost buttons

### 🚀 Changed

- Icon size m is now md

## 📦 0.6.0 - 2022-02-03

### 🚀 Added

- Add Avatar component
- Add Breadcrumb-item and Breadcrumb component

## 📦 0.5.0 - 2021-12-16

### 🚀 Added

- Add Bullet component

### 🚀 Changed

- Upgrade to Angular 11 (**Breaking change** Lib now only works with angular 11 + projects)
- Update link component and add new options
- Badge update (new size prop)

## 📦 0.4.0 - 2021-10-28

### 🚀 Added

- Add tab and tabs component
- Add badge component
- Fix checkbox not correctly working with custom content
- Fix lib not working in applications using Lazy Loading (potential **Breaking change**, BrowseAnimationModule should be
  imported in AppModule). Refer to Readme for more details.

## 📦 0.3.0 - 2021-10-05

### 🚀 Added

- Make lib work with angular 12 and update readme (potential **Breaking change**, tsconfig should be updated and some
  import may need to be updated). Refer to Readme for more details.
- Fix packages version
- Fix switch dark theme
- Fix progress dark theme
- Fix spinner dark theme

## 📦 0.2.1 - 2021-09-01

### 🚀 Added

- Add Switch component

## 📦 0.2.0 - 2021-07-12

### 🚀 Added

- Add Radio and Radio group component
- Add Link component
- Add icon support for buttons
- Add tertiary button

## 📦 0.1.0 - 2021-06-03

### 🚀 Added

- Add Checkbox component
- Add Spinner component
- Add material UI icon
- Add engie icon
- Add Progress

### 🐛 Fixed

- Toggle: Remove additional padding when left or right label are not set
- Toggle: Improve label alignment

## 📦 0.1.0-alpha.6 - 2021-05-04

### 🚀 Added

- Add Toggle component

## 📦 0.1.0-alpha.5 - 2021-04-08

### 🖍 Changed

- Updated Fluid package dependency

## 📦 0.1.0-alpha.4 - 2021-04-02

### 🖍 Changed

- Update fluid-design-system package

## 📦 0.1.0-alpha.3 - 2021-03-22

### 🖍 Changed

- Update fluid-design-system package

## 📦 0.1.0-alpha.2

### 🚀 Added

- Initialize Angular Lib
- Button component