@quadrel-enterprise-ui/framework 20.27.0 → 20.27.1

package/index.d.ts

@@ -5196,6 +5196,7 @@ interface QdPopoverSizeConstraints {
  * - The returned Observable emits `true` once initial sizing is applied and overlay is visible.
  * - Even if autosize is turned off, the minimum and maximum width or height constraints are always enforced as hard limits.
  * - This means the popover can never be smaller or larger than the values you set, no matter what content it contains.
+ * - The width is also capped to the current screen width, so the popover never reaches past the screen edge — even if a larger maxWidth is set.
  *
  * #### For the hidden-content measuring
  * @see https://stackoverflow.com/questions/1841124/find-the-potential-width-of-a-hidden-element
@@ -5215,6 +5216,7 @@ declare class QdPopoverSizingService {
     observe(host: HTMLElement, popover: HTMLElement, overlayRef: OverlayRef, autoSize: QdPopoverAutoSizeConfig, constraints: QdPopoverSizeConstraints): Observable<boolean>;
     private showOverlay;
     private hideOverlay;
+    private resolveWidthLimits;
     private applySize;
     private measureContentSize;
     disconnect(): void;
@@ -5229,6 +5231,26 @@ declare class QdPopoverParentService {
     static ɵprov: i0.ɵɵInjectableDeclaration<QdPopoverParentService>;
 }
 
+/**
+ * **QdPopoverOnClickDirective**
+ *
+ * Shows a popover next to its host element and opens or closes it on host click.
+ *
+ * It is an internal building block. Quadrel components such as dropdowns, menu buttons and
+ * filters build on it; consumers do not use it directly.
+ *
+ * #### Features:
+ * - Opens the popover on click and closes it on the next click or an outside click.
+ * - With `qdPopoverEnableKeyControl`, Enter and Space open it, Escape and Tab close it.
+ * - Sizes the popover to its host or content within the min/max limits, and never wider than the screen.
+ * - Places it with the Angular CDK; with `qdPopoverFlipIntoViewport` it opens to the side that has room instead of off the screen edge.
+ * - Keeps only one popover open: opening one closes the others, but a nested popover keeps its parents open.
+ *
+ * #### Notes & Best Practices
+ * - Emits `opened` and `closed` so consumers can react.
+ * - The flip is opt-in, so popovers that already sit correctly stay as they are.
+ * - Not part of the public API; use the higher-level components like `qd-dropdown` or `qd-menu-button` instead.
+ */
 declare class QdPopoverOnClickDirective implements OnInit, OnDestroy {
     protected hostRef: ElementRef<HTMLElement>;
     protected overlayPositionBuilder: OverlayPositionBuilder;
@@ -5247,6 +5269,7 @@ declare class QdPopoverOnClickDirective implements OnInit, OnDestroy {
     qdPopoverMaxWidth: number | 'none';
     qdPopoverAutoSize: QdPopoverAutoSizeConfig;
     qdPopoverEnableKeyControl: boolean;
+    qdPopoverFlipIntoViewport: boolean;
     readonly opened: EventEmitter<any>;
     readonly closed: EventEmitter<any>;
     handleClick(event: MouseEvent): void;
@@ -5257,6 +5280,7 @@ declare class QdPopoverOnClickDirective implements OnInit, OnDestroy {
     private _host;
     private _popoverRef;
     private _positionStrategyInstance;
+    private _resolvedPositions;
     private _subscriptions;
     constructor();
     ngOnInit(): void;
@@ -5275,6 +5299,7 @@ declare class QdPopoverOnClickDirective implements OnInit, OnDestroy {
     close(): void;
     private popoverInstance;
     private initPositionStrategy;
+    private withHorizontalFallbacks;
     private createOverlay;
     private runSizingAndOpen;
     private setPopoverContent;
@@ -5284,7 +5309,7 @@ declare class QdPopoverOnClickDirective implements OnInit, OnDestroy {
     private unsubscribeAll;
     private cleanup;
     static ɵfac: i0.ɵɵFactoryDeclaration<QdPopoverOnClickDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<QdPopoverOnClickDirective, "[qdPopoverOnClick]", ["qdPopoverOnClick"], { "qdPopoverOnClick": { "alias": "qdPopoverOnClick"; "required": false; }; "positionStrategy": { "alias": "positionStrategy"; "required": false; }; "qdPopoverCloseStrategy": { "alias": "qdPopoverCloseStrategy"; "required": false; }; "qdPopoverDisabled": { "alias": "qdPopoverDisabled"; "required": false; }; "qdPopoverStopPropagation": { "alias": "qdPopoverStopPropagation"; "required": false; }; "qdPopoverBackgroundColor": { "alias": "qdPopoverBackgroundColor"; "required": false; }; "qdPopoverMaxHeight": { "alias": "qdPopoverMaxHeight"; "required": false; }; "qdPopoverMinWidth": { "alias": "qdPopoverMinWidth"; "required": false; }; "qdPopoverMaxWidth": { "alias": "qdPopoverMaxWidth"; "required": false; }; "qdPopoverAutoSize": { "alias": "qdPopoverAutoSize"; "required": false; }; "qdPopoverEnableKeyControl": { "alias": "qdPopoverEnableKeyControl"; "required": false; }; }, { "opened": "opened"; "closed": "closed"; }, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<QdPopoverOnClickDirective, "[qdPopoverOnClick]", ["qdPopoverOnClick"], { "qdPopoverOnClick": { "alias": "qdPopoverOnClick"; "required": false; }; "positionStrategy": { "alias": "positionStrategy"; "required": false; }; "qdPopoverCloseStrategy": { "alias": "qdPopoverCloseStrategy"; "required": false; }; "qdPopoverDisabled": { "alias": "qdPopoverDisabled"; "required": false; }; "qdPopoverStopPropagation": { "alias": "qdPopoverStopPropagation"; "required": false; }; "qdPopoverBackgroundColor": { "alias": "qdPopoverBackgroundColor"; "required": false; }; "qdPopoverMaxHeight": { "alias": "qdPopoverMaxHeight"; "required": false; }; "qdPopoverMinWidth": { "alias": "qdPopoverMinWidth"; "required": false; }; "qdPopoverMaxWidth": { "alias": "qdPopoverMaxWidth"; "required": false; }; "qdPopoverAutoSize": { "alias": "qdPopoverAutoSize"; "required": false; }; "qdPopoverEnableKeyControl": { "alias": "qdPopoverEnableKeyControl"; "required": false; }; "qdPopoverFlipIntoViewport": { "alias": "qdPopoverFlipIntoViewport"; "required": false; }; }, { "opened": "opened"; "closed": "closed"; }, never, never, false, never>;
 }
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quadrel-enterprise-ui/framework",
-  "version": "20.27.0",
+  "version": "20.27.1",
   "exports": {
     "./jest-preset": "./jest-preset.js",
     "./package.json": {