@primitiv-ui/web 0.1.55 → 0.1.56

package/README.md

@@ -6,7 +6,7 @@ framework and no runtime dependencies beyond
 server-rendered stack (HTMX, Rails, Django, Laravel, Spring …), and inside
 React, Vue, Angular or any other framework.
 
-> **Status: published.** Tabs, Accordion, Collapsible, Modal and Popover so far. See
+> **Status: published.** Tabs, Accordion, Collapsible, Modal, Popover and Tooltip so far. See
 > [RFC 0033](../../docs/rfcs/0033-web-components.md) for the design.
 
 ## Components
@@ -18,6 +18,7 @@ React, Vue, Angular or any other framework.
 | Collapsible | `primitiv-collapsible`, `-trigger`, `-content`, `-trigger-icon` | `primitiv-collapsible-change` | 0.1.47 |
 | Modal | `primitiv-modal`, `-trigger`, `-content`, `-title`, `-description`, `-close` | `primitiv-modal-change` | 0.1.54 |
 | Popover | `primitiv-popover`, `-trigger`, `-anchor`, `-content`, `-title`, `-description`, `-close` | `primitiv-popover-change` | 0.1.55 |
+| Tooltip | `primitiv-tooltip`, `-provider`, `-trigger`, `-content`, `-arrow` | `primitiv-tooltip-change` | 0.1.56 |
 
 ## Use it
 
@@ -50,9 +51,10 @@ downloads it once. `dist/primitiv-web.js` is the alternative: every element in
 one file. Per-component files ship from 0.1.43.
 
 The main entry (`@primitiv-ui/web`, `/tabs`, `/accordion`, `/collapsible`,
-`/modal`, `/popover`) exports the classes and `defineTabs(registry?)` /
+`/modal`, `/popover`, `/tooltip`) exports the classes and `defineTabs(registry?)` /
 `defineAccordion(registry?)` / `defineCollapsible(registry?)` /
-`defineModal(registry?)` / `definePopover(registry?)` with **no side effects**.
+`defineModal(registry?)` / `definePopover(registry?)` / `defineTooltip(registry?)`
+with **no side effects**.
 
 **Render `hidden` on inactive panels yourself.** Until the module loads, CSS
 cannot tell which panel is active, so markup that omits it shows every panel.
@@ -183,6 +185,37 @@ on a panel as it becomes active, for lazy loading.
   **Listen with `primitiv-popover-change`** (bubbles, cancelable, `detail: {
   open }`), fired before every user-driven change, a light dismiss included.
 
+### Tooltip
+
+```html
+<script type="module" src="https://cdn.jsdelivr.net/npm/@primitiv-ui/web@<version>/dist/cdn/tooltip.js"></script>
+
+<primitiv-tooltip>
+  <primitiv-tooltip-trigger><button type="button">Save</button></primitiv-tooltip-trigger>
+  <primitiv-tooltip-content popover="manual">
+    Saves your work
+    <primitiv-tooltip-arrow></primitiv-tooltip-arrow>
+  </primitiv-tooltip-content>
+</primitiv-tooltip>
+```
+
+- **It opens on hover after `delay-duration` (700 ms) and on focus at once**,
+  and closes when the pointer leaves (after a short grace period, so the pointer
+  can reach the bubble — `disable-hoverable-content` turns that off), on blur,
+  on Escape and on a press outside. The element gives the bubble
+  `role="tooltip"` and the trigger's button `aria-describedby`.
+- **It is a native `popover="manual"`** in the top layer, shown with the
+  trigger as its source, so CSS anchor positioning places it with no
+  `anchor-name` / `position-anchor` pair. Write `popover="manual"` yourself so
+  the bubble is hidden before the script loads.
+- **Moving from one trigger to the next opens each next tooltip at once** (the
+  skip delay, 300 ms). Tooltips inside a `<primitiv-tooltip-provider>` share its
+  `delay-duration` and `skip-delay-duration`; the rest share a document-wide
+  window.
+- **`open` on the root is the state**; the `open` property reads and sets it.
+  **Listen with `primitiv-tooltip-change`** (bubbles, cancelable, `detail: {
+  open }`), fired before every user-driven change.
+
 **TypeScript** — opt into the tag map so DOM queries return the element classes:
 `import type {} from "@primitiv-ui/web/tags"` (npm only).
 

package/dist/cdn/tooltip.js

@@ -0,0 +1 @@
+import{a as l,b as s,c as f,d as E,f as T}from"./chunks/chunk-QVNDDONZ.js";function b({groupOpen:n,delay:t}){return n?0:t}var d=class{#t;#o=null;#e=null;#n=t=>this.#r(t);#i=t=>this.#p(t);constructor(t){this.#t=t}openNow(){this.#l(),this.#t.change(!0),this.#t.tooltipGroup().opened()}hoverStart(){let t=b({groupOpen:this.#t.tooltipGroup().isOpen(),delay:this.#t.delay()});if(t===0){this.openNow();return}this.#o=setTimeout(()=>{this.openNow(),this.#o=null},t)}closeNow(){this.holdOpen(),this.#t.change(!1),this.#t.tooltipGroup().closed()}hoverEnd(){this.#l(),this.#e=setTimeout(()=>{this.#t.change(!1),this.#t.tooltipGroup().closed(),this.#e=null},100)}holdOpen(){this.#e!==null&&(clearTimeout(this.#e),this.#e=null)}sync(){let{open:t}=this.#t.state();t?(document.addEventListener("keydown",this.#n),document.addEventListener("pointerdown",this.#i)):this.#s()}#s(){document.removeEventListener("keydown",this.#n),document.removeEventListener("pointerdown",this.#i)}disconnect(){this.#l(),this.holdOpen(),this.#s()}#l(){this.#o!==null&&(clearTimeout(this.#o),this.#o=null)}#r(t){t.key==="Escape"&&(this.#t.escapeKeyDown?.(t),t.defaultPrevented||this.closeNow())}#p(t){this.#t.content()?.contains(t.target)||(this.#t.pointerDownOutside?.(t),t.defaultPrevented||this.closeNow())}};var r=class{#t;#o=!1;#e=null;constructor(t){this.#t=t}isOpen(){return this.#o}opened(){this.#e!==null&&(clearTimeout(this.#e),this.#e=null),this.#o=!0}closed(){clearTimeout(this.#e??void 0),this.#e=setTimeout(()=>{this.#o=!1,this.#e=null},this.#t())}dispose(){clearTimeout(this.#e??void 0)}};var G="primitiv-tooltip",L="primitiv-tooltip-provider",y="primitiv-tooltip-trigger",O="primitiv-tooltip-content",H="primitiv-tooltip-arrow",w=700,g=300;function u(n,t,e){let i=Number(n.getAttribute(t)??Number.NaN);return Number.isNaN(i)?e:i}var R=new r(()=>g),h=class extends l{#t;get group(){return this.#t??=new r(()=>u(this,"skip-delay-duration",g))}},a=class extends T{#t=null;#o=null;#e=null;#n=null;#i=new d(this.#s());controller={connect:()=>{},disconnect:()=>this.#l()};reconcileOn=["open"];get open(){return this.hasAttribute("open")}set open(t){this.toggleAttribute("open",t)}#s(){let t=()=>this.closest(L);return{state:()=>({open:this.open}),change:e=>{e!==this.open&&this.announce("primitiv-tooltip-change",{open:e})&&(this.open=e)},delay:()=>{let e=t();return u(this,"delay-duration",e?u(e,"delay-duration",w):w)},tooltipGroup:()=>t()?.group??R,content:()=>this.#o}}#l(){this.open&&this.#s().tooltipGroup().closed(),this.#n?.abort(),this.#n=null,this.#t=null,this.#o=null,this.#e=null,this.#i.disconnect()}#r(t,e){if(t===this.#t&&e===this.#o)return;this.#n?.abort(),this.#n=new AbortController,this.#t=t,this.#o=e;let i={signal:this.#n.signal},o=this.#i;t?.addEventListener("pointerenter",()=>o.hoverStart(),i),t?.addEventListener("pointerleave",()=>this.hasAttribute("disable-hoverable-content")?o.closeNow():o.hoverEnd(),i),t?.addEventListener("focus",()=>o.openNow(),i),t?.addEventListener("blur",()=>o.closeNow(),i),e?.addEventListener("pointerenter",()=>o.holdOpen(),i),e?.addEventListener("pointerleave",()=>o.closeNow(),i)}reconcile(){let t=this.open,e=t?"open":"closed";s(this,"data-state",e);let[i]=this.parts(y),[o=null]=this.parts(O),p=i?A(i):null;o&&(o.id||(o.id=`${this.rootId()}-content`),s(o,"role","tooltip"),o.hasAttribute("popover")||o.setAttribute("popover","manual"),s(o,"data-state",e)),p&&(s(p,"aria-describedby",o?o.id:null),s(p,"data-state",e)),this.#r(p,o),this.#p(t?o:null),this.#i.sync()}#p(t){if(t===this.#e)return;if(this.#e)try{this.#e.hidePopover()}catch{}if(this.#e=t,!t)return;let e=t;this.#t?e.showPopover({source:this.#t}):e.showPopover()}};function A(n){return n.childElementCount===1?n.firstElementChild:(f(n,`<${y}> needs exactly one element child (a <button>) to decorate.`),null)}var c=class extends l{},m=class extends l{},v=class extends l{};function N(n=globalThis.customElements){E(n,[[G,a],[L,h],[y,c],[O,m],[H,v]])}N();

package/dist/custom-elements.json

@@ -1548,6 +1548,363 @@
           }
         }
       ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/tooltip/elements.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "`<primitiv-tooltip-provider>` — optional. The tooltips inside it share one\nskip-delay window and its default delay, as inside React's\n`Tooltip.Provider`; tooltips outside any provider share a document-wide one.",
+          "name": "PrimitivTooltipProviderElement",
+          "members": [
+            {
+              "kind": "field",
+              "name": "#group",
+              "privacy": "private",
+              "type": {
+                "text": "TooltipGroup | undefined"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "group",
+              "type": {
+                "text": "TooltipGroup"
+              },
+              "description": "The skip-delay window this provider's tooltips share, created on first use.",
+              "readonly": true
+            }
+          ],
+          "attributes": [
+            {
+              "type": {
+                "text": "number"
+              },
+              "description": "How long, in milliseconds, a pointer rests on a trigger before its tooltip opens. Default 700. A tooltip's own `delay-duration` overrides it.",
+              "name": "delay-duration"
+            },
+            {
+              "type": {
+                "text": "number"
+              },
+              "description": "How long, in milliseconds, after one tooltip closes that hovering another opens it at once. Default 300.",
+              "name": "skip-delay-duration"
+            }
+          ],
+          "superclass": {
+            "name": "ElementBase",
+            "module": "/src/internal/element.ts"
+          },
+          "tagName": "primitiv-tooltip-provider",
+          "customElement": true
+        },
+        {
+          "kind": "class",
+          "description": "`<primitiv-tooltip>` — the state owner of a tooltip: a short description of\nits trigger that appears on hover after a delay, and at once on focus. It\ncloses when the pointer leaves (after a moment, so it can be reached),\non blur, on Escape and on a press outside. Moving from one trigger to the\nnext opens each next tooltip at once (the skip delay). The tooltip is shown\nas a `popover=\"manual\"` in the top layer, with the trigger as its source,\nwhich makes the trigger its implicit anchor for CSS anchor positioning.\n\nThe root finds its own parts and reconciles their ARIA from its reflected\nstate whenever a part arrives, leaves, or changes an attribute the root\nreads (the lifecycle is `PrimitivRootElement`'s).",
+          "name": "PrimitivTooltipElement",
+          "members": [
+            {
+              "kind": "field",
+              "name": "#trigger",
+              "privacy": "private",
+              "type": {
+                "text": "HTMLElement | null"
+              },
+              "default": "null",
+              "description": "The decorated trigger button and the tooltip, as of the last reconcile."
+            },
+            {
+              "kind": "field",
+              "name": "#content",
+              "privacy": "private",
+              "type": {
+                "text": "HTMLElement | null"
+              },
+              "default": "null"
+            },
+            {
+              "kind": "field",
+              "name": "#shown",
+              "privacy": "private",
+              "type": {
+                "text": "HTMLElement | null"
+              },
+              "default": "null",
+              "description": "The tooltip this root has shown, while it shows."
+            },
+            {
+              "kind": "field",
+              "name": "#bindings",
+              "privacy": "private",
+              "type": {
+                "text": "AbortController | null"
+              },
+              "default": "null",
+              "description": "The listeners on the trigger and the tooltip, rebuilt when either changes."
+            },
+            {
+              "kind": "field",
+              "name": "#tooltip",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new TooltipController(this.#host())"
+            },
+            {
+              "kind": "field",
+              "name": "controller",
+              "type": {
+                "text": "{ connect(): void; disconnect(): void }"
+              },
+              "privacy": "protected",
+              "readonly": true,
+              "default": "{ connect: (): void => {}, disconnect: (): void => this.#disconnect(), }"
+            },
+            {
+              "kind": "field",
+              "name": "reconcileOn",
+              "type": {
+                "text": "readonly string[]"
+              },
+              "privacy": "protected",
+              "readonly": true,
+              "default": "[\"open\"]"
+            },
+            {
+              "kind": "field",
+              "name": "open",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Whether the tooltip is showing, reflected as the boolean `open` attribute."
+            },
+            {
+              "kind": "method",
+              "name": "#host",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "TooltipControllerHost"
+                }
+              },
+              "description": "The controller's view of this element: state lives in the reflected attribute."
+            },
+            {
+              "kind": "method",
+              "name": "#disconnect",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "#bind",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "trigger",
+                  "type": {
+                    "text": "HTMLElement | null"
+                  }
+                },
+                {
+                  "name": "content",
+                  "type": {
+                    "text": "HTMLElement | null"
+                  }
+                }
+              ],
+              "description": "Listen on `trigger` and `content`, rebinding only when either changed."
+            },
+            {
+              "kind": "method",
+              "name": "reconcile",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "#show",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "content",
+                  "type": {
+                    "text": "HTMLElement | null"
+                  }
+                }
+              ],
+              "description": "Show `content` (anchored to the trigger), or hide what is showing when it is `null`."
+            }
+          ],
+          "events": [
+            {
+              "type": {
+                "text": "CustomEvent<{ open: boolean }>"
+              },
+              "description": "Bubbles, cancelable, fired before a user-driven change is applied — hover, focus, blur, Escape or a press outside — with the open state afterwards. Call `preventDefault()` to veto it.",
+              "name": "primitiv-tooltip-change"
+            }
+          ],
+          "attributes": [
+            {
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Whether the tooltip is showing. Reflected: it changes as the user hovers, focuses and dismisses it. Set it (or the `open` property) to show or hide it from script.",
+              "name": "open"
+            },
+            {
+              "type": {
+                "text": "number"
+              },
+              "description": "How long, in milliseconds, a pointer rests on the trigger before the tooltip opens. Defaults to the provider's, or 700. Focus always opens it at once.",
+              "name": "delay-duration"
+            },
+            {
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Close as soon as the pointer leaves the trigger, rather than giving it a moment to reach the tooltip.",
+              "name": "disable-hoverable-content"
+            }
+          ],
+          "superclass": {
+            "name": "PrimitivRootElement",
+            "module": "/src/internal/RootElement.ts"
+          },
+          "tagName": "primitiv-tooltip",
+          "customElement": true,
+          "summary": "The state owner of a tooltip, shown on hover and focus."
+        },
+        {
+          "kind": "class",
+          "description": "`<primitiv-tooltip-trigger>` — an interactive part. It decorates exactly one\nchild the consumer writes, a `<button>`, which opens the tooltip on hover and\nfocus and is described by it (`aria-describedby`), so the rendered DOM\nmatches React's (RFC 0033 D24).",
+          "name": "PrimitivTooltipTriggerElement",
+          "superclass": {
+            "name": "ElementBase",
+            "module": "/src/internal/element.ts"
+          },
+          "tagName": "primitiv-tooltip-trigger",
+          "customElement": true
+        },
+        {
+          "kind": "class",
+          "description": "`<primitiv-tooltip-content>` — the tooltip itself. Structural: the root\ngives it an id, `role=\"tooltip\"`, `popover=\"manual\"` (write it in your markup\ntoo, so it is hidden before the script loads) and `data-state`.",
+          "name": "PrimitivTooltipContentElement",
+          "superclass": {
+            "name": "ElementBase",
+            "module": "/src/internal/element.ts"
+          },
+          "tagName": "primitiv-tooltip-content",
+          "customElement": true
+        },
+        {
+          "kind": "class",
+          "description": "`<primitiv-tooltip-arrow>` — an optional, decorative pointer, inside the\ncontent. The element writes nothing on it; style it as you like.",
+          "name": "PrimitivTooltipArrowElement",
+          "superclass": {
+            "name": "ElementBase",
+            "module": "/src/internal/element.ts"
+          },
+          "tagName": "primitiv-tooltip-arrow",
+          "customElement": true
+        },
+        {
+          "kind": "function",
+          "name": "defineTooltip",
+          "return": {
+            "type": {
+              "text": "void"
+            }
+          },
+          "parameters": [
+            {
+              "name": "registry",
+              "default": "globalThis.customElements",
+              "type": {
+                "text": "ElementRegistry | undefined"
+              }
+            }
+          ],
+          "description": "Define the five Tooltip elements on `registry` (the global `customElements`\nby default). Safe to call more than once, and a no-op where there is no\nregistry (a server render)."
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "ElementRegistry",
+          "declaration": {
+            "name": "ElementRegistry",
+            "module": "src/tooltip/elements.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "PrimitivTooltipProviderElement",
+          "declaration": {
+            "name": "PrimitivTooltipProviderElement",
+            "module": "src/tooltip/elements.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "PrimitivTooltipElement",
+          "declaration": {
+            "name": "PrimitivTooltipElement",
+            "module": "src/tooltip/elements.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "PrimitivTooltipTriggerElement",
+          "declaration": {
+            "name": "PrimitivTooltipTriggerElement",
+            "module": "src/tooltip/elements.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "PrimitivTooltipContentElement",
+          "declaration": {
+            "name": "PrimitivTooltipContentElement",
+            "module": "src/tooltip/elements.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "PrimitivTooltipArrowElement",
+          "declaration": {
+            "name": "PrimitivTooltipArrowElement",
+            "module": "src/tooltip/elements.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "defineTooltip",
+          "declaration": {
+            "name": "defineTooltip",
+            "module": "src/tooltip/elements.ts"
+          }
+        }
+      ]
     }
   ]
 }

package/dist/define/index.d.ts

@@ -7,3 +7,4 @@ import "./collapsible.js";
 import "./modal.js";
 import "./popover.js";
 import "./tabs.js";
+import "./tooltip.js";

package/dist/define/index.js

@@ -7,3 +7,4 @@ import "./collapsible.js";
 import "./modal.js";
 import "./popover.js";
 import "./tabs.js";
+import "./tooltip.js";

package/dist/define/tooltip.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/define/tooltip.js

@@ -0,0 +1,11 @@
+/**
+ * Side-effect entry: importing this module defines the five Tooltip elements
+ * (`<primitiv-tooltip>`, `-provider`, `-trigger`, `-content`, `-arrow`) on the
+ * global `customElements` registry.
+ *
+ * ```html
+ * <script type="module">import "@primitiv-ui/web/define/tooltip";</script>
+ * ```
+ */
+import { defineTooltip } from "../tooltip/elements.js";
+defineTooltip();

package/dist/frameworks/events.d.ts

@@ -23,3 +23,7 @@ export type PrimitivModalChangeEvent = CustomEvent<{
 export type PrimitivPopoverChangeEvent = CustomEvent<{
     open: boolean;
 }>;
+/** The `primitiv-tooltip-change` event: bubbles, cancelable, fired before the change applies, with the open state afterwards. */
+export type PrimitivTooltipChangeEvent = CustomEvent<{
+    open: boolean;
+}>;

package/dist/frameworks/react.d.ts

@@ -23,12 +23,13 @@ import type { PrimitivCollapsibleContentElement, PrimitivCollapsibleElement, Pri
 import type { PrimitivModalCloseElement, PrimitivModalContentElement, PrimitivModalDescriptionElement, PrimitivModalElement, PrimitivModalTitleElement, PrimitivModalTriggerElement } from "../modal/elements.js";
 import type { PrimitivPopoverAnchorElement, PrimitivPopoverCloseElement, PrimitivPopoverContentElement, PrimitivPopoverDescriptionElement, PrimitivPopoverElement, PrimitivPopoverTitleElement, PrimitivPopoverTriggerElement } from "../popover/elements.js";
 import type { PrimitivTabsContentElement, PrimitivTabsElement, PrimitivTabsListElement, PrimitivTabsTriggerElement } from "../tabs/elements.js";
-import type { PrimitivAccordionChangeEvent, PrimitivCollapsibleChangeEvent, PrimitivModalChangeEvent, PrimitivPopoverChangeEvent, PrimitivTabsChangeEvent } from "./events.js";
+import type { PrimitivTooltipArrowElement, PrimitivTooltipContentElement, PrimitivTooltipElement, PrimitivTooltipProviderElement, PrimitivTooltipTriggerElement } from "../tooltip/elements.js";
+import type { PrimitivAccordionChangeEvent, PrimitivCollapsibleChangeEvent, PrimitivModalChangeEvent, PrimitivPopoverChangeEvent, PrimitivTabsChangeEvent, PrimitivTooltipChangeEvent } from "./events.js";
 /** React's own props for an element, plus `class`, which React 19 passes to custom elements. */
 type ElementProps<E extends HTMLElement> = DetailedHTMLProps<HTMLAttributes<E>, E> & {
     class?: string;
 };
-export type { PrimitivAccordionChangeEvent, PrimitivCollapsibleChangeEvent, PrimitivModalChangeEvent, PrimitivPopoverChangeEvent, PrimitivTabsChangeEvent, };
+export type { PrimitivAccordionChangeEvent, PrimitivCollapsibleChangeEvent, PrimitivModalChangeEvent, PrimitivPopoverChangeEvent, PrimitivTabsChangeEvent, PrimitivTooltipChangeEvent, };
 declare module "react" {
     namespace JSX {
         interface IntrinsicElements {
@@ -99,6 +100,21 @@ declare module "react" {
                 value: string;
                 "onprimitiv-tabs-show"?: (event: CustomEvent) => void;
             };
+            "primitiv-tooltip": ElementProps<PrimitivTooltipElement> & {
+                open?: boolean;
+                "delay-duration"?: number | string;
+                "disable-hoverable-content"?: boolean;
+                "onprimitiv-tooltip-change"?: (event: PrimitivTooltipChangeEvent) => void;
+            };
+            "primitiv-tooltip-provider": ElementProps<PrimitivTooltipProviderElement> & {
+                "delay-duration"?: number | string;
+                "skip-delay-duration"?: number | string;
+            };
+            "primitiv-tooltip-trigger": ElementProps<PrimitivTooltipTriggerElement>;
+            "primitiv-tooltip-content": ElementProps<PrimitivTooltipContentElement> & {
+                popover?: "auto" | "manual" | "";
+            };
+            "primitiv-tooltip-arrow": ElementProps<PrimitivTooltipArrowElement>;
         }
     }
 }

package/dist/frameworks/svelte.d.ts

@@ -22,7 +22,8 @@ import type { PrimitivCollapsibleContentElement, PrimitivCollapsibleElement, Pri
 import type { PrimitivModalCloseElement, PrimitivModalContentElement, PrimitivModalDescriptionElement, PrimitivModalElement, PrimitivModalTitleElement, PrimitivModalTriggerElement } from "../modal/elements.js";
 import type { PrimitivPopoverAnchorElement, PrimitivPopoverCloseElement, PrimitivPopoverContentElement, PrimitivPopoverDescriptionElement, PrimitivPopoverElement, PrimitivPopoverTitleElement, PrimitivPopoverTriggerElement } from "../popover/elements.js";
 import type { PrimitivTabsContentElement, PrimitivTabsElement, PrimitivTabsListElement, PrimitivTabsTriggerElement } from "../tabs/elements.js";
-import type { PrimitivAccordionChangeEvent, PrimitivCollapsibleChangeEvent, PrimitivModalChangeEvent, PrimitivPopoverChangeEvent, PrimitivTabsChangeEvent } from "./events.js";
+import type { PrimitivTooltipArrowElement, PrimitivTooltipContentElement, PrimitivTooltipElement, PrimitivTooltipProviderElement, PrimitivTooltipTriggerElement } from "../tooltip/elements.js";
+import type { PrimitivAccordionChangeEvent, PrimitivCollapsibleChangeEvent, PrimitivModalChangeEvent, PrimitivPopoverChangeEvent, PrimitivTabsChangeEvent, PrimitivTooltipChangeEvent } from "./events.js";
 /** Svelte's own attributes and events for an element. */
 type Attributes<E extends HTMLElement> = HTMLAttributes<E>;
 declare module "svelte/elements" {
@@ -92,6 +93,19 @@ declare module "svelte/elements" {
             value: string;
             "onprimitiv-tabs-show"?: (event: CustomEvent) => void;
         };
+        "primitiv-tooltip": Attributes<PrimitivTooltipElement> & {
+            open?: boolean;
+            "delay-duration"?: number | string;
+            "disable-hoverable-content"?: boolean;
+            "onprimitiv-tooltip-change"?: (event: PrimitivTooltipChangeEvent) => void;
+        };
+        "primitiv-tooltip-provider": Attributes<PrimitivTooltipProviderElement> & {
+            "delay-duration"?: number | string;
+            "skip-delay-duration"?: number | string;
+        };
+        "primitiv-tooltip-trigger": Attributes<PrimitivTooltipTriggerElement>;
+        "primitiv-tooltip-content": Attributes<PrimitivTooltipContentElement>;
+        "primitiv-tooltip-arrow": Attributes<PrimitivTooltipArrowElement>;
     }
 }
 export {};

package/dist/frameworks/vue.d.ts

@@ -19,7 +19,7 @@
  * JSR does not allow a published module to do.
  */
 import type { DefineComponent, EmitsOptions } from "vue";
-import type { PrimitivAccordionChangeEvent, PrimitivCollapsibleChangeEvent, PrimitivModalChangeEvent, PrimitivPopoverChangeEvent, PrimitivTabsChangeEvent } from "./events.js";
+import type { PrimitivAccordionChangeEvent, PrimitivCollapsibleChangeEvent, PrimitivModalChangeEvent, PrimitivPopoverChangeEvent, PrimitivTabsChangeEvent, PrimitivTooltipChangeEvent } from "./events.js";
 /** A tag as Vue's template checker sees it: its props, and the events it emits. */
 type Tag<Props, Events extends EmitsOptions = Record<never, never>> = DefineComponent<Props, Record<never, never>, Record<never, never>, Record<never, never>, Record<never, never>, Record<never, never>, Record<never, never>, Events>;
 declare module "vue" {
@@ -97,6 +97,20 @@ declare module "vue" {
         }, {
             "primitiv-tabs-show": (event: CustomEvent) => void;
         }>;
+        "primitiv-tooltip": Tag<{
+            open?: boolean | "";
+            delayDuration?: number | string;
+            disableHoverableContent?: boolean | "";
+        }, {
+            "primitiv-tooltip-change": (event: PrimitivTooltipChangeEvent) => void;
+        }>;
+        "primitiv-tooltip-provider": Tag<{
+            delayDuration?: number | string;
+            skipDelayDuration?: number | string;
+        }>;
+        "primitiv-tooltip-trigger": Tag<Record<never, never>>;
+        "primitiv-tooltip-content": Tag<Record<never, never>>;
+        "primitiv-tooltip-arrow": Tag<Record<never, never>>;
     }
 }
 export {};

package/dist/index.d.ts

@@ -8,3 +8,4 @@ export * from "./collapsible/index.js";
 export * from "./modal/index.js";
 export * from "./popover/index.js";
 export * from "./tabs/index.js";
+export * from "./tooltip/index.js";

package/dist/index.js

@@ -8,3 +8,4 @@ export * from "./collapsible/index.js";
 export * from "./modal/index.js";
 export * from "./popover/index.js";
 export * from "./tabs/index.js";
+export * from "./tooltip/index.js";