@radix-ng/primitives 0.2.0 → 0.3.0

package/overlay/src/overlay-trigger.directive.d.ts

@@ -0,0 +1,163 @@
+import { StaticProvider, TemplateRef } from '@angular/core';
+import { Placement } from '@floating-ui/dom';
+import type { OverlayArrowDirective } from './overlay-arrow.directive';
+import type { OverlayDirective } from './overlay.directive';
+import * as i0 from "@angular/core";
+export declare class OverlayTriggerDirective {
+    /**
+     * Access the application ref
+     */
+    private readonly appRef;
+    /**
+     * Access the component factory resolver
+     */
+    private readonly componentFactoryResolver;
+    /**
+     * Access the injector
+     */
+    private readonly injector;
+    /**
+     * Access the trigger element
+     */
+    private readonly trigger;
+    /**
+     * Access the view container
+     */
+    private readonly viewContainer;
+    /**
+     * Define the overlay to display when the trigger is activated.
+     */
+    templateRef: TemplateRef<void>;
+    /**
+     * Define if the trigger should be disabled.
+     * @default false
+     */
+    disabled: boolean;
+    /**
+     * Define the placement of the overlay relative to the trigger.
+     * @default 'bottom'
+     */
+    placement: Placement;
+    /**
+     * Define the offset of the overlay relative to the trigger.
+     * @default 4
+     */
+    offset: number;
+    /**
+     * Define the delay before the overlay is displayed.
+     * @default 0
+     */
+    showDelay: number;
+    /**
+     * Define the delay before the overlay is hidden.
+     * @default 0
+     */
+    hideDelay: number;
+    /**
+     * Define whether the overlay should shift when the overlay is near the edge of the viewport.
+     * @default true
+     */
+    shift: boolean;
+    /**
+     * Define whether the overlay should flip when there is not enough space for the overlay.
+     * @default true
+     */
+    flip: boolean;
+    /**
+     * Define the container in to which the overlay should be attached.
+     * @default document.body
+     */
+    container: HTMLElement;
+    /**
+     * Store the overlay content instance.
+     */
+    private overlay;
+    /**
+     * Store the overlay arrow instance.
+     */
+    private arrow;
+    /**
+     * Store the view ref
+     */
+    private viewRef;
+    /**
+     * Store the show delay timeout
+     */
+    private showDelayTimeout;
+    /**
+     * Store the hide delay timeout
+     */
+    private hideDelayTimeout;
+    /**
+     * Store the dispose function
+     */
+    private dispose?;
+    /**
+     * Store additional providers to register on the overlay.
+     */
+    private readonly providers;
+    /**
+     * Determine the state of the overlay.
+     */
+    private get isOpen();
+    /**
+     * Determine the state of the overlay.
+     */
+    protected get state(): 'closed' | 'opening' | 'open' | 'closing';
+    /**
+     * Create the overlay.
+     */
+    private createOverlay;
+    /**
+     * Update the overlay position.
+     */
+    private updateOverlayPosition;
+    /**
+     * Destroy the overlay.
+     */
+    private destroyOverlay;
+    /**
+     * Show the overlay.
+     */
+    show(): void;
+    /**
+     * Hide the overlay.
+     */
+    hide(): void;
+    /**
+     * Register the overlay.
+     * @param overlay The overlay to register.
+     * @internal
+     */
+    registerOverlay(overlay: OverlayDirective): void;
+    /**
+     * Unregister the overlay.
+     * @internal
+     */
+    unregisterOverlay(): void;
+    /**
+     * Register the arrow.
+     * @param arrow The arrow to register.
+     * @internal
+     */
+    registerArrow(arrow: OverlayArrowDirective): void;
+    /**
+     * Unregister the arrow.
+     * @internal
+     */
+    unregisterArrow(): void;
+    /**
+     * Register a provider on the overlay.
+     * @param provider The provider to register.
+     * @internal
+     */
+    registerProvider(provider: StaticProvider): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<OverlayTriggerDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<OverlayTriggerDirective, "[rdxOverlayTrigger]", ["rdxOverlayTrigger"], { "templateRef": { "alias": "rdxOverlayTrigger"; "required": true; }; "disabled": { "alias": "rdxOverlayDisabled"; "required": false; }; "placement": { "alias": "rdxOverlayPlacement"; "required": false; }; "offset": { "alias": "rdxOverlayOffset"; "required": false; }; "showDelay": { "alias": "rdxOverlayShowDelay"; "required": false; }; "hideDelay": { "alias": "rdxOverlayHideDelay"; "required": false; }; "shift": { "alias": "rdxOverlayShift"; "required": false; }; "flip": { "alias": "rdxOverlayFlip"; "required": false; }; "container": { "alias": "rdxOverlayContainer"; "required": false; }; }, {}, never, never, true, never>;
+    static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_offset: unknown;
+    static ngAcceptInputType_showDelay: unknown;
+    static ngAcceptInputType_hideDelay: unknown;
+    static ngAcceptInputType_shift: unknown;
+    static ngAcceptInputType_flip: unknown;
+}

package/overlay/src/overlay-trigger.token.d.ts

@@ -0,0 +1,7 @@
+import { InjectionToken } from '@angular/core';
+import type { OverlayTriggerDirective } from './overlay-trigger.directive';
+export declare const OverlayTriggerToken: InjectionToken<OverlayTriggerDirective>;
+/**
+ * Inject the overlay trigger directive
+ */
+export declare function injectOverlayTrigger(): OverlayTriggerDirective;

package/overlay/src/overlay.directive.d.ts

@@ -0,0 +1,29 @@
+import { OnDestroy, OnInit } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class OverlayDirective implements OnInit, OnDestroy {
+    /**
+     * Access the overlay element
+     */
+    private readonly elementRef;
+    /**
+     * Access the overlay trigger
+     */
+    private readonly overlayTrigger;
+    /**
+     * Register the overlay on init
+     */
+    ngOnInit(): void;
+    /**
+     * Unregister the overlay on destroy
+     */
+    ngOnDestroy(): void;
+    /**
+     * Set the position of the overlay
+     * @param x The x position
+     * @param y The y position
+     * @internal
+     */
+    setPosition(x?: number, y?: number): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<OverlayDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<OverlayDirective, "[rdxOverlay]", never, {}, {}, never, never, true, never>;
+}

package/overlay/src/overlay.token.d.ts

@@ -0,0 +1,3 @@
+import { InjectionToken } from '@angular/core';
+import type { OverlayDirective } from './overlay.directive';
+export declare const OverlayToken: InjectionToken<OverlayDirective>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@radix-ng/primitives",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "license": "MIT",
   "publishConfig": {
     "access": "public"
@@ -21,6 +21,10 @@
     "@angular/core": "^17.0.0",
     "@angular/cdk": "^17.0.0"
   },
+  "dependencies": {
+    "@floating-ui/dom": "^1.6.3",
+    "tslib": "^2.3.0"
+  },
   "sideEffects": false,
   "module": "fesm2022/radix-ng-primitives.mjs",
   "typings": "index.d.ts",
@@ -34,6 +38,12 @@
       "esm": "./esm2022/radix-ng-primitives.mjs",
       "default": "./fesm2022/radix-ng-primitives.mjs"
     },
+    "./avatar": {
+      "types": "./avatar/index.d.ts",
+      "esm2022": "./esm2022/avatar/radix-ng-primitives-avatar.mjs",
+      "esm": "./esm2022/avatar/radix-ng-primitives-avatar.mjs",
+      "default": "./fesm2022/radix-ng-primitives-avatar.mjs"
+    },
     "./checkbox": {
       "types": "./checkbox/index.d.ts",
       "esm2022": "./esm2022/checkbox/radix-ng-primitives-checkbox.mjs",
@@ -46,6 +56,12 @@
       "esm": "./esm2022/label/radix-ng-primitives-label.mjs",
       "default": "./fesm2022/radix-ng-primitives-label.mjs"
     },
+    "./overlay": {
+      "types": "./overlay/index.d.ts",
+      "esm2022": "./esm2022/overlay/radix-ng-primitives-overlay.mjs",
+      "esm": "./esm2022/overlay/radix-ng-primitives-overlay.mjs",
+      "default": "./fesm2022/radix-ng-primitives-overlay.mjs"
+    },
     "./progress": {
       "types": "./progress/index.d.ts",
       "esm2022": "./esm2022/progress/radix-ng-primitives-progress.mjs",
@@ -76,14 +92,17 @@
       "esm": "./esm2022/switch/radix-ng-primitives-switch.mjs",
       "default": "./fesm2022/radix-ng-primitives-switch.mjs"
     },
+    "./tooltip": {
+      "types": "./tooltip/index.d.ts",
+      "esm2022": "./esm2022/tooltip/radix-ng-primitives-tooltip.mjs",
+      "esm": "./esm2022/tooltip/radix-ng-primitives-tooltip.mjs",
+      "default": "./fesm2022/radix-ng-primitives-tooltip.mjs"
+    },
     "./visually-hidden": {
       "types": "./visually-hidden/index.d.ts",
       "esm2022": "./esm2022/visually-hidden/radix-ng-primitives-visually-hidden.mjs",
       "esm": "./esm2022/visually-hidden/radix-ng-primitives-visually-hidden.mjs",
       "default": "./fesm2022/radix-ng-primitives-visually-hidden.mjs"
     }
-  },
-  "dependencies": {
-    "tslib": "^2.3.0"
   }
 }

package/radio/index.d.ts

@@ -1,5 +1,5 @@
 export * from './src/radio-group.directive';
-export * from './src/radio-item.directive';
 export * from './src/radio-group.token';
 export * from './src/radio-indicator.directive';
+export * from './src/radio-item.directive';
 export * from './src/radio-item.token';

package/switch/index.d.ts

@@ -1,3 +1,3 @@
-export * from './src/switch.directive';
 export * from './src/switch-thumb.directive';
+export * from './src/switch.directive';
 export * from './src/switch.token';

package/tooltip/README.md

@@ -0,0 +1 @@
+# @radix-ng/primitives/tooltip

package/tooltip/index.d.ts

@@ -0,0 +1,4 @@
+export * from './src/tooltip-arrow.directive';
+export * from './src/tooltip-trigger.directive';
+export * from './src/tooltip.config';
+export * from './src/tooltip.directive';

package/tooltip/src/tooltip-arrow.directive.d.ts

@@ -0,0 +1,6 @@
+import * as i0 from "@angular/core";
+import * as i1 from "@radix-ng/primitives/overlay";
+export declare class TooltipArrowDirective {
+    static ɵfac: i0.ɵɵFactoryDeclaration<TooltipArrowDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TooltipArrowDirective, "[rdxTooltipArrow]", never, {}, {}, never, never, true, [{ directive: typeof i1.OverlayArrowDirective; inputs: {}; outputs: {}; }]>;
+}

package/tooltip/src/tooltip-trigger.directive.d.ts

@@ -0,0 +1,79 @@
+import { OnInit, TemplateRef } from '@angular/core';
+import { Placement } from '@floating-ui/dom';
+import * as i0 from "@angular/core";
+import * as i1 from "@radix-ng/primitives/overlay";
+export declare class TooltipTriggerDirective implements OnInit {
+    /**
+     * Access the overlay trigger directive
+     */
+    private readonly overlayTrigger;
+    /**
+     * Access the global tooltip configuration
+     */
+    private readonly tooltipConfig;
+    /**
+     * Define the tooltip to display when the trigger is activated.
+     */
+    templateRef: TemplateRef<void>;
+    /**
+     * Define if the trigger should be disabled.
+     * @default false
+     */
+    disabled: boolean;
+    /**
+     * Define the placement of the tooltip relative to the trigger.
+     * @default 'bottom'
+     */
+    placement: Placement;
+    /**
+     * Define the offset of the tooltip relative to the trigger.
+     * @default 0
+     */
+    offset: number;
+    /**
+     * Define the delay before the tooltip is displayed.
+     * @default 0
+     */
+    showDelay: number;
+    /**
+     * Define the delay before the tooltip is hidden.
+     * @default 0
+     */
+    hideDelay: number;
+    /**
+     * Define whether the tooltip should flip when there is not enough space for the tooltip.
+     * @default true
+     */
+    flip: boolean;
+    /**
+     * Define the container in to which the tooltip should be attached.
+     * @default document.body
+     */
+    container: HTMLElement;
+    /**
+     * The tooltip id.
+     */
+    protected tooltipId?: string;
+    ngOnInit(): void;
+    /**
+     * Show the tooltip.
+     */
+    show(): void;
+    /**
+     * Hide the tooltip.
+     */
+    hide(): void;
+    /**
+     * Define the tooltip id.
+     * @param id The tooltip id
+     * @internal
+     */
+    setTooltipId(id: string): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TooltipTriggerDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TooltipTriggerDirective, "[rdxTooltipTrigger]", never, { "templateRef": { "alias": "rdxTooltipTrigger"; "required": true; }; "disabled": { "alias": "rdxTooltipDisabled"; "required": false; }; "placement": { "alias": "rdxTooltipPlacement"; "required": false; }; "offset": { "alias": "rdxTooltipOffset"; "required": false; }; "showDelay": { "alias": "rdxTooltipShowDelay"; "required": false; }; "hideDelay": { "alias": "rdxTooltipHideDelay"; "required": false; }; "flip": { "alias": "rdxTooltipFlip"; "required": false; }; "container": { "alias": "rdxTooltipContainer"; "required": false; }; }, {}, never, never, true, [{ directive: typeof i1.OverlayTriggerDirective; inputs: { "rdxOverlayTrigger": "rdxTooltipTrigger"; "rdxOverlayDisabled": "rdxTooltipDisabled"; "rdxOverlayPlacement": "rdxTooltipPlacement"; "rdxOverlayOffset": "rdxTooltipOffset"; "rdxOverlayShowDelay": "rdxTooltipShowDelay"; "rdxOverlayHideDelay": "rdxTooltipHideDelay"; "rdxOverlayShift": "rdxTooltipShift"; "rdxOverlayFlip": "rdxTooltipFlip"; "rdxOverlayContainer": "rdxTooltipContainer"; }; outputs: {}; }]>;
+    static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_offset: unknown;
+    static ngAcceptInputType_showDelay: unknown;
+    static ngAcceptInputType_hideDelay: unknown;
+    static ngAcceptInputType_flip: unknown;
+}

package/tooltip/src/tooltip-trigger.token.d.ts

@@ -0,0 +1,4 @@
+import { InjectionToken } from '@angular/core';
+import type { TooltipTriggerDirective } from './tooltip-trigger.directive';
+export declare const TooltipTriggerToken: InjectionToken<TooltipTriggerDirective>;
+export declare function injectTooltipTrigger(): TooltipTriggerDirective;

package/tooltip/src/tooltip.config.d.ts

@@ -0,0 +1,46 @@
+import { InjectionToken, Provider } from '@angular/core';
+import { Placement } from '@floating-ui/dom';
+export declare const TooltipConfigToken: InjectionToken<TooltipConfig>;
+export interface TooltipConfig {
+    /**
+     * Define the offset of the tooltip relative to the trigger.
+     * @default 4
+     */
+    offset: number;
+    /**
+     * Define the placement of the tooltip relative to the trigger.
+     * @default 'top'
+     */
+    placement: Placement;
+    /**
+     * Define the delay before the tooltip is shown.
+     * @default 0
+     */
+    showDelay: number;
+    /**
+     * Define the delay before the tooltip is hidden.
+     * @default 0
+     */
+    hideDelay: number;
+    /**
+     * Define whether the tooltip should flip when there is not enough space for the tooltip.
+     * @default true
+     */
+    flip: boolean;
+    /**
+     * Define the container in to which the tooltip should be attached.
+     * @default document.body
+     */
+    container: HTMLElement;
+}
+/**
+ * Provide the default Tooltip configuration
+ * @param config The Tooltip configuration
+ * @returns The provider
+ */
+export declare function provideTooltipConfig(config: Partial<TooltipConfig>): Provider[];
+/**
+ * Inject the Tooltip configuration
+ * @returns The global Tooltip configuration
+ */
+export declare function injectTooltipConfig(): TooltipConfig;

package/tooltip/src/tooltip.directive.d.ts

@@ -0,0 +1,17 @@
+import { OnChanges, OnInit, SimpleChanges } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@radix-ng/primitives/overlay";
+export declare class TooltipDirective implements OnInit, OnChanges {
+    /**
+     * Access the tooltip trigger
+     */
+    private readonly trigger;
+    /**
+     * Define the tooltip id
+     */
+    id: string;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TooltipDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TooltipDirective, "[rdxTooltip]", ["rdxTooltip"], { "id": { "alias": "id"; "required": false; }; }, {}, never, never, true, [{ directive: typeof i1.OverlayDirective; inputs: {}; outputs: {}; }]>;
+}