@agorapulse/ui-components 22.0.28 → 22.0.30

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@agorapulse/ui-components",
   "description": "Agorapulse UI Components Library",
-  "version": "22.0.28",
+  "version": "22.0.30",
   "author": "Benoit Hediard",
   "repository": {
     "type": "git",

package/types/agorapulse-ui-components-filter-dropdown.d.ts

@@ -184,6 +184,7 @@ declare class FilterState {
     private readonly _draft;
     private readonly _baseline;
     private readonly _expanded;
+    private readonly _openPanelKeys;
     readonly groups: _angular_core.Signal<FilterDropdownGroup[]>;
     readonly draft: _angular_core.Signal<FilterDropdownOutput>;
     readonly expanded: _angular_core.Signal<Record<string, boolean>>;
@@ -194,6 +195,8 @@ declare class FilterState {
     readonly buttonsDisabled: _angular_core.Signal<boolean>;
     /** Clear is gated on "is there anything to clear", not on dirty state. */
     readonly clearDisabled: _angular_core.Signal<boolean>;
+    /** Whether a leaf has a panel of its own showing: the dropdown must not close under it. */
+    readonly nestedPanelOpen: _angular_core.Signal<boolean>;
     /** Refresh the structural schema and reconcile the value keyspace (add empty / drop removed). */
     setSchema(groups: FilterDropdownGroup[]): void;
     /** Seed the draft from an external value, projected onto the current keyspace. Echo-gated, silent. */
@@ -216,6 +219,8 @@ declare class FilterState {
      * the edge where the DOM event happens.
      */
     updateValue(key: string, value: FilterDropdownValue): void;
+    /** Call whenever a leaf's panel opens or closes. Keyed by leaf, so a repeated open or close is harmless. */
+    setNestedPanelOpen(key: string, open: boolean): void;
     /** Whether a group is currently expanded. Defaults to collapsed for unknown keys. */
     isExpanded(key: string): boolean;
     /** Toggle a group's expand/collapse state. Updates internal state only — the config is never mutated. */
@@ -262,8 +267,8 @@ declare class FilterDropdownComponent implements DropdownOverlay {
     savedValue: _angular_core.InputSignal<FilterDropdownOutput | undefined>;
     /** Whether the filter needs the apply button to be clicked for applyFilters to emit  */
     needApplyButton: _angular_core.InputSignal<boolean>;
-    /** Whether to offer a cancel button that discards the unapplied draft and closes the dropdown. */
-    needCancelButton: _angular_core.InputSignal<boolean>;
+    /** Whether to offer a clear button that empties every group's selection. */
+    needClearButton: _angular_core.InputSignal<boolean>;
     /** Whether the filter group can be closed (collapsed) by the user. If false, the group will always be expanded and the user won't see a toggle button. */
     closable: _angular_core.InputSignal<boolean>;
     /**
@@ -291,7 +296,6 @@ declare class FilterDropdownComponent implements DropdownOverlay {
     resetFilterText: _angular_core.InputSignal<string>;
     applyFiltersText: _angular_core.InputSignal<string>;
     clearFilterText: _angular_core.InputSignal<string>;
-    cancelFilterText: _angular_core.InputSignal<string>;
     /** Emits when the dropdown menu is opened */
     opened: _angular_core.OutputEmitterRef<void>;
     /** Emits when the dropdown menu is closed */
@@ -313,9 +317,14 @@ declare class FilterDropdownComponent implements DropdownOverlay {
     /** Event emitted when a group with locked feature is clicked */
     filterDropdownGroupLockedClicked: _angular_core.OutputEmitterRef<FilterDropdownGroup>;
     readonly isOpen: _angular_core.Signal<boolean>;
+    private panelOpenAtGestureStart;
     savePresetsDropdownItems: _angular_core.Signal<ActionDropdownItem[]>;
     /** Opens the dropdown menu at the specified trigger element */
     open(triggerElement?: HTMLElement): void;
+    /** A leaf's panel closes on the pointerdown or keydown that dismisses it, so snapshot the flag then: by dismissal it reads false. */
+    private trackDismissalGestures;
+    /** Backdrop click / Escape: close, unless the gesture was a leaf panel's own dismissal. */
+    private dismiss;
     /** Closes the dropdown menu and cleans up overlay resources */
     close(): void;
     /** Toggles the dropdown menu open or closed state */
@@ -328,8 +337,6 @@ declare class FilterDropdownComponent implements DropdownOverlay {
     onLeafEdit(edit: FilterValueEdit): void;
     /** Manual-apply commit (Apply button; only rendered when `needApplyButton`). Applying also dismisses the panel. */
     onApplyFilters(): void;
-    /** Dismiss without applying: the draft goes back to the last committed value, so reopening shows no leftover edits. */
-    onCancelFilters(): void;
     onClearFilters(): void;
     onResetFilters(): void;
     /** In auto-apply mode, push the current draft to the consumer. The single place clear/reset/leaf-edit funnel through. */
@@ -338,7 +345,7 @@ declare class FilterDropdownComponent implements DropdownOverlay {
     onUpdatePresets(): void;
     protected onActionDropdownItemClick(item: ActionDropdownItem): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<FilterDropdownComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FilterDropdownComponent, "ap-filter-dropdown", never, { "groups": { "alias": "groups"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "savedValue": { "alias": "savedValue"; "required": false; "isSignal": true; }; "needApplyButton": { "alias": "needApplyButton"; "required": false; "isSignal": true; }; "needCancelButton": { "alias": "needCancelButton"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "expandOnOpen": { "alias": "expandOnOpen"; "required": false; "isSignal": true; }; "presetsFeatureLocked": { "alias": "presetsFeatureLocked"; "required": false; "isSignal": true; }; "savePresetsMode": { "alias": "savePresetsMode"; "required": false; "isSignal": true; }; "editingPresetsMode": { "alias": "editingPresetsMode"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "defaultPosition": { "alias": "defaultPosition"; "required": false; "isSignal": true; }; "panelClass": { "alias": "panelClass"; "required": false; "isSignal": true; }; "saveNewPresetsText": { "alias": "saveNewPresetsText"; "required": false; "isSignal": true; }; "saveAsNewPresetText": { "alias": "saveAsNewPresetText"; "required": false; "isSignal": true; }; "savePresetText": { "alias": "savePresetText"; "required": false; "isSignal": true; }; "updateExistingPresetText": { "alias": "updateExistingPresetText"; "required": false; "isSignal": true; }; "resetFilterText": { "alias": "resetFilterText"; "required": false; "isSignal": true; }; "applyFiltersText": { "alias": "applyFiltersText"; "required": false; "isSignal": true; }; "clearFilterText": { "alias": "clearFilterText"; "required": false; "isSignal": true; }; "cancelFilterText": { "alias": "cancelFilterText"; "required": false; "isSignal": true; }; }, { "opened": "opened"; "closed": "closed"; "presetsLockedClicked": "presetsLockedClicked"; "saveNewPresets": "saveNewPresets"; "updatePresets": "updatePresets"; "applyFilters": "applyFilters"; "clearFilters": "clearFilters"; "resetFilters": "resetFilters"; "lockedFeatureClicked": "lockedFeatureClicked"; "filterDropdownGroupLockedClicked": "filterDropdownGroupLockedClicked"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FilterDropdownComponent, "ap-filter-dropdown", never, { "groups": { "alias": "groups"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "savedValue": { "alias": "savedValue"; "required": false; "isSignal": true; }; "needApplyButton": { "alias": "needApplyButton"; "required": false; "isSignal": true; }; "needClearButton": { "alias": "needClearButton"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "expandOnOpen": { "alias": "expandOnOpen"; "required": false; "isSignal": true; }; "presetsFeatureLocked": { "alias": "presetsFeatureLocked"; "required": false; "isSignal": true; }; "savePresetsMode": { "alias": "savePresetsMode"; "required": false; "isSignal": true; }; "editingPresetsMode": { "alias": "editingPresetsMode"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "defaultPosition": { "alias": "defaultPosition"; "required": false; "isSignal": true; }; "panelClass": { "alias": "panelClass"; "required": false; "isSignal": true; }; "saveNewPresetsText": { "alias": "saveNewPresetsText"; "required": false; "isSignal": true; }; "saveAsNewPresetText": { "alias": "saveAsNewPresetText"; "required": false; "isSignal": true; }; "savePresetText": { "alias": "savePresetText"; "required": false; "isSignal": true; }; "updateExistingPresetText": { "alias": "updateExistingPresetText"; "required": false; "isSignal": true; }; "resetFilterText": { "alias": "resetFilterText"; "required": false; "isSignal": true; }; "applyFiltersText": { "alias": "applyFiltersText"; "required": false; "isSignal": true; }; "clearFilterText": { "alias": "clearFilterText"; "required": false; "isSignal": true; }; }, { "opened": "opened"; "closed": "closed"; "presetsLockedClicked": "presetsLockedClicked"; "saveNewPresets": "saveNewPresets"; "updatePresets": "updatePresets"; "applyFilters": "applyFilters"; "clearFilters": "clearFilters"; "resetFilters": "resetFilters"; "lockedFeatureClicked": "lockedFeatureClicked"; "filterDropdownGroupLockedClicked": "filterDropdownGroupLockedClicked"; }, never, never, true, never>;
 }
 
 declare class FilterDropdownButtonComponent {
@@ -356,8 +363,8 @@ declare class FilterDropdownButtonComponent {
     savedValue: _angular_core.InputSignal<FilterDropdownOutput | undefined>;
     /** Whether the filter needs the apply button to be clicked for applyFilters to emit  */
     needApplyButton: _angular_core.InputSignal<boolean>;
-    /** Whether to offer a cancel button that discards the unapplied draft and closes the dropdown. */
-    needCancelButton: _angular_core.InputSignal<boolean>;
+    /** Whether to offer a clear button that empties every group's selection. */
+    needClearButton: _angular_core.InputSignal<boolean>;
     /** Whether the filter group can be closed (collapsed) by the user. If false, the group will always be expanded and the user won't see a toggle button. */
     closable: _angular_core.InputSignal<boolean>;
     /** Policy deciding which groups start expanded on each open ('collapse-empty' | predicate). Omitted → persist. */
@@ -383,7 +390,6 @@ declare class FilterDropdownButtonComponent {
     resetFilterText: _angular_core.InputSignal<string>;
     applyFiltersText: _angular_core.InputSignal<string>;
     clearFilterText: _angular_core.InputSignal<string>;
-    cancelFilterText: _angular_core.InputSignal<string>;
     /** Emits when the dropdown menu is opened */
     opened: _angular_core.OutputEmitterRef<void>;
     /** Emits when the dropdown menu is closed */
@@ -405,7 +411,7 @@ declare class FilterDropdownButtonComponent {
     /** Event emitted when a group with locked feature is clicked */
     filterDropdownGroupLockedClicked: _angular_core.OutputEmitterRef<FilterDropdownGroup>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<FilterDropdownButtonComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FilterDropdownButtonComponent, "ap-filter-dropdown-button", never, { "buttonFilterText": { "alias": "buttonFilterText"; "required": false; "isSignal": true; }; "groups": { "alias": "groups"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "savedValue": { "alias": "savedValue"; "required": false; "isSignal": true; }; "needApplyButton": { "alias": "needApplyButton"; "required": false; "isSignal": true; }; "needCancelButton": { "alias": "needCancelButton"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "expandOnOpen": { "alias": "expandOnOpen"; "required": false; "isSignal": true; }; "presetsFeatureLocked": { "alias": "presetsFeatureLocked"; "required": false; "isSignal": true; }; "savePresetsMode": { "alias": "savePresetsMode"; "required": false; "isSignal": true; }; "editingPresetsMode": { "alias": "editingPresetsMode"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "defaultPosition": { "alias": "defaultPosition"; "required": false; "isSignal": true; }; "panelClass": { "alias": "panelClass"; "required": false; "isSignal": true; }; "saveNewPresetsText": { "alias": "saveNewPresetsText"; "required": false; "isSignal": true; }; "saveAsNewPresetText": { "alias": "saveAsNewPresetText"; "required": false; "isSignal": true; }; "savePresetText": { "alias": "savePresetText"; "required": false; "isSignal": true; }; "updateExistingPresetText": { "alias": "updateExistingPresetText"; "required": false; "isSignal": true; }; "resetFilterText": { "alias": "resetFilterText"; "required": false; "isSignal": true; }; "applyFiltersText": { "alias": "applyFiltersText"; "required": false; "isSignal": true; }; "clearFilterText": { "alias": "clearFilterText"; "required": false; "isSignal": true; }; "cancelFilterText": { "alias": "cancelFilterText"; "required": false; "isSignal": true; }; }, { "opened": "opened"; "closed": "closed"; "presetsLockedClicked": "presetsLockedClicked"; "saveNewPresets": "saveNewPresets"; "updatePresets": "updatePresets"; "applyFilters": "applyFilters"; "clearFilters": "clearFilters"; "resetFilters": "resetFilters"; "lockedFeatureClicked": "lockedFeatureClicked"; "filterDropdownGroupLockedClicked": "filterDropdownGroupLockedClicked"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FilterDropdownButtonComponent, "ap-filter-dropdown-button", never, { "buttonFilterText": { "alias": "buttonFilterText"; "required": false; "isSignal": true; }; "groups": { "alias": "groups"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "savedValue": { "alias": "savedValue"; "required": false; "isSignal": true; }; "needApplyButton": { "alias": "needApplyButton"; "required": false; "isSignal": true; }; "needClearButton": { "alias": "needClearButton"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "expandOnOpen": { "alias": "expandOnOpen"; "required": false; "isSignal": true; }; "presetsFeatureLocked": { "alias": "presetsFeatureLocked"; "required": false; "isSignal": true; }; "savePresetsMode": { "alias": "savePresetsMode"; "required": false; "isSignal": true; }; "editingPresetsMode": { "alias": "editingPresetsMode"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "defaultPosition": { "alias": "defaultPosition"; "required": false; "isSignal": true; }; "panelClass": { "alias": "panelClass"; "required": false; "isSignal": true; }; "saveNewPresetsText": { "alias": "saveNewPresetsText"; "required": false; "isSignal": true; }; "saveAsNewPresetText": { "alias": "saveAsNewPresetText"; "required": false; "isSignal": true; }; "savePresetText": { "alias": "savePresetText"; "required": false; "isSignal": true; }; "updateExistingPresetText": { "alias": "updateExistingPresetText"; "required": false; "isSignal": true; }; "resetFilterText": { "alias": "resetFilterText"; "required": false; "isSignal": true; }; "applyFiltersText": { "alias": "applyFiltersText"; "required": false; "isSignal": true; }; "clearFilterText": { "alias": "clearFilterText"; "required": false; "isSignal": true; }; }, { "opened": "opened"; "closed": "closed"; "presetsLockedClicked": "presetsLockedClicked"; "saveNewPresets": "saveNewPresets"; "updatePresets": "updatePresets"; "applyFilters": "applyFilters"; "clearFilters": "clearFilters"; "resetFilters": "resetFilters"; "lockedFeatureClicked": "lockedFeatureClicked"; "filterDropdownGroupLockedClicked": "filterDropdownGroupLockedClicked"; }, never, never, true, never>;
 }
 
 export { FilterDropdownButtonComponent, FilterDropdownComponent };

package/types/agorapulse-ui-components-nav-selector-testing.d.ts

@@ -1,5 +1,5 @@
 import { AvatarNetwork } from '@agorapulse/ui-components/avatar';
-import { NavSelectorLeafAction, NavSelectorLeafDetails, NavSelectorLeaf } from '@agorapulse/ui-components/nav-selector';
+import { NavSelectorLeafAction, NavSelectorLeafDetails, NavSelectorLeafTags, NavSelectorLeaf } from '@agorapulse/ui-components/nav-selector';
 
 /**
  * Usage Example:
@@ -35,6 +35,7 @@ declare function generateLeafElements(options: {
     featureLockedFrequency?: number;
     actions?: NavSelectorLeafAction[];
     details?: Partial<NavSelectorLeafDetails>[];
+    tags?: NavSelectorLeafTags;
 }, customizer?: (leaf: NavSelectorLeaf, index: number) => NavSelectorLeaf): NavSelectorLeaf[];
 /**
  * Utility function to generate group type elements with children
@@ -58,6 +59,7 @@ declare function generateGroupElements(options: {
     featureLockedFrequency?: number;
     actions?: NavSelectorLeafAction[];
     details?: Partial<NavSelectorLeafDetails>[];
+    tags?: NavSelectorLeafTags;
 }): any;
 
 export { generateGroupElements, generateLeafElements };

package/types/agorapulse-ui-components-nav-selector.d.ts

@@ -42,6 +42,18 @@ interface NavSelectorTranslatedTexts {
     viewMore: string;
     /** Text of the button to show less details, it’s used when we limit the number of details displayed  */
     viewLess: string;
+    /** Text of the button opening the filter dropdown */
+    filter: string;
+    /** Text of the button clearing the filters inside the filter dropdown */
+    clearFilters: string;
+    /** Text of the button applying the filters picked inside the filter dropdown */
+    applyFilters: string;
+    /**
+     * Heading of each tag group inside the filter dropdown, keyed by tag name. Tag names are a structural taxonomy, not
+     * consumer data like the tag values are, so they need a translation of their own. Keying on `NavSelectorLeafTags`
+     * makes the compiler ask for one whenever a tag name is added.
+     */
+    tagNames: Record<keyof NavSelectorLeafTags, string>;
 }
 /**
  * Common interface for the NavSelector
@@ -69,6 +81,12 @@ type NavSelectorLeafAction = {
     /** Whether to add a divider before this item */
     dividerEnabled?: boolean;
 };
+/**
+ * Represent tags on a leaf. It can support many kind of tags so it is flexible
+ */
+type NavSelectorLeafTags = {
+    attributes: string[];
+};
 /**
  * Represent final entry of the nav selector
  */
@@ -97,6 +115,8 @@ type NavSelectorLeaf = {
     details: NavSelectorLeafDetails[];
     /** Optional actions that can be performed on the leaf */
     actions: NavSelectorLeafAction[];
+    /** List of tags */
+    tags: NavSelectorLeafTags;
     type: 'LEAF';
 } & NavSelectorBaseNode;
 /**
@@ -244,6 +264,12 @@ type InternalNavSelectorCategory = {
     avatarPictureUrlDisplayed: boolean;
     type: 'CATEGORY';
 } & InternalNavSelectorBaseNode;
+/**
+ * Represent final tags of leaf. It can support many kind of tags so it is flexible.
+ */
+type InternalNavSelectorLeafTags = {
+    attributes: string[];
+};
 /**
  * Represent final entry of the nav selector
  */
@@ -291,6 +317,8 @@ type InternalNavSelectorLeaf = {
     /** Details of the leaf */
     details: InternalNavSelectorLeafDetails[];
     type: 'LEAF';
+    /** List of tags of the leaf */
+    tags: InternalNavSelectorLeafTags;
     /** Indicates if the view more section should be display for details */
     viewMoreDisplayable: boolean;
     /** Indicates if the view more or view less button is displayed */
@@ -343,6 +371,8 @@ declare class NavSelectorState {
     style: Signal<NavSelectorStyle>;
     private multipleModeEnabled;
     private _texts;
+    tagsFilterDisplayed: Signal<boolean>;
+    tagsFilters: _angular_core.WritableSignal<Partial<InternalNavSelectorLeafTags>>;
     isMultipleModeEnabled: _angular_core.WritableSignal<boolean>;
     search: _angular_core.WritableSignal<string>;
     noResults: Signal<boolean>;
@@ -380,6 +410,8 @@ declare class NavSelectorState {
     onArrowUp(): void;
     private collectSelectedUids;
     private getFoldingOptions;
+    filterTags(tags: InternalNavSelectorLeafTags): void;
+    clearFilterTags(): void;
     fold(entry: InternalNavSelectorEntry): void;
     unfold(entry: InternalNavSelectorEntry): void;
     updateDetailsDisplayedLimit(detailsDisplayedLimit: number): void;
@@ -441,4 +473,4 @@ declare class NavSelectorComponent implements OnInit {
 }
 
 export { NavSelectorComponent, NavSelectorPopoverItemComponent };
-export type { NavSelectorCategory, NavSelectorCategoryEmptyStateActionEvent, NavSelectorEntry, NavSelectorGroup, NavSelectorLeaf, NavSelectorLeafAction, NavSelectorLeafActionClickedEvent, NavSelectorLeafDetails, NavSelectorTranslatedTexts, NodeAccessibility };
+export type { NavSelectorCategory, NavSelectorCategoryEmptyStateActionEvent, NavSelectorEntry, NavSelectorGroup, NavSelectorLeaf, NavSelectorLeafAction, NavSelectorLeafActionClickedEvent, NavSelectorLeafDetails, NavSelectorLeafTags, NavSelectorTranslatedTexts, NodeAccessibility };