@raqm/ui 0.0.0-stage → 0.1.0

package/types/raqm-ui-toggle-group.d.ts

@@ -0,0 +1,167 @@
+import * as i0 from "@angular/core";
+import { InjectionToken, OnInit, Signal } from "@angular/core";
+/** Stable identity of one item, kept in DOM order for roving focus. */
+interface RaqmToggleGroupItemRef {
+  /** Unique, non-empty item value used by the group's selection contract. */
+  readonly value: string;
+  /** Reactive: true when the item or its group is disabled. */
+  readonly disabled: Signal<boolean>;
+  /** The item's native `<button>` host, used only to move focus. */
+  readonly host: HTMLElement;
+}
+/** Typed contract published by the group; a dedicated token avoids a runtime module cycle. */
+interface RaqmToggleGroupContext {
+  /** Parent appearance; the group's value always wins over the item default. */
+  readonly outline: Signal<boolean>;
+  /** Parent size; the group's value always wins over the item default. */
+  readonly activeSize: Signal<'default' | 'small' | 'large'>;
+  /** Parent axis, used to map arrow keys to the nearest direction. */
+  readonly vertical: Signal<boolean>;
+  readonly multiple: Signal<boolean>;
+  readonly disabled: Signal<boolean>;
+  isSelected(value: string): boolean;
+  /** Applies the group's selection rules to an activated item (no-op if disabled). */
+  activate(item: RaqmToggleGroupItemRef): void;
+  /** Registers an item for focus management; called once per item. */
+  register(item: RaqmToggleGroupItemRef): void;
+  /** Unregisters an item when it is destroyed; never changes the value. */
+  unregister(item: RaqmToggleGroupItemRef): void;
+  setActive(item: RaqmToggleGroupItemRef): void;
+  /** Whether the item is the group's single roving tab stop. */
+  isTabStop(item: RaqmToggleGroupItemRef): boolean;
+  /** Moves focus for a keyboard event without changing the selected value. */
+  moveFocus(item: RaqmToggleGroupItemRef, event: KeyboardEvent): void;
+}
+/** Injection token for the parent group; injected optionally so a standalone item still renders. */
+declare const RAQM_TOGGLE_GROUP: InjectionToken<RaqmToggleGroupContext>;
+/**
+ * Group container that owns selection for `button[raqm-toggle-group-item]`.
+ *
+ * @remarks
+ * The host carries `role="group"`; the application supplies the accessible name.
+ * The group owns the `value` model: single mode keeps at most one value and clears
+ * to `[]`, multiple mode toggles membership without duplicates. Unknown values stay
+ * in the model but render unselected.
+ * Roving focus: one enabled item is a tab stop; Arrow/Home/End move focus without
+ * changing the value, and Left/Right follow the resolved direction (RTL reverses).
+ */
+export declare class RaqmToggleGroupComponent implements RaqmToggleGroupContext {
+  private readonly host;
+  readonly outline: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly small: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly large: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /** The resolved size; setting both attributes is rejected. */
+  readonly activeSize: import("@angular/core").Signal<"default" | "small" | "large">;
+  readonly vertical: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly spacing: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  readonly multiple: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly value: import("@angular/core").ModelSignal<readonly string[]>;
+  private readonly items;
+  private readonly active;
+  private readonly enabledItems;
+  private readonly tabStop;
+  /** Single mode reads only the first entry, which is never coerced or re-emitted. */
+  isSelected(value: string): boolean;
+  /** A disabled group or item is a no-op; multiple mode preserves selected order. */
+  activate(item: RaqmToggleGroupItemRef): void;
+  /** Registers in DOM order; constructor-time registration throws `NG0950` in development. */
+  register(item: RaqmToggleGroupItemRef): void;
+  /** Leaves selection untouched, so removal emits no change event. */
+  unregister(item: RaqmToggleGroupItemRef): void;
+  /** Marks an item as the roving focus target (on focus and on click). */
+  setActive(item: RaqmToggleGroupItemRef): void;
+  /** Whether the item is the group's single roving tab stop. */
+  isTabStop(item: RaqmToggleGroupItemRef): boolean;
+  /**
+   * Moves focus among enabled items without changing the value, wrapping at either end.
+   * Home/End jump to first/last; foreign keys are ignored without `preventDefault`.
+   */
+  moveFocus(item: RaqmToggleGroupItemRef, event: KeyboardEvent): void;
+  private isRtl;
+  static ɵfac: i0.ɵɵFactoryDeclaration<RaqmToggleGroupComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<RaqmToggleGroupComponent, "raqm-toggle-group", never, {
+    "outline": {
+      "alias": "outline";
+      "required": false;
+      "isSignal": true;
+    };
+    "small": {
+      "alias": "small";
+      "required": false;
+      "isSignal": true;
+    };
+    "large": {
+      "alias": "large";
+      "required": false;
+      "isSignal": true;
+    };
+    "vertical": {
+      "alias": "vertical";
+      "required": false;
+      "isSignal": true;
+    };
+    "spacing": {
+      "alias": "spacing";
+      "required": false;
+      "isSignal": true;
+    };
+    "multiple": {
+      "alias": "multiple";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "value": "valueChange";
+  }, never, ["*"], true, never>;
+}
+/** Native toggle button whose pressed state derives from the parent group's selection. */
+export declare class RaqmToggleGroupItemComponent implements OnInit {
+  private readonly host;
+  private readonly group;
+  private readonly destroyRef;
+  readonly value: import("@angular/core").InputSignal<string>;
+  readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  protected readonly isDisabled: Signal<boolean>;
+  protected readonly outline: Signal<boolean>;
+  protected readonly activeSize: Signal<"default" | "small" | "large">;
+  protected readonly pressed: Signal<boolean>;
+  private readonly ref;
+  protected readonly tabIndex: Signal<0 | -1>;
+  constructor();
+  /**
+   * Registers after required inputs are bound; constructor-time registration throws `NG0950` in development.
+   * Runs before host bindings, preserving DOM order and the roving tabindex.
+   */
+  ngOnInit(): void;
+  /** Activates through the group; the guard is defensive because disabled buttons already suppress click. */
+  protected onClick(): void;
+  protected onFocus(): void;
+  /** Delegates arrow/Home/End focus movement to the group (value untouched). */
+  protected onKeydown(event: KeyboardEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<RaqmToggleGroupItemComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<RaqmToggleGroupItemComponent, "button[raqm-toggle-group-item]", never, {
+    "value": {
+      "alias": "value";
+      "required": true;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+export declare const RaqmToggleGroup: readonly [typeof RaqmToggleGroupComponent, typeof RaqmToggleGroupItemComponent];
+export {};

package/types/raqm-ui-toggle.d.ts

@@ -0,0 +1,42 @@
+import * as i0 from "@angular/core";
+/**
+ * Native `<button>` toggle with a two-way `pressed` model and a derived `aria-pressed`.
+ * `small`/`large` are mutually exclusive; the application owns the accessible name.
+ */
+export declare class RaqmToggle {
+  private readonly host;
+  readonly appearance: import("@angular/core").InputSignalWithTransform<"default" | "outline", unknown>;
+  readonly small: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly large: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /** The resolved size; setting both attributes is rejected. */
+  protected readonly activeSize: import("@angular/core").Signal<"default" | "small" | "large">;
+  readonly pressed: import("@angular/core").ModelSignal<boolean>;
+  constructor();
+  /** Toggles once per native activation; the guard is defensive because disabled buttons already suppress click. */
+  protected onToggleClick(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<RaqmToggle, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<RaqmToggle, "button[raqm-toggle]", never, {
+    "appearance": {
+      "alias": "raqm-toggle";
+      "required": false;
+      "isSignal": true;
+    };
+    "small": {
+      "alias": "small";
+      "required": false;
+      "isSignal": true;
+    };
+    "large": {
+      "alias": "large";
+      "required": false;
+      "isSignal": true;
+    };
+    "pressed": {
+      "alias": "pressed";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "pressed": "pressedChange";
+  }, never, ["*"], true, never>;
+}

package/types/raqm-ui-tooltip.d.ts

@@ -0,0 +1,207 @@
+import * as i0 from "@angular/core";
+import { InjectionToken, OnDestroy, OnInit, Signal, TemplateRef } from "@angular/core";
+type RaqmTooltipSide = 'top' | 'bottom' | 'left' | 'right' | 'inline-start' | 'inline-end';
+type RaqmTooltipAlign = 'start' | 'center' | 'end';
+type RaqmTooltipPhysicalSide = 'top' | 'bottom' | 'left' | 'right';
+declare const DEFAULT_SIDE: RaqmTooltipSide;
+declare const DEFAULT_ALIGN: RaqmTooltipAlign;
+declare const DEFAULT_SIDE_OFFSET = 4;
+declare const DEFAULT_ALIGN_OFFSET = 0;
+declare const VIEWPORT_MARGIN = 5;
+declare const EXIT_ANIMATION_MS = 150;
+declare const HOVER_GAP_MS = 100;
+declare const PANE_CLASS = "raqm-tooltip-overlay-pane";
+declare const CONTENT_CLASS = "raqm-tooltip-content";
+declare const CONTENT_ENTERING_CLASS = "raqm-tooltip-content--entering";
+declare const CONTENT_CLOSING_CLASS = "raqm-tooltip-content--closing";
+declare function nextTooltipRootId(): string;
+declare function prefersReducedMotion(): boolean;
+declare function toSide(value: unknown): RaqmTooltipSide;
+declare function toAlign(value: unknown): RaqmTooltipAlign;
+declare function toDir(value: unknown): 'ltr' | 'rtl' | undefined;
+declare function toOffset(fallback: number): (value: unknown) => number;
+interface RaqmTooltipTriggerRef {
+  /** The native button or passive span the root anchors the tooltip to. */
+  readonly element: HTMLElement;
+  /** Live native disabled state, read by the root's open policy at event time. */
+  readonly disabled: boolean;
+}
+/** The interaction that requested the tooltip open. */
+type RaqmTooltipOpenReason = 'mouse' | 'focus';
+/** The interaction that requested the tooltip close. */
+type RaqmTooltipCloseReason = 'mouse' | 'focus' | 'press' | 'escape';
+interface RaqmTooltipContext {
+  /** Whether the tooltip is currently shown (enabled and attached). */
+  readonly open: Signal<boolean>;
+  /** The live content id while shown (the trigger's `aria-describedby` token), or `null`. */
+  readonly tooltipId: Signal<string | null>;
+  /** Registers the single trigger; called once per root. */
+  registerTrigger(ref: RaqmTooltipTriggerRef): void;
+  /** Unregisters the trigger on destroy; never changes open state. */
+  unregisterTrigger(ref: RaqmTooltipTriggerRef): void;
+  /** Registers the single content template; called once per root. */
+  registerContent(template: TemplateRef<unknown>): void;
+  /** Unregisters the content template on destroy. */
+  unregisterContent(template: TemplateRef<unknown>): void;
+  /** Requests opening from a hover or keyboard-focus interaction. */
+  requestOpen(ref: RaqmTooltipTriggerRef, reason: RaqmTooltipOpenReason): void;
+  /** Requests closing from a hover, blur, press or Escape interaction. */
+  requestClose(ref: RaqmTooltipTriggerRef, reason: RaqmTooltipCloseReason): void;
+  /** Cancels a pending hover-gap close when the pointer enters the content. */
+  cancelHoverClose(): void;
+  /** Schedules a bounded hover-gap close when the pointer leaves the content. */
+  scheduleHoverClose(): void;
+}
+/** One open tooltip registered with a provider, so the provider keeps a single active one. */
+interface RaqmTooltipActive {
+  /** Immediately closes this tooltip without an exit animation (peer opened). */
+  closeForPeer(): void;
+}
+interface RaqmTooltipProviderContext {
+  /** The hover-open delay in milliseconds applied to descendant tooltips. */
+  readonly delay: Signal<number>;
+  /** Registers a newly open tooltip and closes the previous active one. */
+  registerActive(active: RaqmTooltipActive): void;
+  /** Clears the active registration when a tooltip closes or is destroyed. */
+  clearActive(active: RaqmTooltipActive): void;
+}
+/** Injection token for the parent Tooltip root; injected optionally, so a misplaced child reports rather than crashes. */
+declare const RAQM_TOOLTIP: InjectionToken<RaqmTooltipContext>;
+/** Injection token for the nearest Tooltip provider; without one a root uses a 0ms delay and has no sibling scope. */
+declare const RAQM_TOOLTIP_PROVIDER: InjectionToken<RaqmTooltipProviderContext>;
+export declare class RaqmTooltipComponent implements RaqmTooltipContext, OnDestroy {
+  private readonly host;
+  private readonly overlay;
+  private readonly viewContainerRef;
+  private readonly injector;
+  private readonly directionality;
+  private readonly viewportRuler;
+  private readonly scrollDispatcher;
+  private readonly document;
+  private readonly provider;
+  private readonly panelTemplate;
+  readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly side: import("@angular/core").InputSignalWithTransform<RaqmTooltipSide, unknown>;
+  readonly align: import("@angular/core").InputSignalWithTransform<RaqmTooltipAlign, unknown>;
+  readonly sideOffset: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  readonly alignOffset: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  readonly dir: import("@angular/core").InputSignalWithTransform<"ltr" | "rtl" | undefined, unknown>;
+  private readonly position;
+  private readonly pane;
+  private readonly slot;
+  private readonly timers;
+  private readonly lifecycle;
+  private readonly delay;
+  private destroyed;
+  readonly open: import("@angular/core").WritableSignal<boolean>;
+  readonly tooltipId: import("@angular/core").WritableSignal<string | null>;
+  private readonly contentTemplate;
+  protected readonly panelDir: import("@angular/core").WritableSignal<"ltr" | "rtl">;
+  protected readonly resolvedSide: import("@angular/core").WritableSignal<RaqmTooltipPhysicalSide>;
+  protected readonly closing: import("@angular/core").WritableSignal<boolean>;
+  constructor();
+  ngOnDestroy(): void;
+  registerTrigger(ref: RaqmTooltipTriggerRef): void;
+  /** Unregisters the trigger; an open tooltip is closed rather than orphaned. */
+  unregisterTrigger(ref: RaqmTooltipTriggerRef): void;
+  registerContent(template: TemplateRef<unknown>): void;
+  /** Unregisters the content template; an open tooltip is closed rather than orphaned. */
+  unregisterContent(template: TemplateRef<unknown>): void;
+  requestOpen(ref: RaqmTooltipTriggerRef, reason: RaqmTooltipOpenReason): void;
+  requestClose(ref: RaqmTooltipTriggerRef, reason: 'mouse' | 'focus' | 'press' | 'escape'): void;
+  cancelHoverClose(): void;
+  scheduleHoverClose(): void;
+  closeForPeer(): void;
+  protected onContentPointerEnter(event: PointerEvent): void;
+  protected onContentPointerLeave(event: PointerEvent): void;
+  private applyPositionInputs;
+  static ɵfac: i0.ɵɵFactoryDeclaration<RaqmTooltipComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<RaqmTooltipComponent, "raqm-tooltip", ["raqmTooltip"], {
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+    "side": {
+      "alias": "side";
+      "required": false;
+      "isSignal": true;
+    };
+    "align": {
+      "alias": "align";
+      "required": false;
+      "isSignal": true;
+    };
+    "sideOffset": {
+      "alias": "sideOffset";
+      "required": false;
+      "isSignal": true;
+    };
+    "alignOffset": {
+      "alias": "alignOffset";
+      "required": false;
+      "isSignal": true;
+    };
+    "dir": {
+      "alias": "dir";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+export declare class RaqmTooltipProviderDirective implements RaqmTooltipProviderContext {
+  readonly delay: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  private active;
+  /** Registers a newly open tooltip, closing the previous active one in this scope. */
+  registerActive(active: RaqmTooltipActive): void;
+  /** Clears the active registration only when it still belongs to this tooltip. */
+  clearActive(active: RaqmTooltipActive): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<RaqmTooltipProviderDirective, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<RaqmTooltipProviderDirective, "[raqm-tooltip-provider]", ["raqmTooltipProvider"], {
+    "delay": {
+      "alias": "delay";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+export declare class RaqmTooltipTriggerDirective implements OnInit {
+  private readonly host;
+  private readonly tooltip;
+  private readonly renderer;
+  private readonly destroyRef;
+  private ownedToken;
+  private readonly ref;
+  constructor();
+  /** Registers the trigger with the root once the directive is initialized. */
+  ngOnInit(): void;
+  /** Opens on mouse hover only; touch/pen hover is deliberately ignored. */
+  protected onPointerEnter(event: Event): void;
+  /** Requests the bounded hover-gap close on mouse leave. */
+  protected onPointerLeave(event: Event): void;
+  /** A primary press closes an open tooltip; touch presses are included. */
+  protected onPointerDown(event: Event): void;
+  /** Native keyboard focus opens immediately (the root applies any suppression). */
+  protected onFocus(): void;
+  /** Losing focus closes the tooltip and clears any focus suppression in the root. */
+  protected onBlur(): void;
+  /** Escape closes an open tooltip or dismisses a pending delayed open. */
+  protected onKeydown(event: Event): void;
+  /** A native/assistive click (including Enter/Space) closes an open tooltip. */
+  protected onClick(): void;
+  private syncDescribedBy;
+  static ɵfac: i0.ɵɵFactoryDeclaration<RaqmTooltipTriggerDirective, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<RaqmTooltipTriggerDirective, "button[raqm-tooltip-trigger], span[raqm-tooltip-trigger]", never, {}, {}, never, never, true, never>;
+}
+export declare class RaqmTooltipContentDirective implements OnInit {
+  private readonly template;
+  private readonly tooltip;
+  private readonly destroyRef;
+  constructor();
+  /** Registers the content template with the root once initialized. */
+  ngOnInit(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<RaqmTooltipContentDirective, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<RaqmTooltipContentDirective, "ng-template[raqm-tooltip-content]", ["raqmTooltipContent"], {}, {}, never, never, true, never>;
+}
+export declare const RaqmTooltip: readonly [typeof RaqmTooltipComponent, typeof RaqmTooltipContentDirective, typeof RaqmTooltipProviderDirective, typeof RaqmTooltipTriggerDirective];
+export type { RaqmTooltipTriggerRef };

package/types/raqm-ui.d.ts

@@ -0,0 +1,50 @@
+export * from "@raqm/ui/accordion";
+export * from "@raqm/ui/alert";
+export * from "@raqm/ui/alert-dialog";
+export * from "@raqm/ui/aspect-ratio";
+export * from "@raqm/ui/avatar";
+export * from "@raqm/ui/badge";
+export * from "@raqm/ui/breadcrumb";
+export * from "@raqm/ui/button";
+export * from "@raqm/ui/button-group";
+export * from "@raqm/ui/card";
+export * from "@raqm/ui/checkbox";
+export * from "@raqm/ui/collapsible";
+export * from "@raqm/ui/combobox";
+export * from "@raqm/ui/command";
+export * from "@raqm/ui/context-menu";
+export * from "@raqm/ui/dialog";
+export * from "@raqm/ui/drawer";
+export * from "@raqm/ui/dropdown-menu";
+export * from "@raqm/ui/empty";
+export * from "@raqm/ui/field";
+export * from "@raqm/ui/hover-card";
+export * from "@raqm/ui/input";
+export * from "@raqm/ui/input-group";
+export * from "@raqm/ui/input-otp";
+export * from "@raqm/ui/item";
+export * from "@raqm/ui/kbd";
+export * from "@raqm/ui/label";
+export * from "@raqm/ui/menubar";
+export * from "@raqm/ui/native-select";
+export * from "@raqm/ui/navigation-menu";
+export * from "@raqm/ui/pagination";
+export * from "@raqm/ui/popover";
+export * from "@raqm/ui/progress";
+export * from "@raqm/ui/radio-group";
+export * from "@raqm/ui/scroll-area";
+export * from "@raqm/ui/select";
+export * from "@raqm/ui/separator";
+export * from "@raqm/ui/sheet";
+export * from "@raqm/ui/sidebar";
+export * from "@raqm/ui/skeleton";
+export * from "@raqm/ui/slider";
+export * from "@raqm/ui/spinner";
+export * from "@raqm/ui/switch";
+export * from "@raqm/ui/table";
+export * from "@raqm/ui/tabs";
+export * from "@raqm/ui/textarea";
+export * from "@raqm/ui/toast";
+export * from "@raqm/ui/toggle";
+export * from "@raqm/ui/toggle-group";
+export * from "@raqm/ui/tooltip";