@aria-ui/tooltip - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2

CHANGELOG.md

 # @aria-ui/tooltip
 
+## 0.0.2
+
+### Patch Changes
+
+- 6fe6e2c: Add `TooltipPositionerElement`, `TooltipRootElement`, and `TooltipTriggerElement`.
+- Updated dependencies [6fe6e2c]
+- Updated dependencies [6fe6e2c]
+  - @aria-ui/overlay@0.0.4
+
 ## 0.0.1
@@ -4,0 +13,0 @@

dist/index.d.ts

@@ -0,3 +1,3 @@
+import { BaseElement, ConnectableElement, SingalState } from '@aria-ui/core';
 import { OverlayPositionerProps } from '@aria-ui/overlay';
-import { ConnectableElement, SingalState } from '@aria-ui/core';
 
@@ -17,4 +17,52 @@ /**
 /**
+ * A custom TooltipPositioner element.
+ *
+ * Properties: {@link TooltipPositionerProps}
+ *
  * @group TooltipPositioner
  */
+declare class TooltipPositionerElement extends BaseElement implements TooltipPositionerProps {
+    private _s;
+    constructor(props?: Partial<TooltipPositionerProps>);
+    /** @hidden */ get strategy(): TooltipPositionerProps["strategy"];
+    /** @hidden */ set strategy(v: TooltipPositionerProps["strategy"]);
+    /** @hidden */ get placement(): TooltipPositionerProps["placement"];
+    /** @hidden */ set placement(v: TooltipPositionerProps["placement"]);
+    /** @hidden */ get autoUpdate(): TooltipPositionerProps["autoUpdate"];
+    /** @hidden */ set autoUpdate(v: TooltipPositionerProps["autoUpdate"]);
+    /** @hidden */ get hoist(): TooltipPositionerProps["hoist"];
+    /** @hidden */ set hoist(v: TooltipPositionerProps["hoist"]);
+    /** @hidden */ get offset(): TooltipPositionerProps["offset"];
+    /** @hidden */ set offset(v: TooltipPositionerProps["offset"]);
+    /** @hidden */ get flip(): TooltipPositionerProps["flip"];
+    /** @hidden */ set flip(v: TooltipPositionerProps["flip"]);
+    /** @hidden */ get shift(): TooltipPositionerProps["shift"];
+    /** @hidden */ set shift(v: TooltipPositionerProps["shift"]);
+    /** @hidden */ get overlap(): TooltipPositionerProps["overlap"];
+    /** @hidden */ set overlap(v: TooltipPositionerProps["overlap"]);
+    /** @hidden */ get fitViewport(): TooltipPositionerProps["fitViewport"];
+    /** @hidden */ set fitViewport(v: TooltipPositionerProps["fitViewport"]);
+    /** @hidden */ get sameWidth(): TooltipPositionerProps["sameWidth"];
+    /** @hidden */ set sameWidth(v: TooltipPositionerProps["sameWidth"]);
+    /** @hidden */ get sameHeight(): TooltipPositionerProps["sameHeight"];
+    /** @hidden */ set sameHeight(v: TooltipPositionerProps["sameHeight"]);
+    /** @hidden */ get inline(): TooltipPositionerProps["inline"];
+    /** @hidden */ set inline(v: TooltipPositionerProps["inline"]);
+    /** @hidden */ get hide(): TooltipPositionerProps["hide"];
+    /** @hidden */ set hide(v: TooltipPositionerProps["hide"]);
+    /** @hidden */ get boundary(): TooltipPositionerProps["boundary"];
+    /** @hidden */ set boundary(v: TooltipPositionerProps["boundary"]);
+    /** @hidden */ get rootBoundary(): TooltipPositionerProps["rootBoundary"];
+    /** @hidden */ set rootBoundary(v: TooltipPositionerProps["rootBoundary"]);
+    /** @hidden */ get overflowPadding(): TooltipPositionerProps["overflowPadding"];
+    /** @hidden */ set overflowPadding(v: TooltipPositionerProps["overflowPadding"]);
+    /** @hidden */ get elementContext(): TooltipPositionerProps["elementContext"];
+    /** @hidden */ set elementContext(v: TooltipPositionerProps["elementContext"]);
+    /** @hidden */ get altBoundary(): TooltipPositionerProps["altBoundary"];
+    /** @hidden */ set altBoundary(v: TooltipPositionerProps["altBoundary"]);
+}
+
+/**
+ * @group TooltipPositioner
+ */
 declare function useTooltipPositioner(element: ConnectableElement, props?: Partial<TooltipPositionerProps>): SingalState<TooltipPositionerProps>;
@@ -39,11 +87,36 @@
 /**
+ * A custom TooltipRoot element.
+ *
+ * Properties: {@link TooltipRootProps}
+ *
  * @group TooltipRoot
  */
+declare class TooltipRootElement extends BaseElement implements TooltipRootProps {
+    private _s;
+    constructor(props?: Partial<TooltipRootProps>);
+    /** @hidden */ get delay(): TooltipRootProps["delay"];
+    /** @hidden */ set delay(v: TooltipRootProps["delay"]);
+    /** @hidden */ get skipDelay(): TooltipRootProps["skipDelay"];
+    /** @hidden */ set skipDelay(v: TooltipRootProps["skipDelay"]);
+}
+
+/**
+ * @group TooltipRoot
+ */
 declare function useTooltipRoot(element: ConnectableElement, props?: Partial<TooltipRootProps>): SingalState<TooltipRootProps>;
 
 /**
+ * A custom TooltipTrigger element.
+ *
  * @group TooltipTrigger
  */
+declare class TooltipTriggerElement extends BaseElement {
+    constructor();
+}
+
+/**
+ * @group TooltipTrigger
+ */
 declare function useTooltipTrigger(element: ConnectableElement): void;
 
-export { type TooltipPositionerProps, type TooltipRootProps, useTooltipPositioner, useTooltipRoot, useTooltipTrigger };
+export { TooltipPositionerElement, type TooltipPositionerProps, TooltipRootElement, type TooltipRootProps, TooltipTriggerElement, useTooltipPositioner, useTooltipRoot, useTooltipTrigger };

dist/index.js

@@ -0,1 +1,4 @@
+// src/tooltip-positioner-element.gen.ts
+import { BaseElement } from "@aria-ui/core";
+
 // src/tooltip-positioner-state.ts
@@ -38,2 +41,157 @@ import {
 
+// src/tooltip-positioner-element.gen.ts
+var TooltipPositionerElement = class extends BaseElement {
+  constructor(props) {
+    super();
+    this._s = useTooltipPositioner(this, props);
+  }
+  /** @hidden */
+  get strategy() {
+    return this._s.strategy.value;
+  }
+  /** @hidden */
+  set strategy(v) {
+    this._s.strategy.value = v;
+  }
+  /** @hidden */
+  get placement() {
+    return this._s.placement.value;
+  }
+  /** @hidden */
+  set placement(v) {
+    this._s.placement.value = v;
+  }
+  /** @hidden */
+  get autoUpdate() {
+    return this._s.autoUpdate.value;
+  }
+  /** @hidden */
+  set autoUpdate(v) {
+    this._s.autoUpdate.value = v;
+  }
+  /** @hidden */
+  get hoist() {
+    return this._s.hoist.value;
+  }
+  /** @hidden */
+  set hoist(v) {
+    this._s.hoist.value = v;
+  }
+  /** @hidden */
+  get offset() {
+    return this._s.offset.value;
+  }
+  /** @hidden */
+  set offset(v) {
+    this._s.offset.value = v;
+  }
+  /** @hidden */
+  get flip() {
+    return this._s.flip.value;
+  }
+  /** @hidden */
+  set flip(v) {
+    this._s.flip.value = v;
+  }
+  /** @hidden */
+  get shift() {
+    return this._s.shift.value;
+  }
+  /** @hidden */
+  set shift(v) {
+    this._s.shift.value = v;
+  }
+  /** @hidden */
+  get overlap() {
+    return this._s.overlap.value;
+  }
+  /** @hidden */
+  set overlap(v) {
+    this._s.overlap.value = v;
+  }
+  /** @hidden */
+  get fitViewport() {
+    return this._s.fitViewport.value;
+  }
+  /** @hidden */
+  set fitViewport(v) {
+    this._s.fitViewport.value = v;
+  }
+  /** @hidden */
+  get sameWidth() {
+    return this._s.sameWidth.value;
+  }
+  /** @hidden */
+  set sameWidth(v) {
+    this._s.sameWidth.value = v;
+  }
+  /** @hidden */
+  get sameHeight() {
+    return this._s.sameHeight.value;
+  }
+  /** @hidden */
+  set sameHeight(v) {
+    this._s.sameHeight.value = v;
+  }
+  /** @hidden */
+  get inline() {
+    return this._s.inline.value;
+  }
+  /** @hidden */
+  set inline(v) {
+    this._s.inline.value = v;
+  }
+  /** @hidden */
+  get hide() {
+    return this._s.hide.value;
+  }
+  /** @hidden */
+  set hide(v) {
+    this._s.hide.value = v;
+  }
+  /** @hidden */
+  get boundary() {
+    return this._s.boundary.value;
+  }
+  /** @hidden */
+  set boundary(v) {
+    this._s.boundary.value = v;
+  }
+  /** @hidden */
+  get rootBoundary() {
+    return this._s.rootBoundary.value;
+  }
+  /** @hidden */
+  set rootBoundary(v) {
+    this._s.rootBoundary.value = v;
+  }
+  /** @hidden */
+  get overflowPadding() {
+    return this._s.overflowPadding.value;
+  }
+  /** @hidden */
+  set overflowPadding(v) {
+    this._s.overflowPadding.value = v;
+  }
+  /** @hidden */
+  get elementContext() {
+    return this._s.elementContext.value;
+  }
+  /** @hidden */
+  set elementContext(v) {
+    this._s.elementContext.value = v;
+  }
+  /** @hidden */
+  get altBoundary() {
+    return this._s.altBoundary.value;
+  }
+  /** @hidden */
+  set altBoundary(v) {
+    this._s.altBoundary.value = v;
+  }
+};
+
+// src/tooltip-root-element.gen.ts
+import { BaseElement as BaseElement2 } from "@aria-ui/core";
+
 // src/tooltip-root-state.ts
@@ -70,2 +228,29 @@ import {
 
+// src/tooltip-root-element.gen.ts
+var TooltipRootElement = class extends BaseElement2 {
+  constructor(props) {
+    super();
+    this._s = useTooltipRoot(this, props);
+  }
+  /** @hidden */
+  get delay() {
+    return this._s.delay.value;
+  }
+  /** @hidden */
+  set delay(v) {
+    this._s.delay.value = v;
+  }
+  /** @hidden */
+  get skipDelay() {
+    return this._s.skipDelay.value;
+  }
+  /** @hidden */
+  set skipDelay(v) {
+    this._s.skipDelay.value = v;
+  }
+};
+
+// src/tooltip-trigger-element.gen.ts
+import { BaseElement as BaseElement3 } from "@aria-ui/core";
+
 // src/tooltip-trigger-state.ts
@@ -103,3 +288,14 @@ import {
 }
+
+// src/tooltip-trigger-element.gen.ts
+var TooltipTriggerElement = class extends BaseElement3 {
+  constructor() {
+    super();
+    useTooltipTrigger(this);
+  }
+};
 export {
+  TooltipPositionerElement,
+  TooltipRootElement,
+  TooltipTriggerElement,
   useTooltipPositioner,
@@ -106,0 +302,0 @@ useTooltipRoot,

package.json

 {
   "name": "@aria-ui/tooltip",
   "type": "module",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "private": false,
@@ -13,3 +13,3 @@ "sideEffects": false,
     "@aria-ui/core": "^0.0.6",
-    "@aria-ui/overlay": "^0.0.3",
+    "@aria-ui/overlay": "^0.0.4",
     "nanoid": "^5.0.6"
@@ -16,0 +16,0 @@ },

README.md

@@ -5,2 +5,12 @@ # @aria-ui/tooltip
 
+### TooltipPositionerElement
+
+A custom TooltipPositioner element.
+
+Properties: [TooltipPositionerProps](README.md#tooltippositionerprops)
+
+```ts
+new TooltipPositionerElement(props?: Partial<TooltipPositionerProps>): TooltipPositionerElement
+```
+
 ### TooltipPositionerProps
@@ -10,2 +20,19 @@
 | :-- | :-- | :-- |
+| `altBoundary` | `boolean` | **See**<br />https://floating-ui.com/docs/detectoverflow<br /><br />**Default**<br />`true` |
+| `autoUpdate` | `boolean` \| `Partial`\<`Object`\> | Options to activate auto-update listeners<br /><br />**See**<br />https://floating-ui.com/docs/autoUpdate<br /><br />**Default**<br />`true` |
+| `boundary` | `Boundary` | **See**<br />https://floating-ui.com/docs/detectoverflow<br /><br />**Default**<br />`'clippingAncestors'` |
+| `elementContext` | `ElementContext` | **See**<br />https://floating-ui.com/docs/detectoverflow<br /><br />**Default**<br />`'floating'` |
+| `fitViewport` | `boolean` | Whether to constrain the floating element's width and height to not exceed<br />the viewport.<br /><br />**Default**<br />`false` |
+| `flip` | `boolean` \| `Placement`[] | Whether to flip the `placement` in order to keep it in view when the<br />preferred placement(s) will overflow the clipping boundary. You can also<br />provide an array of placements to try sequentially if the preferred<br />`placement` does not fit.<br /><br />**Default**<br />`false` |
+| `hide` | `boolean` | Whether to hide the floating element when the reference element or the<br />floating element is fully clipped.<br /><br />**Default**<br />`false` |
+| `hoist` | `boolean` | Whether to use the browser Popover API to place the floating element on top<br />of other page content. When enabled, the floating element won't be clipped<br />by an ancestor. This provides a similar result to React's `<Portals>` or<br />Vue's `<Teleport>`.<br /><br />**See**<br />https://developer.mozilla.org/en-US/docs/Web/API/Popover_API<br /><br />**Default**<br />`false` |
+| `inline` | `boolean` | Whether to improve positioning for inline reference elements that span over<br />multiple lines.<br /><br />**Default**<br />`false` |
+| `offset` | `null` \| `OffsetOptions` | The distance between the reference and floating element.<br /><br />**Default**<br />`null` |
+| `overflowPadding` | `number` | **See**<br />https://floating-ui.com/docs/detectoverflow<br /><br />**Default**<br />`0` |
+| `overlap` | `boolean` | Whether the floating element can overlap the reference element to keep it<br />in view.<br /><br />**Default**<br />`false` |
+| `placement` | `Placement` | The initial placement of the floating element<br /><br />**Default**<br />`"top"` |
+| `rootBoundary` | `RootBoundary` | **See**<br />https://floating-ui.com/docs/detectoverflow<br /><br />**Default**<br />`'viewport'` |
+| `sameHeight` | `boolean` | Whether to constrain the floating element's height so that it matches the<br />reference element.<br /><br />**Default**<br />`false` |
+| `sameWidth` | `boolean` | Whether to constrain the floating element's width so that it matches the<br />reference element.<br /><br />**Default**<br />`false` |
+| `shift` | `boolean` | Whether the floating element should shift to keep it in view.<br /><br />**Default**<br />`false` |
 | `strategy` | `"absolute"` \| `"fixed"` | The strategy to use for positioning<br /><br />**Default**<br />`"fixed"` |
@@ -24,2 +51,12 @@
 
+### TooltipRootElement
+
+A custom TooltipRoot element.
+
+Properties: [TooltipRootProps](README.md#tooltiprootprops)
+
+```ts
+new TooltipRootElement(props?: Partial<TooltipRootProps>): TooltipRootElement
+```
+
 ### TooltipRootProps
@@ -38,2 +75,10 @@
 
+### TooltipTriggerElement
+
+A custom TooltipTrigger element.
+
+```ts
+new TooltipTriggerElement(): TooltipTriggerElement
+```
+
 ### useTooltipTrigger()
@@ -40,0 +85,0 @@

src/index.ts

@@ -0,5 +1,8 @@
+export { TooltipPositionerElement } from "./tooltip-positioner-element.gen"
 export type { TooltipPositionerProps } from "./tooltip-positioner-props"
 export { useTooltipPositioner } from "./tooltip-positioner-state"
+export { TooltipRootElement } from "./tooltip-root-element.gen"
 export type { TooltipRootProps } from "./tooltip-root-props"
 export { useTooltipRoot } from "./tooltip-root-state"
+export { TooltipTriggerElement } from "./tooltip-trigger-element.gen"
 export { useTooltipTrigger } from "./tooltip-trigger-state"

temp/src/index.d.ts

@@ -0,6 +1,9 @@
+export { TooltipPositionerElement } from "./tooltip-positioner-element.gen";
 export type { TooltipPositionerProps } from "./tooltip-positioner-props";
 export { useTooltipPositioner } from "./tooltip-positioner-state";
+export { TooltipRootElement } from "./tooltip-root-element.gen";
 export type { TooltipRootProps } from "./tooltip-root-props";
 export { useTooltipRoot } from "./tooltip-root-state";
+export { TooltipTriggerElement } from "./tooltip-trigger-element.gen";
 export { useTooltipTrigger } from "./tooltip-trigger-state";
 //# sourceMappingURL=index.d.ts.map

temp/src/tooltip-positioner-props.d.ts

@@ -20,3 +20,3 @@ import type { OverlayPositionerProps } from "@aria-ui/overlay";
     autoUpdate: true;
-    popover: false;
+    hoist: false;
     offset: null;
@@ -23,0 +23,0 @@ flip: false;

No alert changes

Improved metrics

Total package byte prevSize

93675

increased by37.02%

Number of package files

42

increased by27.27%

Lines of code

846

increased by100.95%

Number of lines in readme file

85

increased by112.5%

Dependency changes

• + Added@aria-ui/overlay@0.0.4(transitive)

• - Removed@aria-ui/overlay@0.0.3(transitive)

• Updated@aria-ui/overlay@^0.0.4