@lucca-front/ng 22.0.5 → 22.0.6-rc.1

package/llms/references/components/tooltip/tooltip.md

@@ -0,0 +1,217 @@
+# tooltip
+
+## Import
+
+```typescript
+import { LuTooltipPanelComponent, LuTooltipTriggerDirective } from '@lucca-front/ng/tooltip';
+```
+
+## API Reference
+
+### LuTooltipPanelComponent (component)
+
+**Selectors:** `lu-tooltip-panel`, `pr-tooltip-panel`
+
+### LuTooltipTriggerDirective (directive)
+
+**Selectors:** `[luTooltip]`, `[prTooltip]`
+
+**exportAs:** `luTooltip`
+
+#### Inputs
+
+| Property | Binding name | Type | Default | Required | Transform | Description |
+|----------|-------------|------|---------|----------|-----------|-------------|
+| `luTooltipInput` | `luTooltip` | `string \| SafeHtml` | `''` | — | — | — |
+| `prTooltipInput` | `prTooltip` | `string \| SafeHtml` | `''` | — | — | — |
+| `luTooltipEnterDelay` | `luTooltipEnterDelay` | `number` | `300` | — | `numberAttribute` | Délai d’apparition du tooltip au survol (en ms). |
+| `prTooltipEnterDelay` | `prTooltipEnterDelay` | `number` | `300` | — | `numberAttribute` | — |
+| `luTooltipLeaveDelay` | `luTooltipLeaveDelay` | `number` | `100` | — | `numberAttribute` | Délai de disparition du tooltip après la fin du survol (en ms). |
+| `prTooltipLeaveDelay` | `prTooltipLeaveDelay` | `number` | `100` | — | `numberAttribute` | — |
+| `luTooltipDisabled` | `luTooltipDisabled` | `boolean` | `false` | — | `booleanAttribute` | Désactive le tooltip. |
+| `prTooltipDisabled` | `prTooltipDisabled` | `boolean` | `false` | — | `booleanAttribute` | — |
+| `luTooltipOnlyForDisplay` | `luTooltipOnlyForDisplay` | `boolean` | `false` | — | `booleanAttribute` | Affiche un tooltip non restituée par les lecteurs d’écran. À utiliser si la réstitution est déjà portée par l’élément dé… |
+| `prTooltipOnlyForDisplay` | `prTooltipOnlyForDisplay` | `boolean` | `false` | — | `booleanAttribute` | — |
+| `luTooltipPosition` | `luTooltipPosition` | `'above' \| 'below' \| 'before' \| 'after'` | `'above'` | — | — | Position du tooltip par rapport à son élément déclencheur. |
+| `prTooltipPosition` | `prTooltipPosition` | `'above' \| 'below' \| 'before' \| 'after'` | `'above'` | — | — | — |
+| `luTooltipWhenEllipsisInput` | `luTooltipWhenEllipsis` | `boolean` | `false` | — | `booleanAttribute` | N’affiche le tooltip que lorsque le contenu de l’élément déclencheur est tronqué par une ellipse. |
+| `prTooltipWhenEllipsisInput` | `prTooltipWhenEllipsis` | `boolean` | `false` | — | `booleanAttribute` | — |
+| `luTooltipAnchor` | `luTooltipAnchor` | `FlexibleConnectedPositionStrategyOrigin \| LuTooltipAnchorRef \| null \| undefined` | `this.#host` | — | — | — |
+| `prTooltipAnchor` | `prTooltipAnchor` | `FlexibleConnectedPositionStrategyOrigin \| LuTooltipAnchorRef \| null \| undefined` | `this.#host` | — | — | — |
+| `id` | `id` | `string` | ``${this.#host.nativeElement.tagName.toLowerCase()}-tooltip-${nextId++}`` | — | — | — |
+
+### Modules dépréciés
+
+- ⚠️ `LuTooltipTriggerModule` — use `LuTooltipTriggerDirective` instead
+- ⚠️ `LuTooltipModule` — use `LuTooltipTriggerDirective, LuTooltipPanelComponent` instead
+
+## Related files
+
+- 📝 [Code & implementation](./tooltip.component.md)
+- 🎨 [Design guidelines](https://lucca-front.lucca.io/v22.0.6-rc.1/storybook/llms/references/components/tooltip/tooltip.design.md)
+- 🎯 [Figma design tokens](https://lucca-front.lucca.io/v22.0.6-rc.1/storybook/llms/references/components/tooltip/tooltip.figma.md)
+- 📖 [Storybook documentation](https://lucca-front.lucca.io/v22.0.0/storybook/?path=/docs/documentation-overlays-tooltip-html-css--docs)
+
+## Changelog
+
+> Diff structurel de l'API (selectors, inputs, outputs, models) entre versions stables, depuis `v21.4.2` jusqu'à `v22.0.0`. Les versions sans changement d'API sont omises.
+
+### 22.0.0
+
+`LuTooltipPanelComponent` :
+  + selector `pr-tooltip-panel`
+`LuTooltipTriggerDirective` :
+  + selector `[prTooltip]`
+  + `prTooltip` : string | SafeHtml
+  + `prTooltipEnterDelay` : number
+  + `prTooltipLeaveDelay` : number
+  + `prTooltipDisabled` : boolean
+  + `prTooltipOnlyForDisplay` : boolean
+  + `prTooltipPosition` : 'above' | 'below' | 'before' | 'after'
+  + `prTooltipWhenEllipsis` : boolean
+  + `prTooltipAnchor` : FlexibleConnectedPositionStrategyOrigin | LuTooltipAnchorRef | null | undefined
+  ~ `luTooltipPosition` : LuPopoverPosition → 'above' | 'below' | 'before' | 'after'
+
+### Notes de release (ZeroHeight)
+
+#### 21.3.1
+
+##### Fixed
+
+- Connected overlays are kept out of the push panel zone, so a tooltip is no longer clipped by it.
+
+#### 21.2.5
+
+##### Added
+
+- The tooltip can now be closed with the `Escape` key.
+
+##### Fixed
+
+- Anchor reference resolution and the condition used to display the tooltip.
+
+#### 21.2.4
+
+##### Changed
+
+- Ellipsis detection is batched with `afterRenderEffect` and no longer re-measures on scroll.
+
+#### 21.1.4
+
+##### Fixed
+
+- Precision of the ellipsis detection.
+
+#### 21.1.3
+
+##### Fixed
+
+- Memory leaks and per-cycle layout thrashing of the trigger directive.
+
+#### 21.1.2
+
+##### Fixed
+
+- Reverted the rendering change shipped in `21.1.1`, which broke some tooltips.
+
+#### 21.1.0
+
+##### Changed
+
+- `luTooltip` and `luTooltipWhenEllipsis` are now signal-based inputs.
+
+#### 21.0.4
+
+##### Fixed
+
+- Ellipsis detection is updated when the content changes.
+
+#### 21.0.0
+
+##### Deprecated
+
+- `LuTooltipModule` — import the standalone `LuTooltipTriggerDirective` and `LuTooltipPanelComponent` instead.
+
+##### Fixed
+
+- Generated tooltip `id` no longer collides between triggers.
+
+#### 20.3.2
+
+##### Changed
+
+- Tooltip text is no longer hyphenated.
+
+#### 20.1.3
+
+##### Fixed
+
+- Overflow of long tooltip contents.
+
+#### 20.1.1
+
+##### Added
+
+- `role="button"` is set on the trigger when it is required for accessibility.
+
+#### 20.1.0
+
+##### Added
+
+- `luTooltipAnchor` input to attach the tooltip to an external host element.
+
+#### 19.1.2
+
+##### Fixed
+
+- Freeze caused by tooltips measuring their content too often.
+
+#### 18.3.4
+
+##### Fixed
+
+- Missing `tabindex` on the trigger when the ellipsis logic is not used.
+
+#### 18.3.2
+
+##### Added
+
+- Real time update of the tooltip content.
+
+##### Fixed
+
+- Excessive reflows caused by the ellipsis detection.
+
+#### 18.2.4
+
+##### Added
+
+- The directive is exported as `luTooltip`.
+
+#### 18.2.1
+
+##### Fixed
+
+- Ellipsis calculation.
+
+#### 18.2.0
+
+##### Added
+
+- `luTooltipOnlyForDisplay` input for tooltips that must not be focusable.
+
+##### Fixed
+
+- Native Safari tooltip is no longer displayed on top of the component's one.
+
+#### 18.1.1
+
+##### Fixed
+
+- The tooltip is removed when its trigger is destroyed.
+
+#### 18.1.0
+
+##### Changed
+
+- Trigger directive reworked around a dedicated ellipsis detection system.

package/llms/references/components/treeselect/treeselect.component.md

@@ -0,0 +1,62 @@
+# treeselect — Code & Implementation
+
+📖 [Storybook documentation](https://lucca-front.lucca.io/v22.0.0/storybook/?path=/docs/documentation-forms-treeselect--docs)
+
+## Angular
+
+### Select
+
+```js
+import { provideHttpClient } from '@angular/common/http';
+import { LOCALE_ID } from '@angular/core';
+import { provideAnimations } from '@angular/platform-browser/animations';
+import { LuCoreSelectDepartmentsDirective } from '@lucca-front/ng/core-select/department';
+import { DividerComponent } from '@lucca-front/ng/divider';
+import { FilterBarComponent, FilterPillComponent } from '@lucca-front/ng/filter-pills';
+import { FormFieldComponent } from '@lucca-front/ng/form-field';
+import { LuMultiSelectInputComponent } from '@lucca-front/ng/multi-select';
+import { LuSimpleSelectInputComponent } from '@lucca-front/ng/simple-select';
+import { TreeSelectDirective } from '@lucca-front/ng/tree-select';
+```
+
+```html
+<lu-form-field label="Basic tree multi-select">
+	<lu-multi-select [treeSelect]="groupingFn" [options]="allLegumes" placeholder="Multi-select tree" clearable />
+</lu-form-field>
+<br />
+```
+
+```html
+<lu-form-field label="Basic tree multi-select">
+	<lu-multi-select [treeSelect]="groupingFn" [options]="allLegumes" placeholder="Multi-select tree" />
+</lu-form-field>
+<br />
+<lu-form-field label="Basic tree simple-select">
+	<lu-simple-select [treeSelect]="groupingFn" [options]="allLegumes" placeholder="Simple-select tree" />
+</lu-form-field>
+<br />
+<lu-divider />
+<lu-form-field label="Department multi-select">
+	<lu-multi-select departments placeholder="Multi-select tree" />
+</lu-form-field>
+<br />
+<lu-form-field label="Department simple-select">
+	<lu-simple-select departments placeholder="Simple-select tree" />
+</lu-form-field>
+<br />
+<lu-divider />
+<lu-filter-bar>
+	<lu-filter-pill label="Légumes">
+		<lu-multi-select filterPillLabelPlural="légumes" [treeSelect]="groupingFn" [options]="allLegumes" />
+	</lu-filter-pill>
+	<lu-filter-pill label="Départements">
+		<lu-multi-select departments filterPillLabelPlural="départements" />
+	</lu-filter-pill>
+	<lu-filter-pill label="Légume">
+		<lu-simple-select [treeSelect]="groupingFn" [options]="allLegumes" />
+	</lu-filter-pill>
+	<lu-filter-pill label="Département">
+		<lu-simple-select departments />
+	</lu-filter-pill>
+</lu-filter-bar>
+```

package/llms/references/components/treeselect/treeselect.md

@@ -0,0 +1,58 @@
+# treeselect
+
+## Import
+
+```typescript
+import { TreeSelectDirective, TreeBranchComponent } from '@lucca-front/ng/tree-select';
+```
+
+## API Reference
+
+### TreeSelectDirective (directive)
+
+**Selectors:** `lu-simple-select[treeSelect]`, `lu-multi-select[treeSelect]`
+
+#### Inputs
+
+| Property | Binding name | Type | Default | Required | Transform | Description |
+|----------|-------------|------|---------|----------|-----------|-------------|
+| `groupingFnInput` | `treeSelect` | `TreeGroupingFn<T>` | — | ✅ | — | — |
+
+### TreeBranchComponent (component)
+
+**Selector:** `lu-tree-branch`
+
+#### Inputs
+
+| Property | Binding name | Type | Default | Required | Transform | Description |
+|----------|-------------|------|---------|----------|-----------|-------------|
+| `branch` | `branch` | `TreeNode<T>` | — | ✅ | — | — |
+| `optionTpl` | `optionTpl` | `TemplateRef<LuOptionContext<T>> \| Type<unknown> \| undefined` | — | ✅ | — | — |
+| `optionIndex` | `optionIndex` | `unknown` | — | ✅ | — | — |
+| `optionComparer` | `optionComparer` | `LuOptionComparer<T>` | — | ✅ | — | — |
+| `selectedOptions` | `selectedOptions` | `T[]` | `[]` | — | — | — |
+| `simpleMode` | `simpleMode` | `boolean` | `false` | — | `luBooleanAttribute` | — |
+
+#### Outputs
+
+| Property | Binding name | Type | Notes |
+|----------|-------------|------|-------|
+| `toggleOne` | `toggleOne` | `T` | — |
+| `selectMany` | `selectMany` | `T[]` | — |
+| `unselectMany` | `unselectMany` | `T[]` | — |
+
+## Related files
+
+- 📝 [Code & implementation](./treeselect.component.md)
+
+- 📖 [Storybook documentation](https://lucca-front.lucca.io/v22.0.0/storybook/?path=/docs/documentation-forms-treeselect--docs)
+
+## Changelog
+
+> Diff structurel de l'API (selectors, inputs, outputs, models) entre versions stables, depuis `v21.4.2` jusqu'à `v22.0.0`. Les versions sans changement d'API sont omises.
+
+### 22.0.0
+
+`TreeBranchComponent` :
+  - `depth`
+  ~ `simpleMode` : transform booleanAttribute → luBooleanAttribute

package/llms/references/components/user-select/user-select.md

@@ -0,0 +1,52 @@
+# user-select
+
+## Import
+
+```typescript
+import { LuUserSelectInputComponent } from '@lucca-front/ng/user';
+```
+
+## API Reference
+
+### LuUserSelectInputComponent (component)
+
+**Selector:** `lu-user-select`
+
+> ⚠️ **Déprécié** : prefer SimpleSelect or MultipleSelect with luCustomUsers directive
+
+#### Inputs
+
+| Property | Binding name | Type | Default | Required | Transform | Description |
+|----------|-------------|------|---------|----------|-----------|-------------|
+| `intl` | `intl` | `unknown` | — | — | — | — |
+| `fields` | `fields` | `string` | — | — | — | — |
+| `filters` | `filters` | `string[]` | — | — | — | — |
+| `orderBy` | `orderBy` | `string` | — | — | — | — |
+| `appInstanceId` | `appInstanceId` | `number \| string` | — | — | — | — |
+| `operations` | `operations` | `number[]` | — | — | — | — |
+| `enableFormerEmployees` | `enableFormerEmployees` | `boolean` | `false` | — | `booleanAttribute` | — |
+| `disablePrincipal` | `disablePrincipal` | `boolean` | `false` | — | `booleanAttribute` | — |
+
+### Injection tokens
+
+| Token | Type | Description |
+|-------|------|-------------|
+| `LU_USER_SELECT_INPUT_TRANSLATIONS` | `unknown` | — |
+
+### Modules dépréciés
+
+- ⚠️ `LuUserSelectModule` — prefer SimpleSelect or MultipleSelect with luCustomUsers directive
+- ⚠️ `LuUserSelectInputModule` — prefer SimpleSelect or MultipleSelect with luCustomUsers directive
+- ⚠️ `LuUserModule` — use `LuUserDisplayPipe, LuUserPictureComponent, LuUserTileComponent` instead
+
+## Related files
+
+## Changelog
+
+> Diff structurel de l'API (selectors, inputs, outputs, models) entre versions stables, depuis `v21.4.2` jusqu'à `v22.0.0`. Les versions sans changement d'API sont omises.
+
+### 22.0.0
+
+- `placeholder`
+~ `enableFormerEmployees` : transform ∅ → booleanAttribute
+~ `disablePrincipal` : transform ∅ → booleanAttribute

package/llms/references/components/userpopover/userpopover.component.md

@@ -0,0 +1,50 @@
+# userpopover — Code & Implementation
+
+📖 [Storybook documentation](https://lucca-front.lucca.io/v22.0.0/storybook/?path=/docs/documentation-users-display-userpopover--docs)
+
+## Angular
+
+### Utilisation
+
+Pour utiliser la UserPopover, il vous suffit d'utiliser la directive `[luUserPopover]` et de lui fournir un LuUser
+
+Note : l'import du composant se fait seulement à son utilisation. Le style lié à `userPopover_trigger` peut donc ne pas être chargé à l'initialisation de la page. Dans ce cas, il est possible de remplacer cette classe par les utilitaires `pr-u-buttonReset pr-u-inlineSizeFitContent pr-u-borderRadiusDefault` ou `pr-u-buttonReset pr-u-inlineSizeFitContent pr-u-borderRadiusFull`.
+
+#### luEmployeeCard
+
+Permet de fournir un utilisateur à la UserPopover.
+
+#### luUserPopoverEnterDelay
+
+Permet de définir le délai avant l'affichage du UserPopover en millisecondes. Par défaut 300
+
+#### luUserPopoverLeaveDelay
+
+Permet de définir le délai avant la disparition du UserPopover en millisecondes. Par défaut 100
+
+#### luUserPopoverDisabled
+
+Permet de désactiver le UserPopover
+
+### Store et Services
+
+Le User popover est fournit avec un service qui gère la récupération des données, mais aussi qui stocke les informations des utilisateurs déjà récupérés, y compris les images.
+Ce service est un singleton et est donc partagé entre tous les UserPopover de l'application.
+
+Il est possible de fournir un autre service qui implémente l'interface `ILuUserPopoverStore` pour gérer la récupération des données et le stockage des informations.
+
+### Popover
+
+```js
+import { provideHttpClient } from '@angular/common/http';
+import { provideAnimations } from '@angular/platform-browser/animations';
+import { ButtonComponent } from '@lucca-front/ng/button';
+import { LuUserDisplayModule } from '@lucca-front/ng/user';
+import { LuUserPopoverDirective } from '@lucca-front/ng/user-popover';
+```
+
+```html
+<button type="button" class="userPopover_trigger" [luUserPopover]="finn" translate="no">
+	{{ finn | luUserDisplay: "lf" }}
+</button>
+```

package/llms/references/components/userpopover/userpopover.md

@@ -0,0 +1,136 @@
+# userpopover
+
+## Import
+
+```typescript
+import { LuUserPopoverComponent, LuUserPopoverDirective } from '@lucca-front/ng/user-popover';
+```
+
+## API Reference
+
+### LuUserPopoverComponent (component)
+
+**Selector:** `lu-user-popover-content`
+
+#### Inputs
+
+| Property | Binding name | Type | Default | Required | Transform | Description |
+|----------|-------------|------|---------|----------|-----------|-------------|
+| `intl` | `intl` | `unknown` | — | — | — | — |
+
+### LuUserPopoverDirective (directive)
+
+**Selector:** `[luUserPopover]`
+
+**exportAs:** `LuUserPopoverDirective`
+
+#### Inputs
+
+| Property | Binding name | Type | Default | Required | Transform | Description |
+|----------|-------------|------|---------|----------|-----------|-------------|
+| `intl` | `intl` | `unknown` | — | — | — | — |
+| `luPopover2` | `luPopover2` | `TemplateRef<unknown> \| Type<unknown>` | — | — | — | — |
+| `luPopoverPosition` | `luPopoverPosition` | `PopoverPosition \| null` | `null` | — | — | — |
+| `luPopoverMaxBlockSize` | `luPopoverMaxBlockSize` | `string \| null` | `null` | — | — | — |
+| `luPopoverMaxInlineSize` | `luPopoverMaxInlineSize` | `string \| null` | `null` | — | — | — |
+| `overlayScrollStrategy` | `overlayScrollStrategy` | `'reposition' \| 'block' \| 'close'` | `'reposition'` | — | — | — |
+| `luPopoverDisabledInput` | `luPopoverDisabled` | `boolean` | `false` | — | `luBooleanAttribute` | — |
+| `customPositionsInput` | `customPositions` | `ConnectionPositionPair[] \| null` | `null` | — | — | — |
+| `luPopoverNoCloseButtonInput` | `luPopoverNoCloseButton` | `boolean` | `false` | — | `luBooleanAttribute` | — |
+| `luPopoverAnchor` | `luPopoverAnchor` | `FlexibleConnectedPositionStrategyOrigin` | `this.elementRef` | — | — | — |
+| `luPopoverIgnoredOutsidePointerTargets` | `luPopoverIgnoredOutsidePointerTargets` | `HTMLElement \| HTMLElement[] \| null` | `null` | — | — | — |
+| `luPopoverOpenDelay` | `luPopoverOpenDelay` | `number` | `300` | — | `luNumberAttribute` | — |
+| `luPopoverCloseDelay` | `luPopoverCloseDelay` | `number` | `100` | — | `luNumberAttribute` | — |
+| `luUserPopover` | `luUserPopover` | `ILuUser` | — | ✅ | — | — |
+| `luUserPopoverDisabled` | `luUserPopoverDisabled` | `boolean` | `false` | — | — | — |
+
+#### Outputs
+
+| Property | Binding name | Type | Notes |
+|----------|-------------|------|-------|
+| `luPopoverClosed` | `luPopoverClosed` | `void` | — |
+| `luPopoverOpened` | `luPopoverOpened` | `void` | — |
+
+#### Models (two-way binding)
+
+| Property | Type | Required | Notes |
+|----------|------|----------|-------|
+| `luPopoverTrigger` | `'click' \| 'click+hover' \| 'hover+focus'` | — | — |
+
+### Providers
+
+| Fonction | Signature | Description |
+|----------|-----------|-------------|
+| `provideLuUserPopover` | `()` | ⚠️ **Déprécié** : no longer needed as user popover uses `luPopover2`  |
+
+### Injection tokens
+
+| Token | Type | Description |
+|-------|------|-------------|
+| `LU_POPUP_EMPLOYEE_TRANSLATIONS` | `unknown` | — |
+| `LU_USER_POPOVER_USER` | `Signal<ILuUser>` | — |
+| `USER_POPOVER_IS_ACTIVATED` | `Observable<boolean>` | ⚠️ **Déprécié** : no longer needed as popover is always activated  |
+
+## Related files
+
+- 📝 [Code & implementation](./userpopover.component.md)
+- 🎨 [Design guidelines](https://lucca-front.lucca.io/v22.0.6-rc.1/storybook/llms/references/components/userpopover/userpopover.design.md)
+- 🎯 [Figma design tokens](https://lucca-front.lucca.io/v22.0.6-rc.1/storybook/llms/references/components/userpopover/userpopover.figma.md)
+- 📖 [Storybook documentation](https://lucca-front.lucca.io/v22.0.0/storybook/?path=/docs/documentation-users-display-userpopover--docs)
+
+## Changelog
+
+> Diff structurel de l'API (selectors, inputs, outputs, models) entre versions stables, depuis `v21.4.2` jusqu'à `v22.0.0`. Les versions sans changement d'API sont omises.
+
+### 22.0.0
+
+`LuUserPopoverDirective` :
+  + `luPopoverIgnoredOutsidePointerTargets` : HTMLElement | HTMLElement[] | null
+  ~ `luPopoverDisabled` : transform booleanAttribute → luBooleanAttribute
+  ~ `customPositions` : unknown → ConnectionPositionPair[] | null, défaut ∅ → null
+  ~ `luPopoverNoCloseButton` : transform booleanAttribute → luBooleanAttribute
+  ~ `luPopoverOpenDelay` : transform ∅ → luNumberAttribute
+  ~ `luPopoverCloseDelay` : transform ∅ → luNumberAttribute
+  ~ `luUserPopoverDisabled` : défaut ∅ → false
+
+### Notes de release (ZeroHeight)
+
+#### 21.1.0
+
+##### Changed
+
+- `intl` input now accepts partial overrides that are merged with the default translations.
+
+##### Fixed
+
+- Explicit type on the `luUserPopover` signal input.
+
+#### 20.3.0
+
+##### Added
+
+- Skeleton displayed while the user data is loading.
+
+#### 20.1.1
+
+##### Added
+
+- Keyboard navigation inside the popover content.
+
+#### 20.1.0
+
+##### Added
+
+- `[luUserPopover]` directive and `lu-user-popover-content` component, with the `luUserPopover` and `intl` inputs, plus the `LU_USER_POPOVER_USER` and `USER_POPOVER_IS_ACTIVATED` injection tokens.
+- Loader displayed while the user is being fetched.
+
+##### Changed
+
+- The popover is now hosted by the `popover2` directives.
+
+#### 18.1.0
+
+##### Changed
+
+- Dates are displayed with the short format instead of the long one.
+- Avatar size variants updated.