@loomui-ng/ui 0.0.0-stage → 0.1.1

package/types/loomui-ng-ui-navigation-menu.d.ts

@@ -0,0 +1,160 @@
+import { Directionality } from "@angular/cdk/bidi";
+import * as i0 from "@angular/core";
+import * as i1 from "@loomui-ng/ui/utils";
+export declare const navigationMenuClass = "group/navigation-menu relative flex flex-1 items-center justify-center";
+export declare const navigationMenuListClass = "group flex flex-1 list-none items-center justify-center gap-0";
+export declare const navigationMenuItemClass = "relative hidden md:flex";
+export declare const navigationMenuTriggerClass = "group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted group";
+export declare const navigationMenuContentClass = "top-0 start-0 w-full p-1 ease-[cubic-bezier(0.22,1,0.36,1)] group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-lg group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:ring-1 group-data-[viewport=false]/navigation-menu:ring-foreground/10 group-data-[viewport=false]/navigation-menu:duration-300 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none md:absolute md:w-auto group-data-[viewport=false]/navigation-menu:data-open:animate-in group-data-[viewport=false]/navigation-menu:data-open:fade-in-0 group-data-[viewport=false]/navigation-menu:data-open:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-closed:animate-out group-data-[viewport=false]/navigation-menu:data-closed:fade-out-0 group-data-[viewport=false]/navigation-menu:data-closed:zoom-out-95";
+export declare const navigationMenuLinkClass = "gap-2 p-2 in-data-[slot=navigation-menu-content]:rounded-md data-active:bg-muted/50 data-active:hover:bg-muted data-active:focus:bg-muted [&_svg:not([class*='size-'])]:size-4 group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted flex";
+export declare const navigationMenuViewportClass = "origin-top-center relative mt-1.5 h-(--radix-navigation-menu-viewport-height) w-full overflow-hidden rounded-lg bg-popover text-popover-foreground shadow ring-1 ring-foreground/10 duration-100 md:w-(--radix-navigation-menu-viewport-width) data-open:animate-in data-open:zoom-in-90 data-closed:animate-out data-closed:zoom-out-90";
+export declare const UI_NAVIGATION_MENU_GENERATED: readonly [];
+/**
+ * <nav uiNavigationMenu>
+ *   <ul uiNavigationMenuList>
+ *     <li uiNavigationMenuItem>
+ *       <button uiNavigationMenuTrigger>Getting started</button>
+ *       <div uiNavigationMenuContent> <a uiNavigationMenuLink href="/docs">Docs</a> </div>
+ *     </li>
+ *     <li uiNavigationMenuItem><a uiNavigationMenuLink href="/pricing">Pricing</a></li>
+ *   </ul>
+ * </nav>
+ * Observed (Radix): nav[aria-label=Main][data-orientation][data-viewport], triggers with aria-expanded/data-state.
+ * Deviation: always the "viewport=false" layout — content opens under its own item (no shared animated viewport that morphs
+ * between items). Hover opens after 200ms, click toggles, Esc closes, ArrowLeft/Right move between triggers (RTL-mirrored),
+ * ArrowDown opens and focuses the first link.
+ */
+export declare class UiNavigationMenu {
+  readonly delay: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  readonly dir: Directionality;
+  readonly value: import("@angular/core").WritableSignal<string | null>;
+  readonly triggers: import("@angular/core").Signal<readonly any[]>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  private timer;
+  constructor();
+  openNow(id: string): void;
+  openSoon(id: string): void;
+  closeSoon(): void;
+  keep(): void;
+  close(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiNavigationMenu, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiNavigationMenu, "nav[uiNavigationMenu], ui-navigation-menu", ["uiNavigationMenu"], {
+    "delay": {
+      "alias": "delay";
+      "required": false;
+      "isSignal": true;
+    };
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, ["triggers"], never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiNavigationMenuList {
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiNavigationMenuList, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiNavigationMenuList, "ul[uiNavigationMenuList], ui-navigation-menu-list", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiNavigationMenuItem {
+  readonly id: string;
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiNavigationMenuItem, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiNavigationMenuItem, "li[uiNavigationMenuItem], ui-navigation-menu-item", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiNavigationMenuTrigger {
+  protected readonly nav: UiNavigationMenu;
+  protected readonly item: UiNavigationMenuItem;
+  readonly el: HTMLElement;
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly open: import("@angular/core").Signal<boolean>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  protected toggle(): void;
+  protected onEnter(e: PointerEvent): void;
+  protected onLeave(e: PointerEvent): void;
+  protected onKeydown(e: KeyboardEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiNavigationMenuTrigger, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<UiNavigationMenuTrigger, "button[uiNavigationMenuTrigger], ui-navigation-menu-trigger", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiNavigationMenuContent {
+  protected readonly nav: UiNavigationMenu;
+  protected readonly item: UiNavigationMenuItem;
+  private readonly el;
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly open: import("@angular/core").Signal<boolean>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  protected onEscape(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiNavigationMenuContent, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiNavigationMenuContent, "[uiNavigationMenuContent], ui-navigation-menu-content", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiNavigationMenuLink {
+  protected readonly nav: UiNavigationMenu;
+  readonly active: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiNavigationMenuLink, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiNavigationMenuLink, "a[uiNavigationMenuLink], ui-navigation-menu-link", never, {
+    "active": {
+      "alias": "active";
+      "required": false;
+      "isSignal": true;
+    };
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare const UI_NAVIGATION_MENU: readonly [typeof UiNavigationMenu, typeof UiNavigationMenuList, typeof UiNavigationMenuItem, typeof UiNavigationMenuTrigger, typeof UiNavigationMenuContent, typeof UiNavigationMenuLink];

package/types/loomui-ng-ui-pagination.d.ts

@@ -0,0 +1,130 @@
+import * as i0 from "@angular/core";
+import * as i1 from "@loomui-ng/ui/utils";
+export declare class UiPagination {
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPagination, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiPagination, "nav[uiPagination], ui-pagination", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiPaginationContent {
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPaginationContent, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiPaginationContent, "ul[uiPaginationContent], ui-pagination-content", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiPaginationItem {
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPaginationItem, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiPaginationItem, "li[uiPaginationItem], ui-pagination-item", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare const UI_PAGINATION_GENERATED: readonly [typeof UiPagination, typeof UiPaginationContent, typeof UiPaginationItem];
+type LinkSize = 'default' | 'icon' | 'sm' | 'lg' | 'xs' | 'icon-xs' | 'icon-sm' | 'icon-lg';
+/** <a uiPaginationLink [isActive]="page === 2" href="#">2</a> — Button variants: ghost, outline when active. */
+export declare class UiPaginationLink {
+  readonly isActive: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly size: import("@angular/core").InputSignal<LinkSize>;
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPaginationLink, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<UiPaginationLink, "a[uiPaginationLink], ui-pagination-link", never, {
+    "isActive": {
+      "alias": "isActive";
+      "required": false;
+      "isSignal": true;
+    };
+    "size": {
+      "alias": "size";
+      "required": false;
+      "isSignal": true;
+    };
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiPaginationPrevious {
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPaginationPrevious, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<UiPaginationPrevious, "a[uiPaginationPrevious], ui-pagination-previous", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiPaginationNext {
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPaginationNext, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<UiPaginationNext, "a[uiPaginationNext], ui-pagination-next", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiPaginationEllipsis {
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPaginationEllipsis, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<UiPaginationEllipsis, "span[uiPaginationEllipsis], ui-pagination-ellipsis", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare const UI_PAGINATION: readonly [typeof import("@loomui-ng/ui/pagination").UiPagination, typeof import("@loomui-ng/ui/pagination").UiPaginationContent, typeof import("@loomui-ng/ui/pagination").UiPaginationItem, typeof UiPaginationLink, typeof UiPaginationPrevious, typeof UiPaginationNext, typeof UiPaginationEllipsis];

package/types/loomui-ng-ui-popover.d.ts

@@ -0,0 +1,90 @@
+import * as i1 from "@loomui-ng/ui/utils";
+import { UiLayerRoot, UiPopperContentBase } from "@loomui-ng/ui/utils";
+import * as i0 from "@angular/core";
+/**
+ * <div uiPopover [(open)]="o" class="contents">
+ *   <button uiButton uiPopoverTrigger>Open</button>
+ *   <div uiPopoverContent side="bottom" align="center">…</div>
+ * </div>
+ */
+export declare class UiPopover extends UiLayerRoot {
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPopover, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiPopover, "[uiPopover], ui-popover", ["uiPopover"], {}, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiPopoverTrigger {
+  protected readonly root: UiPopover;
+  constructor();
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPopoverTrigger, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiPopoverTrigger, "[uiPopoverTrigger], ui-popover-trigger", never, {}, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiPopoverContent extends UiPopperContentBase {
+  protected readonly root: UiPopover;
+  protected readonly varPrefix = "--radix-popover";
+  private readonly trapFactory;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  constructor();
+  protected onAttached(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPopoverContent, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiPopoverContent, "[uiPopoverContent], ui-popover-content", never, {}, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiPopoverHeader {
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPopoverHeader, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiPopoverHeader, "[uiPopoverHeader], ui-popover-header", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiPopoverTitle {
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPopoverTitle, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiPopoverTitle, "[uiPopoverTitle], ui-popover-title", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class UiPopoverDescription {
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiPopoverDescription, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<UiPopoverDescription, "[uiPopoverDescription], ui-popover-description", never, {
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare const UI_POPOVER: readonly [typeof UiPopover, typeof UiPopoverTrigger, typeof UiPopoverContent, typeof UiPopoverHeader, typeof UiPopoverTitle, typeof UiPopoverDescription];

package/types/loomui-ng-ui-progress.d.ts

@@ -0,0 +1,39 @@
+import * as i0 from "@angular/core";
+import * as i1 from "@loomui-ng/ui/utils";
+/**
+ * <div uiProgress [value]="60"></div>
+ * Observed (Radix): role="progressbar", aria-valuemin=0, aria-valuemax, data-state, data-max; the indicator is
+ * translated by -(100 - value)% and the root flips with `rtl:rotate-180`.
+ */
+export declare class UiProgress {
+  /** `null` = indeterminate (observed on the live page: data-state="indeterminate"). */
+  readonly value: import("@angular/core").InputSignalWithTransform<number | null, unknown>;
+  readonly max: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  readonly userClass: import("@angular/core").InputSignal<string>;
+  protected readonly percent: import("@angular/core").Signal<number>;
+  protected readonly state: import("@angular/core").Signal<"indeterminate" | "complete" | "loading">;
+  protected readonly classes: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<UiProgress, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<UiProgress, "div[uiProgress], ui-progress", never, {
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+    "max": {
+      "alias": "max";
+      "required": false;
+      "isSignal": true;
+    };
+    "userClass": {
+      "alias": "class";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.UiElementHost;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare const UI_PROGRESS: readonly [typeof UiProgress];