@justeattakeaway/pie-tooltip 0.2.0 → 0.4.0

package/dist/index.d.ts

@@ -19,7 +19,7 @@ export declare const componentClass = "c-tooltip";
 
 export declare const componentSelector = "pie-tooltip";
 
-export declare type DefaultProps = ComponentDefaultProps<TooltipProps, keyof Omit<TooltipProps, 'trigger' | 'heading' | 'aria'>>;
+export declare type DefaultProps = ComponentDefaultProps<TooltipProps, keyof Omit<TooltipProps, 'trigger' | 'heading' | 'aria' | 'triggers'>>;
 
 export declare const defaultProps: DefaultProps;
 
@@ -33,9 +33,12 @@ export declare const modes: readonly ["tooltip", "dialog"];
 
 export declare const ON_TOOLTIP_CLOSE_EVENT = "pie-tooltip-close";
 
+export declare const ON_TOOLTIP_OPEN_EVENT = "pie-tooltip-open";
+
 /**
  * @tagname pie-tooltip
- * @event {Event} pie-tooltip-close - When the close button is clicked. Set `isOpen` to `false` in response.
+ * @event {Event} pie-tooltip-open - When a configured trigger asks for the panel. Set `isOpen` to `true` in response.
+ * @event {Event} pie-tooltip-close - When the close button is clicked, or a configured trigger asks to dismiss the panel. Set `isOpen` to `false` in response.
  * @slot content - The descriptive content of the panel. Must not contain focusable elements.
  * @slot action - An optional slot for interactive content such as a `pie-button`. Filling this slot switches the panel to a non-modal dialog.
  */
@@ -50,14 +53,25 @@ export declare class PieTooltip extends PieElement implements TooltipProps {
     heading: TooltipProps['heading'];
     headingLevel: "h2" | "h3" | "h4" | "h5" | "h6";
     aria: TooltipProps['aria'];
+    triggers: TooltipProps['triggers'];
     private _assignedActionElements;
     private _originElement;
     private _hasActionContent;
     private _isPositioned;
+    private _isAnchorVisible;
+    private _resolvedPosition;
+    private _clippedTriggerElement;
+    private _triggerClippers;
+    private _overlayClippers;
+    private _collisionSignature;
+    private _overlayModeDirty;
     private _triggerTrackingController;
+    private _interactionController;
     private _directionObserver;
+    private _triggerObserver;
     private _reanchorFrame;
-    private _shouldResolveOverlayMode;
+    private _hoverCloseTimer;
+    private _openedByClick;
     static styles: CSSResult;
     private get _mode();
     protected firstUpdated(): void;
@@ -68,7 +82,19 @@ export declare class PieTooltip extends PieElement implements TooltipProps {
     private resolveMode;
     private resolveOverlayMode;
     private projectOverTrigger;
+    private resolveCollision;
+    private _setResolvedPosition;
+    private _getCollisionBoundary;
+    private _getCandidatePositions;
+    private _refreshTriggerClippers;
     private handleCloseButtonClick;
+    private _getTriggerElement;
+    private _requestOpen;
+    private _requestClose;
+    private _startHoverCloseTimer;
+    private _cancelHoverCloseTimer;
+    private _rebuildInteractionListeners;
+    private _teardownInteractionListeners;
     private renderHeading;
     private renderCloseButton;
     render(): TemplateResult;
@@ -92,7 +118,10 @@ export declare interface TooltipProps {
      */
     isOpen?: boolean;
     /**
-     * The side of the trigger the panel sits on, and its alignment along the cross axis.
+     * The preferred side of the trigger the panel sits on, and its alignment along the cross axis.
+     * The component repositions the panel automatically — flipping to the opposite side and/or
+     * shifting its alignment — when the preferred position would collide with the viewport or with
+     * a clipping scroll container. This behaviour cannot be disabled.
      */
     position?: typeof positions[number];
     /**
@@ -128,8 +157,20 @@ export declare interface TooltipProps {
      * The ARIA labels used for various parts of the tooltip.
      */
     aria?: AriaProps;
+    /**
+     * Which interactions request that the panel opens and closes. The component never opens or
+     * closes itself: a configured interaction emits `pie-tooltip-open` or `pie-tooltip-close`
+     * and the consumer decides whether to honour it by setting `isOpen`. Empty by default, so
+     * no interaction is watched at all. Configure `hover` and `focus` together for keyboard
+     * reachability, and `click` for pointer users.
+     */
+    triggers?: Array<TooltipTrigger>;
 }
 
+export declare type TooltipTrigger = typeof triggers[number];
+
+export declare const triggers: readonly ["hover", "focus", "click"];
+
 export declare const types: readonly ["default", "icon"];
 
 export declare const variants: readonly ["default", "inverse"];