@skdx/web-components 0.26.0 → 0.28.0

package/dist/hover-card/HoverCard.d.ts

@@ -1,81 +1,54 @@
-import { LitElement } from 'lit';
+import type { Align, Side } from '../internal/positioning.js';
+import { SkdxHoverCardRoot } from './HoverCardRoot.js';
 /**
- * `<skdx-hover-card>` — the Web Components implementation of the shared
- * HoverCard contract (see `@skdx/shared`'s `hoverCardContract`). Owns open
- * state with independent open/close delays and hands it down to
- * `<skdx-hover-card-trigger>` / `<skdx-hover-card-content>`, which look it up
- * via `closest('skdx-hover-card')` and re-render on the
- * `skdx-hover-card-internal-update` event this element dispatches whenever
- * `open` changes — the same shared-state pattern `<skdx-select>`/
- * `<skdx-popover>` use.
+ * Renders canonical hover card anatomy: trigger from `slot="trigger"`
+ * children with optional link target, and content card holding remaining
+ * children with optional arrow. Children are always card body, never parts.
  *
- * Unlike `<skdx-tooltip>`, the pointer can move from the trigger onto the
- * content itself without the card closing — `<skdx-hover-card-content>`
- * cancels the pending close timer on pointer-enter.
- *
- * Renders only a `<slot>`.
+ * For hand composition, use `<skdx-hover-card-root>` from
+ * `@skdx/web-components/primitives/hover-card`.
  *
  * @example
  * ```html
- * <skdx-hover-card>
- *   <skdx-hover-card-trigger href="/users/kent">@kentcdodds</skdx-hover-card-trigger>
- *   <skdx-hover-card-content>Kent C. Dodds</skdx-hover-card-content>
+ * <skdx-hover-card href="/users/kent">
+ *   <span slot="trigger">@kentcdodds</span>
+ *   Kent C. Dodds
  * </skdx-hover-card>
  * ```
  *
  * @fires open-change - Fired with the new open state whenever it changes, controlled or not.
- * @fires open-change-complete - Fired with the new open state after `<skdx-hover-card-content>`'s enter or exit animation has finished — as soon as the content has settled, when it declares no animation at all. Not cancelable: the change has already happened.
+ * @fires open-change-complete - Fired once the content's enter or exit animation finishes, or as soon as it settles when it declares none; not cancelable.
  */
-export declare class SkdxHoverCard extends LitElement {
-    static styles: import("lit").CSSResult[];
+export declare class SkdxHoverCard extends SkdxHoverCardRoot {
     /**
-     * Whether the card is currently open and visible.
-     * @default false
+     * Link target for the derived trigger, and a keyboard or touch user's only route to what the card previews.
+     * @default undefined — a plain, non-navigating trigger.
      */
-    open: boolean;
+    href?: string;
     /**
-     * Initial open state, for uncontrolled usage. Applied once, on connect,
-     * and only if `open` wasn't already set.
-     * @default false
+     * Preferred edge of the trigger the derived content card is placed against.
+     * @default 'bottom'
      */
-    defaultOpen: boolean;
+    side: Side;
     /**
-     * Delay before the card opens on pointer enter (ms).
-     * @default 700
+     * Preferred alignment along the `side` edge; the floating layer may shift it to keep the card in the viewport.
+     * @default 'center'
      */
-    openDelay: number;
+    align: Align;
     /**
-     * Delay before the card closes after the pointer leaves both the trigger
-     * and the content (ms).
-     * @default 300
+     * Whether the derived content includes an arrow pointing back at the trigger.
+     * @default false
      */
-    closeDelay: number;
-    readonly contentId: string;
-    /** @internal Set by `<skdx-hover-card-trigger>` once its native anchor mounts. */
-    triggerEl: HTMLElement | null;
-    /** @internal Set right before refocusing the trigger after a dismiss, so its own focus handler doesn't reopen it. */
-    ignoreNextFocus: boolean;
-    private openTimer?;
-    private closeTimer?;
-    private hasUpdatedOnce;
-    private teardownOpenChangeComplete?;
+    showArrow: boolean;
+    private _anatomyFilledFor;
     connectedCallback(): void;
-    disconnectedCallback(): void;
+    /**
+     * Draws the canonical anatomy into the light DOM. Rebuilding tears down
+     * positioning state, so it's gated on the key that changes the anatomy's
+     * shape; `href`/`side`/`align` refresh in place instead.
+     */
+    private readonly fillAnatomy;
     protected updated(changed: Map<string, unknown>): void;
-    private setOpen;
-    private clearTimers;
-    /** @internal Opens immediately, e.g. on focus. */
-    openNow(): void;
-    /** @internal Closes immediately, cancelling any pending timer, e.g. on Escape. */
-    close(): void;
-    /** @internal Opens after `openDelay`, e.g. on trigger pointer-enter. */
-    scheduleOpen(): void;
-    /** @internal Closes after `closeDelay`, e.g. on trigger/content pointer-leave. */
-    scheduleClose(): void;
-    /** @internal Cancels a pending close, e.g. when the pointer enters the content. */
-    cancelClose(): void;
-    /** @internal */
-    focusTrigger(): void;
     render(): import("lit").TemplateResult<1>;
 }
 declare global {

package/dist/hover-card/HoverCard.js

@@ -1,5 +1 @@
-var c=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var o=(l,n,e,i)=>{for(var t=i>1?void 0:i?h(n,e):n,a=l.length-1,p;a>=0;a--)(p=l[a])&&(t=(i?p(n,e,t):p(t))||t);return i&&t&&c(n,e,t),t};import{css as d,html as m,LitElement as u}from"lit";import{property as r}from"lit/decorators.js";import{customElement as f}from"../internal/define.js";import{nextId as v}from"../internal/ids.js";import{notifyOpenChangeComplete as T}from"../internal/open-change-complete.js";import{hiddenHostStyles as y}from"../internal/styles.js";var s=class extends u{constructor(){super(...arguments);this.open=!1;this.defaultOpen=!1;this.openDelay=700;this.closeDelay=300;this.contentId=v("skdx-hover-card-content");this.triggerEl=null;this.ignoreNextFocus=!1;this.hasUpdatedOnce=!1}connectedCallback(){super.connectedCallback(),this.defaultOpen&&!this.hasAttribute("open")&&(this.open=!0)}disconnectedCallback(){this.clearTimers(),this.teardownOpenChangeComplete?.(),super.disconnectedCallback()}updated(e){let i=!this.hasUpdatedOnce;this.hasUpdatedOnce=!0,e.has("open")&&!i&&this.dispatchEvent(new CustomEvent("open-change",{detail:this.open,bubbles:!0,composed:!0})),e.size>0&&this.dispatchEvent(new CustomEvent("skdx-hover-card-internal-update")),e.has("open")&&!i&&(this.teardownOpenChangeComplete?.(),this.teardownOpenChangeComplete=T(()=>this.querySelector("skdx-hover-card-content"),this.open,t=>this.dispatchEvent(new CustomEvent("open-change-complete",{detail:t,bubbles:!0,composed:!0}))))}setOpen(e){this.open!==e&&(this.open=e)}clearTimers(){clearTimeout(this.openTimer),clearTimeout(this.closeTimer)}openNow(){this.clearTimers(),this.setOpen(!0)}close(){this.clearTimers(),this.setOpen(!1)}scheduleOpen(){this.clearTimers(),this.openTimer=setTimeout(()=>this.setOpen(!0),this.openDelay)}scheduleClose(){this.clearTimers(),this.closeTimer=setTimeout(()=>this.setOpen(!1),this.closeDelay)}cancelClose(){this.clearTimers()}focusTrigger(){this.triggerEl?.focus()}render(){return m`<slot></slot>`}};s.styles=[y,d`
-      :host {
-        display: contents;
-      }
-    `],o([r({type:Boolean,reflect:!0})],s.prototype,"open",2),o([r({type:Boolean,attribute:"default-open"})],s.prototype,"defaultOpen",2),o([r({type:Number,attribute:"open-delay"})],s.prototype,"openDelay",2),o([r({type:Number,attribute:"close-delay"})],s.prototype,"closeDelay",2),s=o([f("skdx-hover-card")],s);export{s as SkdxHoverCard};
+var p=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var r=(l,i,t,n)=>{for(var o=n>1?void 0:n?d(i,t):i,s=l.length-1,m;s>=0;s--)(m=l[s])&&(o=(n?m(i,t,o):m(o))||o);return n&&o&&p(i,t,o),o};import{html as h}from"lit";import{property as a}from"lit/decorators.js";import{hasGeneratedContent as c}from"../internal/authored.js";import{customElement as f}from"../internal/define.js";import{fillHoverCardAnatomy as y,HOVER_CARD_ANATOMY_GENERATED as A,refreshHoverCardAnatomy as g}from"./HoverCardAnatomy.js";import{SkdxHoverCardRoot as u}from"./HoverCardRoot.js";var e=class extends u{constructor(){super(...arguments);this.side="bottom";this.align="center";this.showArrow=!1;this._anatomyFilledFor="";this.fillAnatomy=()=>{let t=String(this.showArrow);t!==this._anatomyFilledFor||!c(this,A)?(this._anatomyFilledFor=t,y(this)):g(this)}}connectedCallback(){super.connectedCallback(),queueMicrotask(this.fillAnatomy)}updated(t){this.fillAnatomy(),super.updated(t)}render(){return h`<slot @slotchange=${this.fillAnatomy}></slot>`}};r([a({type:String})],e.prototype,"href",2),r([a({type:String})],e.prototype,"side",2),r([a({type:String})],e.prototype,"align",2),r([a({type:Boolean,attribute:"show-arrow"})],e.prototype,"showArrow",2),e=r([f("skdx-hover-card")],e);export{e as SkdxHoverCard};

package/dist/hover-card/HoverCardAnatomy.cjs

@@ -0,0 +1 @@
+"use strict";var c=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var m=Object.prototype.hasOwnProperty;var h=(e,r)=>{for(var t in r)c(e,t,{get:r[t],enumerable:!0})},g=(e,r,t,n)=>{if(r&&typeof r=="object"||typeof r=="function")for(let o of f(r))!m.call(e,o)&&o!==t&&c(e,o,{get:()=>r[o],enumerable:!(n=p(r,o))||n.enumerable});return e};var v=e=>g(c({},"__esModule",{value:!0}),e);var N={};h(N,{HOVER_CARD_ANATOMY_GENERATED:()=>a,fillHoverCardAnatomy:()=>C,refreshHoverCardAnatomy:()=>u});module.exports=v(N);var l=require("../internal/host-attributes.cjs"),A=require("./HoverCardTrigger.cjs"),k=require("./HoverCardContent.cjs"),y=require("./HoverCardArrow.cjs"),a="data-skdx-hover-card-generated",E=new Set(["skdx-hover-card-arrow"]);function C(e){let r=e.querySelector(`:scope > skdx-hover-card-trigger[${a}]`),t=e.querySelector(`:scope > skdx-hover-card-content[${a}]`),n,o;if(r||t)n=r?Array.from(r.childNodes):[],o=t?Array.from(t.childNodes).filter(d=>d.nodeType!==Node.ELEMENT_NODE||!E.has(d.tagName.toLowerCase())):[];else{n=[],o=[];for(let d of Array.from(e.childNodes))d.nodeType===Node.ELEMENT_NODE&&d.getAttribute("slot")==="trigger"?(d.removeAttribute("slot"),n.push(d)):o.push(d)}let i=document.createElement("skdx-hover-card-trigger");i.setAttribute(a,""),e.href&&(i.href=e.href),i.append(...n);let s=document.createElement("skdx-hover-card-content");s.setAttribute(a,""),(0,l.forwardHostAttributesToContent)(e,s),s.side=e.side,s.align=e.align,s.append(...o),e.showArrow&&s.append(document.createElement("skdx-hover-card-arrow")),e.replaceChildren(i,s)}function u(e){let r=e.querySelector(`:scope > skdx-hover-card-trigger[${a}]`);r&&e.href&&(r.href=e.href);let t=e.querySelector(`:scope > skdx-hover-card-content[${a}]`);t&&(t.side=e.side,t.align=e.align)}0&&(module.exports={HOVER_CARD_ANATOMY_GENERATED,fillHoverCardAnatomy,refreshHoverCardAnatomy});

package/dist/hover-card/HoverCardAnatomy.d.cts

@@ -0,0 +1,22 @@
+import type { SkdxHoverCard } from './HoverCard.cjs';
+import './HoverCardTrigger.cjs';
+import './HoverCardContent.cjs';
+import './HoverCardArrow.cjs';
+/** @internal Marks a direct child of `<skdx-hover-card>` this module generated. */
+export declare const HOVER_CARD_ANATOMY_GENERATED = "data-skdx-hover-card-generated";
+/**
+ * Builds canonical anatomy: trigger with href and content from `slot="trigger"`
+ * children, and content card holding remaining children and optional arrow—as
+ * light-DOM children of root. Trigger/body read from root's direct children
+ * on first build, from previous generated parts on rebuild. Host id/class/
+ * style/data-* / aria-* forward to Content.
+ * @internal
+ */
+export declare function fillHoverCardAnatomy(root: SkdxHoverCard): void;
+/**
+ * Refreshes the generated Trigger's `href` and the Content's `side`/`align`
+ * in place — the parts of the anatomy that can change without a structural
+ * rebuild. A no-op when the anatomy has not been (or is no longer) generated.
+ * @internal
+ */
+export declare function refreshHoverCardAnatomy(root: SkdxHoverCard): void;

package/dist/hover-card/HoverCardAnatomy.d.ts

@@ -0,0 +1,22 @@
+import type { SkdxHoverCard } from './HoverCard.js';
+import './HoverCardTrigger.js';
+import './HoverCardContent.js';
+import './HoverCardArrow.js';
+/** @internal Marks a direct child of `<skdx-hover-card>` this module generated. */
+export declare const HOVER_CARD_ANATOMY_GENERATED = "data-skdx-hover-card-generated";
+/**
+ * Builds canonical anatomy: trigger with href and content from `slot="trigger"`
+ * children, and content card holding remaining children and optional arrow—as
+ * light-DOM children of root. Trigger/body read from root's direct children
+ * on first build, from previous generated parts on rebuild. Host id/class/
+ * style/data-* / aria-* forward to Content.
+ * @internal
+ */
+export declare function fillHoverCardAnatomy(root: SkdxHoverCard): void;
+/**
+ * Refreshes the generated Trigger's `href` and the Content's `side`/`align`
+ * in place — the parts of the anatomy that can change without a structural
+ * rebuild. A no-op when the anatomy has not been (or is no longer) generated.
+ * @internal
+ */
+export declare function refreshHoverCardAnatomy(root: SkdxHoverCard): void;

package/dist/hover-card/HoverCardAnatomy.js

@@ -0,0 +1 @@
+import{forwardHostAttributesToContent as c}from"../internal/host-attributes.js";import"./HoverCardTrigger.js";import"./HoverCardContent.js";import"./HoverCardArrow.js";var n="data-skdx-hover-card-generated",l=new Set(["skdx-hover-card-arrow"]);function g(e){let d=e.querySelector(`:scope > skdx-hover-card-trigger[${n}]`),t=e.querySelector(`:scope > skdx-hover-card-content[${n}]`),s,a;if(d||t)s=d?Array.from(d.childNodes):[],a=t?Array.from(t.childNodes).filter(r=>r.nodeType!==Node.ELEMENT_NODE||!l.has(r.tagName.toLowerCase())):[];else{s=[],a=[];for(let r of Array.from(e.childNodes))r.nodeType===Node.ELEMENT_NODE&&r.getAttribute("slot")==="trigger"?(r.removeAttribute("slot"),s.push(r)):a.push(r)}let i=document.createElement("skdx-hover-card-trigger");i.setAttribute(n,""),e.href&&(i.href=e.href),i.append(...s);let o=document.createElement("skdx-hover-card-content");o.setAttribute(n,""),c(e,o),o.side=e.side,o.align=e.align,o.append(...a),e.showArrow&&o.append(document.createElement("skdx-hover-card-arrow")),e.replaceChildren(i,o)}function v(e){let d=e.querySelector(`:scope > skdx-hover-card-trigger[${n}]`);d&&e.href&&(d.href=e.href);let t=e.querySelector(`:scope > skdx-hover-card-content[${n}]`);t&&(t.side=e.side,t.align=e.align)}export{n as HOVER_CARD_ANATOMY_GENERATED,g as fillHoverCardAnatomy,v as refreshHoverCardAnatomy};

package/dist/hover-card/HoverCardArrow.d.cts

@@ -1,10 +1,7 @@
 import { SkdxOverlayArrow } from '../internal/overlay-arrow.cjs';
 /**
- * `<skdx-hover-card-arrow>` — optional pointer from
- * `<skdx-hover-card-content>` back at the trigger. Render it inside
- * `<skdx-hover-card-content>`; it self-positions from the resolved placement
- * (see `data-side` on the content) and so takes no positioning attributes of
- * its own.
+ * An optional pointer from `<skdx-hover-card-content>` back to the trigger.
+ * Self-positions from the content's placement.
  *
  * @example
  * ```html

package/dist/hover-card/HoverCardArrow.d.ts

@@ -1,10 +1,7 @@
 import { SkdxOverlayArrow } from '../internal/overlay-arrow.js';
 /**
- * `<skdx-hover-card-arrow>` — optional pointer from
- * `<skdx-hover-card-content>` back at the trigger. Render it inside
- * `<skdx-hover-card-content>`; it self-positions from the resolved placement
- * (see `data-side` on the content) and so takes no positioning attributes of
- * its own.
+ * An optional pointer from `<skdx-hover-card-content>` back to the trigger.
+ * Self-positions from the content's placement.
  *
  * @example
  * ```html

package/dist/hover-card/HoverCardContent.cjs

@@ -1,4 +1,4 @@
-"use strict";var h=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var E=Object.prototype.hasOwnProperty;var P=(n,e)=>{for(var t in e)h(n,t,{get:e[t],enumerable:!0})},b=(n,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of y(e))!E.call(n,o)&&o!==t&&h(n,o,{get:()=>e[o],enumerable:!(i=v(e,o))||i.enumerable});return n};var O=n=>b(h({},"__esModule",{value:!0}),n),a=(n,e,t,i)=>{for(var o=i>1?void 0:i?v(e,t):e,p=n.length-1,u;p>=0;p--)(u=n[p])&&(o=(i?u(e,t,o):u(o))||o);return i&&o&&h(e,t,o),o};var w={};P(w,{SkdxHoverCardContent:()=>s});module.exports=O(w);var l=require("lit"),d=require("lit/decorators.js"),f=require("../internal/closest.cjs"),m=require("../internal/define.cjs"),r=require("../internal/dismiss.cjs"),c=require("../internal/positioning.cjs"),g=require("../internal/styles.cjs");var s=class extends l.LitElement{constructor(){super(...arguments);this.side="bottom";this.align="center";this.sideOffset=4;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.onRootUpdate=()=>this.syncHostState();this.handlePointerEnter=t=>{t.pointerType!=="touch"&&this.root?.cancelClose()};this.handlePointerLeave=t=>{t.pointerType!=="touch"&&this.root?.scheduleClose()};this.handleOutsidePointerDown=t=>{if(!this.root?.open)return;let i=t.target;this.contains(i)||(0,r.triggerContains)(this.root.triggerEl,i)||(0,r.dispatchOutside)(this,"pointer-down-outside",t)&&this.root.close()};this.handleOutsideFocus=t=>{if(!this.root?.open)return;let i=(0,r.focusOutsideTarget)(t);!i||this.contains(i)||(0,r.triggerContains)(this.root.triggerEl,i)||(0,r.dispatchOutside)(this,"focus-outside",t)&&this.root.close()};this.handleKeyDown=t=>{t.key==="Escape"&&(t.preventDefault(),(0,r.dispatchEscapeKeyDown)(this,t)&&this.root&&(this.root.close(),this.root.ignoreNextFocus=!0,this.root.focusTrigger()))}}connectedCallback(){super.connectedCallback(),this.root=(0,f.closestThroughPortal)(this,"skdx-hover-card"),this.root?.addEventListener("skdx-hover-card-internal-update",this.onRootUpdate),this.addEventListener("pointerenter",this.handlePointerEnter),this.addEventListener("pointerleave",this.handlePointerLeave),document.addEventListener("pointerdown",this.handleOutsidePointerDown),document.addEventListener("focusin",this.handleOutsideFocus),this.root&&(this.id=this.root.contentId),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener("skdx-hover-card-internal-update",this.onRootUpdate),document.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown),document.removeEventListener("focusin",this.handleOutsideFocus),this.cleanupPosition?.(),super.disconnectedCallback()}firstUpdated(){this.root?.open&&this.activate()}syncHostState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed"),this.setAttribute("data-side",this.side??"bottom"),this.setAttribute("data-align",this.align??"center"),this.hidden=!t,t?document.addEventListener("keydown",this.handleKeyDown):document.removeEventListener("keydown",this.handleKeyDown),t?this.activate():this.deactivate()}activate(){this.cleanupPosition||!this.root?.triggerEl||(this.cleanupPosition=(0,c.positionFloating)(this.root.triggerEl,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"hover-card",arrow:()=>this.querySelector("skdx-hover-card-arrow")}))}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0}render(){return l.html`<slot></slot>`}};s.styles=[g.hiddenHostStyles,l.css`
+"use strict";var h=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var E=Object.prototype.hasOwnProperty;var P=(n,e)=>{for(var t in e)h(n,t,{get:e[t],enumerable:!0})},b=(n,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of y(e))!E.call(n,o)&&o!==t&&h(n,o,{get:()=>e[o],enumerable:!(i=v(e,o))||i.enumerable});return n};var O=n=>b(h({},"__esModule",{value:!0}),n),a=(n,e,t,i)=>{for(var o=i>1?void 0:i?v(e,t):e,p=n.length-1,u;p>=0;p--)(u=n[p])&&(o=(i?u(e,t,o):u(o))||o);return i&&o&&h(e,t,o),o};var w={};P(w,{SkdxHoverCardContent:()=>s});module.exports=O(w);var l=require("lit"),d=require("lit/decorators.js"),f=require("../internal/closest.cjs"),m=require("../internal/define.cjs"),r=require("../internal/dismiss.cjs"),c=require("../internal/positioning.cjs"),g=require("../internal/styles.cjs");var s=class extends l.LitElement{constructor(){super(...arguments);this.side="bottom";this.align="center";this.sideOffset=4;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.onRootUpdate=()=>this.syncHostState();this.handlePointerEnter=t=>{t.pointerType!=="touch"&&this.root?.cancelClose()};this.handlePointerLeave=t=>{t.pointerType!=="touch"&&this.root?.scheduleClose()};this.handleOutsidePointerDown=t=>{if(!this.root?.open)return;let i=t.target;this.contains(i)||(0,r.triggerContains)(this.root.triggerEl,i)||(0,r.dispatchOutside)(this,"pointer-down-outside",t)&&this.root.close()};this.handleOutsideFocus=t=>{if(!this.root?.open)return;let i=(0,r.focusOutsideTarget)(t);!i||this.contains(i)||(0,r.triggerContains)(this.root.triggerEl,i)||(0,r.dispatchOutside)(this,"focus-outside",t)&&this.root.close()};this.handleKeyDown=t=>{t.key==="Escape"&&(t.preventDefault(),(0,r.dispatchEscapeKeyDown)(this,t)&&this.root&&(this.root.close(),this.root.focusTrigger()))}}connectedCallback(){super.connectedCallback(),this.root=(0,f.closestThroughPortal)(this,"skdx-hover-card, skdx-hover-card-root"),this.root?.addEventListener("skdx-hover-card-internal-update",this.onRootUpdate),this.addEventListener("pointerenter",this.handlePointerEnter),this.addEventListener("pointerleave",this.handlePointerLeave),document.addEventListener("pointerdown",this.handleOutsidePointerDown),document.addEventListener("focusin",this.handleOutsideFocus),this.root&&(this.id?this.root.contentId=this.id:this.id=this.root.contentId,this.root.contentEl=this),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener("skdx-hover-card-internal-update",this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),document.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown),document.removeEventListener("focusin",this.handleOutsideFocus),this.cleanupPosition?.(),super.disconnectedCallback()}firstUpdated(){this.root?.open&&this.activate()}syncHostState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed"),this.setAttribute("data-side",this.side??"bottom"),this.setAttribute("data-align",this.align??"center"),this.hidden=!t,t?document.addEventListener("keydown",this.handleKeyDown):document.removeEventListener("keydown",this.handleKeyDown),t?this.activate():this.deactivate()}activate(){this.cleanupPosition||!this.root?.triggerEl||(this.cleanupPosition=(0,c.positionFloating)(this.root.triggerEl,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"hover-card",arrow:()=>this.querySelector("skdx-hover-card-arrow")}))}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0}render(){return l.html`<slot></slot>`}};s.styles=[g.hiddenHostStyles,l.css`
       :host {
         display: block;
       }

package/dist/hover-card/HoverCardContent.d.cts

@@ -1,32 +1,26 @@
 import { LitElement } from 'lit';
 import { type PositionOptions } from '../internal/positioning.cjs';
 /**
- * `<skdx-hover-card-content>` — the card's floating panel for the closest
- * ancestor `<skdx-hover-card>`, positioned relative to the trigger via
- * `@floating-ui/dom` (`strategy: 'fixed'`, so no portal is needed). `id` and
- * `data-state` are set directly on this host element (not inside shadow
- * DOM) so `aria-describedby` on the trigger can target this element's id
- * and arbitrary interactive light-DOM content (links, buttons) can be
- * slotted in. Entering the content with the pointer cancels the pending
- * close timer; leaving it reschedules the close. Closes on Escape (returning
- * focus to the trigger) — listened for on `document` while open, so a card
- * opened by hover is dismissable even when keyboard focus is elsewhere (WCAG
- * 2.2 SC 1.4.13) — or on an outside interaction: pointer-down outside,
- * or focus moving outside — each announced first as `interact-outside` and
- * then as the specific event, so one `preventDefault()` vetoes either path.
+ * Floating panel for a hover card, positioned relative to the trigger via
+ * floating-ui. `id` and `data-state` set on the host so `aria-describedby`
+ * can target this element.
  *
- * `data-side`/`data-align` start out as the *configured* `side`/`align` and
- * are rewritten by `positioning.ts`'s `positionFloating` with floating-ui's
- * resolved (post-flip/shift) placement on every reposition, as React's
- * `PopperContent` does. The same layer writes the measurement custom
- * properties `--skdx-hover-card-available-width` / `-available-height` /
- * `-trigger-width` / `-transform-origin` onto this element, so the card can
- * be sized and animated from CSS without measuring anything by hand.
+ * **Must hold nothing tabbable** — pointer-only; use `<skdx-popover>` for
+ * interactive content. Pointer entry cancels the close timer; pointer exit
+ * reschedules it. Closes on Escape (returning focus to the trigger), which
+ * listens on `document` while open so a hover-opened card is dismissable
+ * even when focus is elsewhere (WCAG 2.2 SC 1.4.13), or on outside interaction
+ * (pointer-down or focus leaving the card/trigger).
  *
- * @fires escape-key-down - Escape was pressed while open. Preventable.
- * @fires pointer-down-outside - A pointer-down landed outside this content while open. Preventable.
- * @fires focus-outside - Focus moved to an element outside this content while open (detail: the original focusin). Preventable.
- * @fires interact-outside - Either kind of outside interaction, fired immediately before the specific event so one handler can veto both. Preventable.
+ * `data-side` / `data-align` hold floating-ui's resolved placement after
+ * flip/shift. Custom properties `--skdx-hover-card-available-width`,
+ * `-available-height`, `-trigger-width`, and `-transform-origin` are set for
+ * CSS sizing and animation without hand measurement.
+ *
+ * @fires escape-key-down - Fires on Escape while open; preventDefault() keeps the card open.
+ * @fires pointer-down-outside - Fires on pointer-down outside the card and trigger; preventDefault() keeps it open.
+ * @fires focus-outside - Focus moved outside the card/trigger. Preventable.
+ * @fires interact-outside - Any outside interaction; fires before the specific event.
  */
 export declare class SkdxHoverCardContent extends LitElement {
     static styles: import("lit").CSSResult[];
@@ -41,17 +35,14 @@ export declare class SkdxHoverCardContent extends LitElement {
     /** Flip/shift to stay within the viewport instead of overflowing it. */
     avoidCollisions: boolean;
     /**
-     * Minimum pixel distance to keep from the collision boundary when avoiding
-     * collisions. The `collision-padding` attribute sets a single number for
-     * every side; the per-side `{ top, right, bottom, left }` form is
-     * property-only, since an attribute cannot carry an object.
+     * Minimum pixel distance from collision boundary. Per-side form `{ top,
+     * right, bottom, left }` is property-only (attribute cannot carry objects).
      */
     collisionPadding: NonNullable<PositionOptions['collisionPadding']>;
     /**
-     * Element (or elements) collisions are measured against instead of this
-     * card's clipping ancestors — keeps it inside a scroll container or one
-     * pane of a split layout rather than the whole viewport. Property-only: an
-     * `Element` cannot come from an attribute string.
+     * Element(s) to measure collisions against instead of viewport. Keeps the
+     * card inside a scroll container or pane. Property-only (attribute cannot
+     * carry objects).
      */
     collisionBoundary?: PositionOptions['collisionBoundary'];
     private root;
@@ -59,14 +50,7 @@ export declare class SkdxHoverCardContent extends LitElement {
     private cleanupPosition?;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    /**
-     * The trigger registers the element to anchor against in its own
-     * `firstUpdated()`, which has not run yet when this panel's
-     * `connectedCallback` does — so a panel that mounts already open finds no
-     * anchor and, with no open-state change to follow, never positions itself at
-     * all. This is the first tick where the anchor exists; `activate()` is
-     * guarded, so an already-positioned panel is untouched.
-     */
+    /** Activate on first update if root is open (trigger's anchor exists now). */
     protected firstUpdated(): void;
     private syncHostState;
     private activate;

package/dist/hover-card/HoverCardContent.d.ts

@@ -1,32 +1,26 @@
 import { LitElement } from 'lit';
 import { type PositionOptions } from '../internal/positioning.js';
 /**
- * `<skdx-hover-card-content>` — the card's floating panel for the closest
- * ancestor `<skdx-hover-card>`, positioned relative to the trigger via
- * `@floating-ui/dom` (`strategy: 'fixed'`, so no portal is needed). `id` and
- * `data-state` are set directly on this host element (not inside shadow
- * DOM) so `aria-describedby` on the trigger can target this element's id
- * and arbitrary interactive light-DOM content (links, buttons) can be
- * slotted in. Entering the content with the pointer cancels the pending
- * close timer; leaving it reschedules the close. Closes on Escape (returning
- * focus to the trigger) — listened for on `document` while open, so a card
- * opened by hover is dismissable even when keyboard focus is elsewhere (WCAG
- * 2.2 SC 1.4.13) — or on an outside interaction: pointer-down outside,
- * or focus moving outside — each announced first as `interact-outside` and
- * then as the specific event, so one `preventDefault()` vetoes either path.
+ * Floating panel for a hover card, positioned relative to the trigger via
+ * floating-ui. `id` and `data-state` set on the host so `aria-describedby`
+ * can target this element.
  *
- * `data-side`/`data-align` start out as the *configured* `side`/`align` and
- * are rewritten by `positioning.ts`'s `positionFloating` with floating-ui's
- * resolved (post-flip/shift) placement on every reposition, as React's
- * `PopperContent` does. The same layer writes the measurement custom
- * properties `--skdx-hover-card-available-width` / `-available-height` /
- * `-trigger-width` / `-transform-origin` onto this element, so the card can
- * be sized and animated from CSS without measuring anything by hand.
+ * **Must hold nothing tabbable** — pointer-only; use `<skdx-popover>` for
+ * interactive content. Pointer entry cancels the close timer; pointer exit
+ * reschedules it. Closes on Escape (returning focus to the trigger), which
+ * listens on `document` while open so a hover-opened card is dismissable
+ * even when focus is elsewhere (WCAG 2.2 SC 1.4.13), or on outside interaction
+ * (pointer-down or focus leaving the card/trigger).
  *
- * @fires escape-key-down - Escape was pressed while open. Preventable.
- * @fires pointer-down-outside - A pointer-down landed outside this content while open. Preventable.
- * @fires focus-outside - Focus moved to an element outside this content while open (detail: the original focusin). Preventable.
- * @fires interact-outside - Either kind of outside interaction, fired immediately before the specific event so one handler can veto both. Preventable.
+ * `data-side` / `data-align` hold floating-ui's resolved placement after
+ * flip/shift. Custom properties `--skdx-hover-card-available-width`,
+ * `-available-height`, `-trigger-width`, and `-transform-origin` are set for
+ * CSS sizing and animation without hand measurement.
+ *
+ * @fires escape-key-down - Fires on Escape while open; preventDefault() keeps the card open.
+ * @fires pointer-down-outside - Fires on pointer-down outside the card and trigger; preventDefault() keeps it open.
+ * @fires focus-outside - Focus moved outside the card/trigger. Preventable.
+ * @fires interact-outside - Any outside interaction; fires before the specific event.
  */
 export declare class SkdxHoverCardContent extends LitElement {
     static styles: import("lit").CSSResult[];
@@ -41,17 +35,14 @@ export declare class SkdxHoverCardContent extends LitElement {
     /** Flip/shift to stay within the viewport instead of overflowing it. */
     avoidCollisions: boolean;
     /**
-     * Minimum pixel distance to keep from the collision boundary when avoiding
-     * collisions. The `collision-padding` attribute sets a single number for
-     * every side; the per-side `{ top, right, bottom, left }` form is
-     * property-only, since an attribute cannot carry an object.
+     * Minimum pixel distance from collision boundary. Per-side form `{ top,
+     * right, bottom, left }` is property-only (attribute cannot carry objects).
      */
     collisionPadding: NonNullable<PositionOptions['collisionPadding']>;
     /**
-     * Element (or elements) collisions are measured against instead of this
-     * card's clipping ancestors — keeps it inside a scroll container or one
-     * pane of a split layout rather than the whole viewport. Property-only: an
-     * `Element` cannot come from an attribute string.
+     * Element(s) to measure collisions against instead of viewport. Keeps the
+     * card inside a scroll container or pane. Property-only (attribute cannot
+     * carry objects).
      */
     collisionBoundary?: PositionOptions['collisionBoundary'];
     private root;
@@ -59,14 +50,7 @@ export declare class SkdxHoverCardContent extends LitElement {
     private cleanupPosition?;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    /**
-     * The trigger registers the element to anchor against in its own
-     * `firstUpdated()`, which has not run yet when this panel's
-     * `connectedCallback` does — so a panel that mounts already open finds no
-     * anchor and, with no open-state change to follow, never positions itself at
-     * all. This is the first tick where the anchor exists; `activate()` is
-     * guarded, so an already-positioned panel is untouched.
-     */
+    /** Activate on first update if root is open (trigger's anchor exists now). */
     protected firstUpdated(): void;
     private syncHostState;
     private activate;

package/dist/hover-card/HoverCardContent.js

@@ -1,4 +1,4 @@
-var p=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var o=(a,r,t,i)=>{for(var s=i>1?void 0:i?u(r,t):r,d=a.length-1,l;d>=0;d--)(l=a[d])&&(s=(i?l(r,t,s):l(s))||s);return i&&s&&p(r,t,s),s};import{css as v,html as f,LitElement as m}from"lit";import{property as n}from"lit/decorators.js";import{closestThroughPortal as g}from"../internal/closest.js";import{customElement as y}from"../internal/define.js";import{dispatchEscapeKeyDown as E,dispatchOutside as h,focusOutsideTarget as P,triggerContains as c}from"../internal/dismiss.js";import{optOutBoolean as b,positionFloating as O}from"../internal/positioning.js";import{hiddenHostStyles as w}from"../internal/styles.js";var e=class extends m{constructor(){super(...arguments);this.side="bottom";this.align="center";this.sideOffset=4;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.onRootUpdate=()=>this.syncHostState();this.handlePointerEnter=t=>{t.pointerType!=="touch"&&this.root?.cancelClose()};this.handlePointerLeave=t=>{t.pointerType!=="touch"&&this.root?.scheduleClose()};this.handleOutsidePointerDown=t=>{if(!this.root?.open)return;let i=t.target;this.contains(i)||c(this.root.triggerEl,i)||h(this,"pointer-down-outside",t)&&this.root.close()};this.handleOutsideFocus=t=>{if(!this.root?.open)return;let i=P(t);!i||this.contains(i)||c(this.root.triggerEl,i)||h(this,"focus-outside",t)&&this.root.close()};this.handleKeyDown=t=>{t.key==="Escape"&&(t.preventDefault(),E(this,t)&&this.root&&(this.root.close(),this.root.ignoreNextFocus=!0,this.root.focusTrigger()))}}connectedCallback(){super.connectedCallback(),this.root=g(this,"skdx-hover-card"),this.root?.addEventListener("skdx-hover-card-internal-update",this.onRootUpdate),this.addEventListener("pointerenter",this.handlePointerEnter),this.addEventListener("pointerleave",this.handlePointerLeave),document.addEventListener("pointerdown",this.handleOutsidePointerDown),document.addEventListener("focusin",this.handleOutsideFocus),this.root&&(this.id=this.root.contentId),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener("skdx-hover-card-internal-update",this.onRootUpdate),document.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown),document.removeEventListener("focusin",this.handleOutsideFocus),this.cleanupPosition?.(),super.disconnectedCallback()}firstUpdated(){this.root?.open&&this.activate()}syncHostState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed"),this.setAttribute("data-side",this.side??"bottom"),this.setAttribute("data-align",this.align??"center"),this.hidden=!t,t?document.addEventListener("keydown",this.handleKeyDown):document.removeEventListener("keydown",this.handleKeyDown),t?this.activate():this.deactivate()}activate(){this.cleanupPosition||!this.root?.triggerEl||(this.cleanupPosition=O(this.root.triggerEl,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"hover-card",arrow:()=>this.querySelector("skdx-hover-card-arrow")}))}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0}render(){return f`<slot></slot>`}};e.styles=[w,v`
+var p=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var o=(a,r,t,i)=>{for(var s=i>1?void 0:i?u(r,t):r,d=a.length-1,l;d>=0;d--)(l=a[d])&&(s=(i?l(r,t,s):l(s))||s);return i&&s&&p(r,t,s),s};import{css as v,html as f,LitElement as m}from"lit";import{property as n}from"lit/decorators.js";import{closestThroughPortal as g}from"../internal/closest.js";import{customElement as y}from"../internal/define.js";import{dispatchEscapeKeyDown as E,dispatchOutside as h,focusOutsideTarget as P,triggerContains as c}from"../internal/dismiss.js";import{optOutBoolean as b,positionFloating as O}from"../internal/positioning.js";import{hiddenHostStyles as w}from"../internal/styles.js";var e=class extends m{constructor(){super(...arguments);this.side="bottom";this.align="center";this.sideOffset=4;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.onRootUpdate=()=>this.syncHostState();this.handlePointerEnter=t=>{t.pointerType!=="touch"&&this.root?.cancelClose()};this.handlePointerLeave=t=>{t.pointerType!=="touch"&&this.root?.scheduleClose()};this.handleOutsidePointerDown=t=>{if(!this.root?.open)return;let i=t.target;this.contains(i)||c(this.root.triggerEl,i)||h(this,"pointer-down-outside",t)&&this.root.close()};this.handleOutsideFocus=t=>{if(!this.root?.open)return;let i=P(t);!i||this.contains(i)||c(this.root.triggerEl,i)||h(this,"focus-outside",t)&&this.root.close()};this.handleKeyDown=t=>{t.key==="Escape"&&(t.preventDefault(),E(this,t)&&this.root&&(this.root.close(),this.root.focusTrigger()))}}connectedCallback(){super.connectedCallback(),this.root=g(this,"skdx-hover-card, skdx-hover-card-root"),this.root?.addEventListener("skdx-hover-card-internal-update",this.onRootUpdate),this.addEventListener("pointerenter",this.handlePointerEnter),this.addEventListener("pointerleave",this.handlePointerLeave),document.addEventListener("pointerdown",this.handleOutsidePointerDown),document.addEventListener("focusin",this.handleOutsideFocus),this.root&&(this.id?this.root.contentId=this.id:this.id=this.root.contentId,this.root.contentEl=this),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener("skdx-hover-card-internal-update",this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),document.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("pointerdown",this.handleOutsidePointerDown),document.removeEventListener("focusin",this.handleOutsideFocus),this.cleanupPosition?.(),super.disconnectedCallback()}firstUpdated(){this.root?.open&&this.activate()}syncHostState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed"),this.setAttribute("data-side",this.side??"bottom"),this.setAttribute("data-align",this.align??"center"),this.hidden=!t,t?document.addEventListener("keydown",this.handleKeyDown):document.removeEventListener("keydown",this.handleKeyDown),t?this.activate():this.deactivate()}activate(){this.cleanupPosition||!this.root?.triggerEl||(this.cleanupPosition=O(this.root.triggerEl,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"hover-card",arrow:()=>this.querySelector("skdx-hover-card-arrow")}))}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0}render(){return f`<slot></slot>`}};e.styles=[w,v`
       :host {
         display: block;
       }

package/dist/hover-card/HoverCardPortal.d.cts

@@ -1,18 +1,8 @@
 import { SkdxPortal } from '../utils/portal.cjs';
 /**
- * `<skdx-hover-card-portal>` — teleports `<skdx-hover-card-content>` to
- * `document.body` (or a custom `container`), so the card escapes any
- * clipping or `overflow` ancestor of the link it hangs off.
- *
- * The **host element stays where you wrote it** and the *children* are the
- * things that move, into a `<div data-skdx-portal>` — so removing the family
- * root removes the portalled content with it, and the parts inside still
- * resolve that root through `closestThroughPortal()`.
- *
- * Adds nothing to `<skdx-portal>` but its tag name. Unlike React's
- * `HoverCardPortal` it takes no `force-mount` and does not unmount on close: the
- * parts here never unmount, they hide via `hidden`, so there is nothing to
- * force and nothing to keep alive for an exit animation.
+ * Teleports content to `document.body` (or custom `container`), escaping clipping/overflow.
+ * Host stays in place; children move to `data-skdx-portal` div (parts resolve root via
+ * closestThroughPortal). No force-mount (parts hide via hidden, never unmount).
  *
  * @example
  * ```html

package/dist/hover-card/HoverCardPortal.d.ts

@@ -1,18 +1,8 @@
 import { SkdxPortal } from '../utils/portal.js';
 /**
- * `<skdx-hover-card-portal>` — teleports `<skdx-hover-card-content>` to
- * `document.body` (or a custom `container`), so the card escapes any
- * clipping or `overflow` ancestor of the link it hangs off.
- *
- * The **host element stays where you wrote it** and the *children* are the
- * things that move, into a `<div data-skdx-portal>` — so removing the family
- * root removes the portalled content with it, and the parts inside still
- * resolve that root through `closestThroughPortal()`.
- *
- * Adds nothing to `<skdx-portal>` but its tag name. Unlike React's
- * `HoverCardPortal` it takes no `force-mount` and does not unmount on close: the
- * parts here never unmount, they hide via `hidden`, so there is nothing to
- * force and nothing to keep alive for an exit animation.
+ * Teleports content to `document.body` (or custom `container`), escaping clipping/overflow.
+ * Host stays in place; children move to `data-skdx-portal` div (parts resolve root via
+ * closestThroughPortal). No force-mount (parts hide via hidden, never unmount).
  *
  * @example
  * ```html

package/dist/hover-card/HoverCardRoot.cjs

@@ -0,0 +1,5 @@
+"use strict";var p=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var T=Object.getOwnPropertyNames;var b=Object.prototype.hasOwnProperty;var y=(i,t)=>{for(var e in t)p(i,e,{get:t[e],enumerable:!0})},g=(i,t,e,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of T(t))!b.call(i,s)&&s!==e&&p(i,s,{get:()=>t[s],enumerable:!(o=d(t,s))||o.enumerable});return i};var C=i=>g(p({},"__esModule",{value:!0}),i),l=(i,t,e,o)=>{for(var s=o>1?void 0:o?d(t,e):t,c=i.length-1,h;c>=0;c--)(h=i[c])&&(s=(o?h(t,e,s):h(s))||s);return o&&s&&p(t,e,s),s};var O={};y(O,{SkdxHoverCardRoot:()=>n});module.exports=C(O);var a=require("lit"),r=require("lit/decorators.js"),m=require("../internal/define.cjs"),u=require("../internal/ids.cjs"),f=require("../internal/open-change-complete.cjs"),v=require("../internal/styles.cjs"),w=require("./HoverCardPortal.cjs");var n=class extends a.LitElement{constructor(){super(...arguments);this.open=!1;this.defaultOpen=!1;this.openDelay=700;this.closeDelay=300;this.disabled=!1;this.contentId=(0,u.nextId)("skdx-hover-card-content");this.triggerEl=null;this.contentEl=null;this.hasUpdatedOnce=!1;this.silentClose=!1}connectedCallback(){super.connectedCallback(),this.defaultOpen&&!this.hasAttribute("open")&&(this.open=!0)}disconnectedCallback(){this.clearTimers(),this.teardownOpenChangeComplete?.(),super.disconnectedCallback()}willUpdate(e){e.has("disabled")&&this.disabled&&this.open&&(this.silentClose=!0,this.open=!1)}updated(e){let o=!this.hasUpdatedOnce;this.hasUpdatedOnce=!0,e.has("open")&&!o&&!this.silentClose&&this.dispatchEvent(new CustomEvent("open-change",{detail:this.open,bubbles:!0,composed:!0})),this.silentClose=!1,e.size>0&&this.dispatchEvent(new CustomEvent("skdx-hover-card-internal-update")),e.has("open")&&!o&&(this.teardownOpenChangeComplete?.(),this.teardownOpenChangeComplete=(0,f.notifyOpenChangeComplete)(()=>this.querySelector("skdx-hover-card-content"),this.open,s=>this.dispatchEvent(new CustomEvent("open-change-complete",{detail:s,bubbles:!0,composed:!0}))))}setOpen(e){this.open!==e&&(this.open=e)}clearTimers(){clearTimeout(this.openTimer),clearTimeout(this.closeTimer)}close(){this.clearTimers(),this.setOpen(!1)}scheduleOpen(){this.disabled||(this.clearTimers(),this.openTimer=setTimeout(()=>this.setOpen(!0),this.openDelay))}scheduleClose(){this.clearTimers(),this.closeTimer=setTimeout(()=>this.setOpen(!1),this.closeDelay)}cancelClose(){this.clearTimers()}focusTrigger(){this.triggerEl?.focus()}render(){return a.html`<slot></slot>`}};n.styles=[v.hiddenHostStyles,a.css`
+      :host {
+        display: contents;
+      }
+    `],l([(0,r.property)({type:Boolean,reflect:!0})],n.prototype,"open",2),l([(0,r.property)({type:Boolean,attribute:"default-open"})],n.prototype,"defaultOpen",2),l([(0,r.property)({type:Number,attribute:"open-delay"})],n.prototype,"openDelay",2),l([(0,r.property)({type:Number,attribute:"close-delay"})],n.prototype,"closeDelay",2),l([(0,r.property)({type:Boolean,reflect:!0})],n.prototype,"disabled",2),n=l([(0,m.customElement)("skdx-hover-card-root")],n);0&&(module.exports={SkdxHoverCardRoot});

package/dist/hover-card/HoverCardRoot.d.cts

@@ -0,0 +1,69 @@
+import { LitElement } from 'lit';
+import './HoverCardPortal.cjs';
+/**
+ * HoverCard state primitive: open state with independent open / close delays.
+ * Pointer-only (no keyboard activation); content is not tabbable by design.
+ * Pointer can move from trigger to content without closing.
+ * @example
+ * ```html
+ * <skdx-hover-card-root>
+ *   <skdx-hover-card-trigger href="/users/kent">@kentcdodds</skdx-hover-card-trigger>
+ *   <skdx-hover-card-content>Kent C. Dodds</skdx-hover-card-content>
+ * </skdx-hover-card-root>
+ * ```
+ * @fires open-change - New state on every change, controlled or not.
+ * @fires open-change-complete - New state after content animation settles; not cancelable.
+ */
+export declare class SkdxHoverCardRoot extends LitElement {
+    static styles: import("lit").CSSResult[];
+    /**
+     * Whether the card is currently open and visible.
+     * @default false
+     */
+    open: boolean;
+    /** Initial open state (uncontrolled); applied once on connect if `open` unset. @default false */
+    defaultOpen: boolean;
+    /**
+     * Delay before the card opens on pointer enter (ms).
+     * @default 700
+     */
+    openDelay: number;
+    /** Delay before card closes after pointer leaves trigger and content (ms). @default 300 */
+    closeDelay: number;
+    /** Suppress opening; pointer enter does nothing and aria-describedby is unset. @default false */
+    disabled: boolean;
+    /** @internal Rewritten to a recipe host's own `id` when one is forwarded onto the derived Content — see `host-attributes.ts`. */
+    contentId: string;
+    /** @internal Set by `<skdx-hover-card-trigger>` once its native anchor mounts. */
+    triggerEl: HTMLElement | null;
+    /** @internal Panel element, set by content while connected (portal moves it outside closest reach). */
+    contentEl: HTMLElement | null;
+    private openTimer?;
+    private closeTimer?;
+    private hasUpdatedOnce;
+    private teardownOpenChangeComplete?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /** Set when disabled closes open card, so forced close is not reported. */
+    private silentClose;
+    protected willUpdate(changed: Map<string, unknown>): void;
+    protected updated(changed: Map<string, unknown>): void;
+    private setOpen;
+    private clearTimers;
+    /** @internal Closes immediately, cancelling any pending timer, e.g. on Escape. */
+    close(): void;
+    /** @internal Opens after `openDelay`, e.g. on trigger pointer-enter. */
+    scheduleOpen(): void;
+    /** @internal Closes after `closeDelay`, e.g. on trigger/content pointer-leave. */
+    scheduleClose(): void;
+    /** @internal Cancels a pending close, e.g. when the pointer enters the content. */
+    cancelClose(): void;
+    /** @internal */
+    focusTrigger(): void;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-hover-card-root': SkdxHoverCardRoot;
+    }
+}