ngx-com 0.0.22 → 0.1.0

package/types/ngx-com-components-menu.d.ts

@@ -11,7 +11,7 @@ interface RootMenuTrigger {
     close(): void;
     /** Whether to close the menu when an item is selected. */
     menuCloseOnSelect(): boolean;
-    /** Called by MenuComponent to register itself when attached. */
+    /** Called by ComMenuComponent to register itself when attached. */
     registerMenu?(menu: MenuRef): void;
 }
 /**
@@ -47,7 +47,7 @@ type MenuAlignment = 'start' | 'center' | 'end';
 /**
  * Menu panel styling variants.
  *
- * @tokens `--color-popover`, `--color-popover-foreground`, `--color-border`, `--shadow-lg`, `--radius-popover`
+ * @tokens `--color-popover`, `--color-popover-foreground`, `--color-border`, `--shadow-overlay`, `--radius-popover`
  */
 declare const menuPanelVariants: ReturnType<typeof cva<{
     size: Record<MenuSize, string>;
@@ -101,7 +101,7 @@ type MenuSide = 'left' | 'right';
  * **Root context** (outside a menu): Opens on click, has backdrop.
  * **Submenu context** (inside a menu): Opens on hover/ArrowRight, no backdrop.
  *
- * @tokens `--color-popover`, `--color-popover-foreground`, `--color-border`, `--shadow-lg`
+ * @tokens `--color-popover`, `--color-popover-foreground`, `--color-border`, `--shadow-overlay`
  *
  * @example Root trigger
  * ```html
@@ -122,7 +122,7 @@ type MenuSide = 'left' | 'right';
  * </button>
  * ```
  */
-declare class MenuTriggerDirective implements RootMenuTrigger {
+declare class ComMenuTrigger implements RootMenuTrigger {
     private readonly overlay;
     private readonly elementRef;
     private readonly viewContainerRef;
@@ -178,7 +178,7 @@ declare class MenuTriggerDirective implements RootMenuTrigger {
     close(): void;
     /** Toggle the menu open/close state. */
     toggle(): void;
-    /** Called by MenuComponent to register itself when attached. */
+    /** Called by ComMenuComponent to register itself when attached. */
     registerMenu(menu: MenuRef): void;
     protected onClick(event: Event): void;
     protected onArrowDown(event: Event): void;
@@ -205,15 +205,15 @@ declare class MenuTriggerDirective implements RootMenuTrigger {
     private cancelCloseTimer;
     private disposeOverlay;
     private cleanupSubmenuListeners;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuTriggerDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MenuTriggerDirective, "[comMenuTrigger]", ["comMenuTrigger"], { "comMenuTrigger": { "alias": "comMenuTrigger"; "required": true; "isSignal": true; }; "menuPosition": { "alias": "menuPosition"; "required": false; "isSignal": true; }; "menuAlignment": { "alias": "menuAlignment"; "required": false; "isSignal": true; }; "menuOffset": { "alias": "menuOffset"; "required": false; "isSignal": true; }; "menuDisabled": { "alias": "menuDisabled"; "required": false; "isSignal": true; }; "menuOpen": { "alias": "menuOpen"; "required": false; "isSignal": true; }; "menuPanelClass": { "alias": "menuPanelClass"; "required": false; "isSignal": true; }; "menuCloseOnSelect": { "alias": "menuCloseOnSelect"; "required": false; "isSignal": true; }; "side": { "alias": "side"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "subMenuOpenDelay": { "alias": "subMenuOpenDelay"; "required": false; "isSignal": true; }; "subMenuCloseDelay": { "alias": "subMenuCloseDelay"; "required": false; "isSignal": true; }; }, { "menuOpen": "menuOpenChange"; "menuOpened": "menuOpened"; "menuClosed": "menuClosed"; }, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComMenuTrigger, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ComMenuTrigger, "[comMenuTrigger]", ["comMenuTrigger"], { "comMenuTrigger": { "alias": "comMenuTrigger"; "required": true; "isSignal": true; }; "menuPosition": { "alias": "menuPosition"; "required": false; "isSignal": true; }; "menuAlignment": { "alias": "menuAlignment"; "required": false; "isSignal": true; }; "menuOffset": { "alias": "menuOffset"; "required": false; "isSignal": true; }; "menuDisabled": { "alias": "menuDisabled"; "required": false; "isSignal": true; }; "menuOpen": { "alias": "menuOpen"; "required": false; "isSignal": true; }; "menuPanelClass": { "alias": "menuPanelClass"; "required": false; "isSignal": true; }; "menuCloseOnSelect": { "alias": "menuCloseOnSelect"; "required": false; "isSignal": true; }; "side": { "alias": "side"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "subMenuOpenDelay": { "alias": "subMenuOpenDelay"; "required": false; "isSignal": true; }; "subMenuCloseDelay": { "alias": "subMenuCloseDelay"; "required": false; "isSignal": true; }; }, { "menuOpen": "menuOpenChange"; "menuOpened": "menuOpened"; "menuClosed": "menuClosed"; }, never, never, true, never>;
 }
 
 /**
  * Base class for focusable menu items.
  * All item directives must implement this interface for FocusKeyManager.
  */
-declare abstract class MenuItemBase implements FocusableOption {
+declare abstract class ComMenuItemBase implements FocusableOption {
     abstract focus(): void;
     abstract getLabel(): string;
     /** Whether the item is disabled. */
@@ -223,7 +223,7 @@ declare abstract class MenuItemBase implements FocusableOption {
  * Menu panel component that renders inside an overlay.
  * Manages keyboard navigation across its items using CDK FocusKeyManager.
  *
- * @tokens `--color-popover`, `--color-popover-foreground`, `--color-border`, `--shadow-lg`
+ * @tokens `--color-popover`, `--color-popover-foreground`, `--color-border`, `--shadow-overlay`
  *
  * @example
  * ```html
@@ -233,7 +233,7 @@ declare abstract class MenuItemBase implements FocusableOption {
  * </com-menu>
  * ```
  */
-declare class MenuComponent implements MenuRef {
+declare class ComMenuComponent implements MenuRef {
     private readonly rootTrigger;
     private keyManager;
     /** Size variant for the menu panel. */
@@ -257,8 +257,8 @@ declare class MenuComponent implements MenuRef {
     /** Close this menu level. */
     close(): void;
     protected onKeydown(event: KeyboardEvent): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MenuComponent, "com-menu", never, { "menuSize": { "alias": "menuSize"; "required": false; "isSignal": true; }; "menuVariant": { "alias": "menuVariant"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; }, {}, ["items"], ["*"], true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComMenuComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ComMenuComponent, "com-menu", never, { "menuSize": { "alias": "menuSize"; "required": false; "isSignal": true; }; "menuVariant": { "alias": "menuVariant"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; }, {}, ["items"], ["*"], true, never>;
 }
 
 /**
@@ -274,7 +274,7 @@ declare class MenuComponent implements MenuRef {
  * <button comMenuItem destructive>Delete</button>
  * ```
  */
-declare class MenuItemDirective extends MenuItemBase {
+declare class ComMenuItem extends ComMenuItemBase {
     private readonly elementRef;
     private readonly menu;
     private readonly rootTrigger;
@@ -293,8 +293,8 @@ declare class MenuItemDirective extends MenuItemBase {
     protected onAction(event: Event): void;
     protected onMouseEnter(): void;
     protected onMouseLeave(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuItemDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MenuItemDirective, "[comMenuItem]", ["comMenuItem"], { "menuItemDisabled": { "alias": "menuItemDisabled"; "required": false; "isSignal": true; }; "destructive": { "alias": "destructive"; "required": false; "isSignal": true; }; }, { "menuItemSelect": "menuItemSelect"; }, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComMenuItem, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ComMenuItem, "[comMenuItem]", ["comMenuItem"], { "menuItemDisabled": { "alias": "menuItemDisabled"; "required": false; "isSignal": true; }; "destructive": { "alias": "destructive"; "required": false; "isSignal": true; }; }, { "menuItemSelect": "menuItemSelect"; }, never, never, true, never>;
 }
 
 /**
@@ -307,7 +307,7 @@ declare class MenuItemDirective extends MenuItemBase {
  * <button comMenuItemCheckbox [(checked)]="showSidebar">Sidebar</button>
  * ```
  */
-declare class MenuItemCheckboxComponent extends MenuItemBase {
+declare class ComMenuItemCheckbox extends ComMenuItemBase {
     private readonly elementRef;
     private readonly menu;
     /** Disables the item. */
@@ -324,8 +324,8 @@ declare class MenuItemCheckboxComponent extends MenuItemBase {
     protected toggle(event: Event): void;
     protected onMouseEnter(): void;
     protected onMouseLeave(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuItemCheckboxComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MenuItemCheckboxComponent, "[comMenuItemCheckbox]", ["comMenuItemCheckbox"], { "menuItemDisabled": { "alias": "menuItemDisabled"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, ["*"], true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComMenuItemCheckbox, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ComMenuItemCheckbox, "[comMenuItemCheckbox]", ["comMenuItemCheckbox"], { "menuItemDisabled": { "alias": "menuItemDisabled"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, ["*"], true, never>;
 }
 
 /**
@@ -341,7 +341,7 @@ declare class MenuItemCheckboxComponent extends MenuItemBase {
  * </div>
  * ```
  */
-declare class MenuItemRadioComponent extends MenuItemBase {
+declare class ComMenuItemRadio extends ComMenuItemBase {
     private readonly elementRef;
     private readonly menu;
     private readonly rootTrigger;
@@ -362,14 +362,14 @@ declare class MenuItemRadioComponent extends MenuItemBase {
     protected select(event: Event): void;
     protected onMouseEnter(): void;
     protected onMouseLeave(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuItemRadioComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MenuItemRadioComponent, "[comMenuItemRadio]", ["comMenuItemRadio"], { "menuItemDisabled": { "alias": "menuItemDisabled"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComMenuItemRadio, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ComMenuItemRadio, "[comMenuItemRadio]", ["comMenuItemRadio"], { "menuItemDisabled": { "alias": "menuItemDisabled"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
 /**
  * Token for menu group to allow radio items to coordinate.
  */
-declare abstract class MenuGroupRef {
+declare abstract class ComMenuGroupRef {
     abstract readonly groupValue: () => unknown;
     abstract setGroupValue(value: unknown): void;
 }
@@ -387,14 +387,14 @@ declare abstract class MenuGroupRef {
  *
  * @tokens None - uses only ARIA attributes
  */
-declare class MenuGroupDirective extends MenuGroupRef {
+declare class ComMenuGroup extends ComMenuGroupRef {
     /** Optional accessible label for the group. */
     readonly ariaLabel: InputSignal<string | null>;
     /** Two-way bindable value for radio groups. */
     readonly groupValue: ModelSignal<unknown>;
     setGroupValue(value: unknown): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuGroupDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MenuGroupDirective, "[comMenuGroup]", ["comMenuGroup"], { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "groupValue": { "alias": "groupValue"; "required": false; "isSignal": true; }; }, { "groupValue": "groupValueChange"; }, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComMenuGroup, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ComMenuGroup, "[comMenuGroup]", ["comMenuGroup"], { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "groupValue": { "alias": "groupValue"; "required": false; "isSignal": true; }; }, { "groupValue": "groupValueChange"; }, never, never, true, never>;
 }
 
 /**
@@ -408,14 +408,14 @@ declare class MenuGroupDirective extends MenuGroupRef {
  * <button comMenuItem>View Members</button>
  * ```
  */
-declare class MenuLabelDirective {
+declare class ComMenuLabel {
     private readonly menu;
     /** Unique ID that can be referenced by aria-labelledby. */
     readonly labelId: string;
     private readonly size;
     protected readonly labelClasses: Signal<string>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuLabelDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MenuLabelDirective, "[comMenuLabel]", ["comMenuLabel"], {}, {}, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComMenuLabel, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ComMenuLabel, "[comMenuLabel]", ["comMenuLabel"], {}, {}, never, never, true, never>;
 }
 
 /**
@@ -430,9 +430,9 @@ declare class MenuLabelDirective {
  * <button comMenuItem>Delete</button>
  * ```
  */
-declare class MenuDividerDirective {
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuDividerDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MenuDividerDirective, "[comMenuDivider]", ["comMenuDivider"], {}, {}, never, never, true, never>;
+declare class ComMenuDivider {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComMenuDivider, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ComMenuDivider, "[comMenuDivider]", ["comMenuDivider"], {}, {}, never, never, true, never>;
 }
 
 /**
@@ -449,9 +449,9 @@ declare class MenuDividerDirective {
  * </button>
  * ```
  */
-declare class MenuSubIndicatorComponent {
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuSubIndicatorComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MenuSubIndicatorComponent, "com-menu-sub-indicator", never, {}, {}, never, never, true, never>;
+declare class ComMenuSubIndicator {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComMenuSubIndicator, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ComMenuSubIndicator, "com-menu-sub-indicator", never, {}, {}, never, never, true, never>;
 }
 
 /**
@@ -467,13 +467,13 @@ declare class MenuSubIndicatorComponent {
  * </button>
  * ```
  */
-declare class MenuShortcutDirective {
+declare class ComMenuShortcut {
     private readonly menu;
     private readonly size;
     protected readonly shortcutClasses: Signal<string>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuShortcutDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MenuShortcutDirective, "[comMenuShortcut]", ["comMenuShortcut"], {}, {}, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComMenuShortcut, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ComMenuShortcut, "[comMenuShortcut]", ["comMenuShortcut"], {}, {}, never, never, true, never>;
 }
 
-export { MENU_REF, MenuComponent, MenuDividerDirective, MenuGroupDirective, MenuGroupRef, MenuItemBase, MenuItemCheckboxComponent, MenuItemDirective, MenuItemRadioComponent, MenuLabelDirective, MenuShortcutDirective, MenuSubIndicatorComponent, MenuTriggerDirective, ROOT_MENU_TRIGGER, menuCheckIndicatorVariants, menuItemVariants, menuLabelVariants, menuPanelVariants, menuShortcutVariants };
+export { ComMenuComponent, ComMenuDivider, ComMenuGroup, ComMenuGroupRef, ComMenuItem, ComMenuItemBase, ComMenuItemCheckbox, ComMenuItemRadio, ComMenuLabel, ComMenuShortcut, ComMenuSubIndicator, ComMenuTrigger, MENU_REF, ROOT_MENU_TRIGGER, menuCheckIndicatorVariants, menuItemVariants, menuLabelVariants, menuPanelVariants, menuShortcutVariants };
 export type { MenuAlignment, MenuCheckIndicatorVariants, MenuItemVariants, MenuLabelVariants, MenuPanelVariants, MenuPosition, MenuRef, MenuShortcutVariants, MenuSide, MenuSize, MenuVariant, RootMenuTrigger };

package/types/ngx-com-components-paginator.d.ts

@@ -219,6 +219,8 @@ declare class ComPaginator {
     protected readonly iconSize: Signal<'xs' | 'sm'>;
     /** Unique ID for page size label. */
     protected readonly pageSizeLabelId: Signal<string>;
+    /** Unique ID for page size select element. */
+    protected readonly pageSizeSelectId: Signal<string>;
     /** Classes for the container. */
     protected readonly containerClasses: Signal<string>;
     /** Classes for navigation buttons. */

package/types/ngx-com-components-popover.d.ts

@@ -12,7 +12,7 @@ type PopoverSide = 'top' | 'bottom' | 'left' | 'right';
 /**
  * Popover panel styling variants.
  *
- * @tokens `--color-popover`, `--color-popover-foreground`, `--color-border`, `--shadow-lg`, `--radius-popover`, `--radius-overlay`
+ * @tokens `--color-popover`, `--color-popover-foreground`, `--color-border`, `--shadow-overlay`, `--radius-popover`, `--radius-overlay`
  */
 declare const popoverPanelVariants: ReturnType<typeof cva<{
     variant: Record<PopoverVariant, string>;
@@ -34,7 +34,7 @@ type PopoverArrowVariants = VariantProps<typeof popoverArrowVariants>;
  * Applied to the trigger element, it handles opening, closing, positioning,
  * and accessibility for floating popover content.
  *
- * @tokens `--color-popover`, `--color-popover-foreground`, `--color-border`, `--shadow-lg`, `--color-ring`
+ * @tokens `--color-popover`, `--color-popover-foreground`, `--color-border`, `--shadow-overlay`, `--color-ring`
  *
  * @example Basic usage with template
  * ```html
@@ -80,7 +80,7 @@ type PopoverArrowVariants = VariantProps<typeof popoverArrowVariants>;
  * </button>
  * ```
  */
-declare class PopoverTriggerDirective {
+declare class ComPopoverTrigger {
     private readonly overlay;
     private readonly elementRef;
     private readonly viewContainerRef;
@@ -91,6 +91,8 @@ declare class PopoverTriggerDirective {
     private overlayRef;
     private focusTrap;
     private scrollCleanup;
+    private closeTimeoutId;
+    private destroyed;
     private readonly popoverId;
     /** Content to render: TemplateRef or Component class. */
     readonly comPopoverTrigger: InputSignal<TemplateRef<unknown> | Type<unknown>>;
@@ -153,6 +155,7 @@ declare class PopoverTriggerDirective {
     protected onEscapeKey(event: Event): void;
     private openPopover;
     private closePopover;
+    private cancelPendingClose;
     private subscribeToScrollEvents;
     private unsubscribeFromScrollEvents;
     private createOverlay;
@@ -163,14 +166,16 @@ declare class PopoverTriggerDirective {
     private setupFocusTrap;
     private destroyFocusTrap;
     private disposeOverlay;
-    static ɵfac: i0.ɵɵFactoryDeclaration<PopoverTriggerDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PopoverTriggerDirective, "[comPopoverTrigger]", ["comPopoverTrigger"], { "comPopoverTrigger": { "alias": "comPopoverTrigger"; "required": true; "isSignal": true; }; "popoverPosition": { "alias": "popoverPosition"; "required": false; "isSignal": true; }; "popoverAlignment": { "alias": "popoverAlignment"; "required": false; "isSignal": true; }; "popoverTriggerOn": { "alias": "popoverTriggerOn"; "required": false; "isSignal": true; }; "popoverOffset": { "alias": "popoverOffset"; "required": false; "isSignal": true; }; "popoverShowArrow": { "alias": "popoverShowArrow"; "required": false; "isSignal": true; }; "popoverVariant": { "alias": "popoverVariant"; "required": false; "isSignal": true; }; "popoverBackdrop": { "alias": "popoverBackdrop"; "required": false; "isSignal": true; }; "popoverCloseOnOutside": { "alias": "popoverCloseOnOutside"; "required": false; "isSignal": true; }; "popoverCloseOnEscape": { "alias": "popoverCloseOnEscape"; "required": false; "isSignal": true; }; "popoverCloseOnScroll": { "alias": "popoverCloseOnScroll"; "required": false; "isSignal": true; }; "popoverDisabled": { "alias": "popoverDisabled"; "required": false; "isSignal": true; }; "popoverOpen": { "alias": "popoverOpen"; "required": false; "isSignal": true; }; "popoverData": { "alias": "popoverData"; "required": false; "isSignal": true; }; "popoverPanelClass": { "alias": "popoverPanelClass"; "required": false; "isSignal": true; }; "popoverTrapFocus": { "alias": "popoverTrapFocus"; "required": false; "isSignal": true; }; "popoverAriaLabel": { "alias": "popoverAriaLabel"; "required": false; "isSignal": true; }; }, { "popoverOpen": "popoverOpenChange"; "popoverOpened": "popoverOpened"; "popoverClosed": "popoverClosed"; }, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComPopoverTrigger, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ComPopoverTrigger, "[comPopoverTrigger]", ["comPopoverTrigger"], { "comPopoverTrigger": { "alias": "comPopoverTrigger"; "required": true; "isSignal": true; }; "popoverPosition": { "alias": "popoverPosition"; "required": false; "isSignal": true; }; "popoverAlignment": { "alias": "popoverAlignment"; "required": false; "isSignal": true; }; "popoverTriggerOn": { "alias": "popoverTriggerOn"; "required": false; "isSignal": true; }; "popoverOffset": { "alias": "popoverOffset"; "required": false; "isSignal": true; }; "popoverShowArrow": { "alias": "popoverShowArrow"; "required": false; "isSignal": true; }; "popoverVariant": { "alias": "popoverVariant"; "required": false; "isSignal": true; }; "popoverBackdrop": { "alias": "popoverBackdrop"; "required": false; "isSignal": true; }; "popoverCloseOnOutside": { "alias": "popoverCloseOnOutside"; "required": false; "isSignal": true; }; "popoverCloseOnEscape": { "alias": "popoverCloseOnEscape"; "required": false; "isSignal": true; }; "popoverCloseOnScroll": { "alias": "popoverCloseOnScroll"; "required": false; "isSignal": true; }; "popoverDisabled": { "alias": "popoverDisabled"; "required": false; "isSignal": true; }; "popoverOpen": { "alias": "popoverOpen"; "required": false; "isSignal": true; }; "popoverData": { "alias": "popoverData"; "required": false; "isSignal": true; }; "popoverPanelClass": { "alias": "popoverPanelClass"; "required": false; "isSignal": true; }; "popoverTrapFocus": { "alias": "popoverTrapFocus"; "required": false; "isSignal": true; }; "popoverAriaLabel": { "alias": "popoverAriaLabel"; "required": false; "isSignal": true; }; }, { "popoverOpen": "popoverOpenChange"; "popoverOpened": "popoverOpened"; "popoverClosed": "popoverClosed"; }, never, never, true, never>;
 }
 
 /**
  * Convenience directive that closes the parent popover when clicked.
  * Applied to elements inside the popover that should dismiss it.
  *
+ * @tokens none
+ *
  * @example
  * ```html
  * <ng-template #confirmPop>
@@ -190,7 +195,7 @@ declare class PopoverTriggerDirective {
  * <button [comPopoverClose]="'cancelled'">No</button>
  * ```
  */
-declare class PopoverCloseDirective {
+declare class ComPopoverClose {
     private readonly popoverRef;
     /**
      * Optional result value to pass when closing.
@@ -198,8 +203,8 @@ declare class PopoverCloseDirective {
      */
     readonly comPopoverClose: InputSignal<unknown>;
     protected closePopover(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<PopoverCloseDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PopoverCloseDirective, "[comPopoverClose]", ["comPopoverClose"], { "comPopoverClose": { "alias": "comPopoverClose"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComPopoverClose, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ComPopoverClose, "[comPopoverClose]", ["comPopoverClose"], { "comPopoverClose": { "alias": "comPopoverClose"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 /**
@@ -210,6 +215,8 @@ declare class PopoverCloseDirective {
  * This directive is primarily semantic — it marks the template as popover content
  * and provides access to the TemplateRef for potential content queries.
  *
+ * @tokens none
+ *
  * @example
  * ```html
  * <button [comPopoverTrigger]="helpContent">Help</button>
@@ -226,11 +233,11 @@ declare class PopoverCloseDirective {
  * </ng-template>
  * ```
  */
-declare class PopoverTemplateDirective {
+declare class ComPopoverTemplate {
     /** Reference to the template for rendering. */
     readonly templateRef: TemplateRef<unknown>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<PopoverTemplateDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PopoverTemplateDirective, "[comPopoverTemplate]", ["comPopoverTemplate"], {}, {}, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComPopoverTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ComPopoverTemplate, "[comPopoverTemplate]", ["comPopoverTemplate"], {}, {}, never, never, true, never>;
 }
 
 /**
@@ -305,5 +312,5 @@ declare function deriveSideFromPosition(pair: ConnectionPositionPair): PopoverSi
  */
 declare function deriveAlignmentFromPosition(pair: ConnectionPositionPair): PopoverAlignment;
 
-export { POPOVER_DATA, POPOVER_REF, PopoverCloseDirective, PopoverTemplateDirective, PopoverTriggerDirective, buildPopoverPositions, deriveAlignmentFromPosition, deriveSideFromPosition, popoverArrowVariants, popoverPanelVariants };
+export { ComPopoverClose, ComPopoverTemplate, ComPopoverTrigger, POPOVER_DATA, POPOVER_REF, buildPopoverPositions, deriveAlignmentFromPosition, deriveSideFromPosition, popoverArrowVariants, popoverPanelVariants };
 export type { PopoverAlignment, PopoverArrowVariants, PopoverBackdrop, PopoverPanelVariants, PopoverPosition, PopoverRef, PopoverSide, PopoverTriggerOn, PopoverVariant };

package/types/ngx-com-components-segmented-control.d.ts

@@ -31,6 +31,8 @@ interface SegmentTemplateContext<T = unknown> {
  * inner content of each segment while the component manages the button,
  * styling, and ARIA attributes.
  *
+ * @tokens none
+ *
  * @example Icon + text
  * ```html
  * <com-segmented-control [options]="viewOptions" [(value)]="currentView">
@@ -150,7 +152,7 @@ interface SegmentOption<T = unknown> {
  *     <span>{{ option.label }}</span>
  *     <span
  *       class="ml-1.5 rounded-pill px-1.5 text-xs"
- *       [class]="active ? 'bg-accent-foreground/20 text-accent-foreground' : 'bg-muted text-muted-foreground'"
+ *       [class]="active ? 'bg-accent-subtle text-accent-subtle-foreground' : 'bg-muted text-muted-foreground'"
  *     >
  *       {{ option.value === 'open' ? openCount : closedCount }}
  *     </span>

package/types/ngx-com-components-sort.d.ts

@@ -29,7 +29,7 @@ declare const sortIconVariants: (props?: {
 }) => string;
 
 /**
- * Sortable header component — child of [uiSort] directive.
+ * Sortable header component — child of [comSort] directive.
  *
  * Apply to table headers, div columns, or any clickable element that should trigger sorting.
  *
@@ -48,9 +48,10 @@ declare const sortIconVariants: (props?: {
  * <th comSortHeader="name" comSortHeaderArrowPosition="before">Name</th>
  * ```
  */
-declare class SortHeaderComponent implements OnInit {
+declare class ComSortHeader implements OnInit {
     private readonly sort;
     private readonly destroyRef;
+    private readonly elementRef;
     /** The column id — aliased from the selector */
     readonly id: InputSignal<string>;
     /** Disable sorting for this specific header */
@@ -69,6 +70,8 @@ declare class SortHeaderComponent implements OnInit {
     readonly showUnsortedIndicator: Signal<boolean>;
     /** Whether sorting is disabled for this header */
     readonly isDisabled: Signal<boolean>;
+    /** Role — only set on non-<th> elements (th has implicit columnheader role) */
+    readonly hostRole: Signal<'columnheader' | null>;
     /** aria-sort attribute value */
     readonly ariaSort: Signal<'ascending' | 'descending' | 'none'>;
     /** CVA-generated host classes */
@@ -76,14 +79,14 @@ declare class SortHeaderComponent implements OnInit {
     constructor();
     ngOnInit(): void;
     protected onClick(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SortHeaderComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SortHeaderComponent, "[comSortHeader]", never, { "id": { "alias": "comSortHeader"; "required": true; "isSignal": true; }; "sortHeaderDisabled": { "alias": "sortHeaderDisabled"; "required": false; "isSignal": true; }; "sortHeaderShowIndicator": { "alias": "sortHeaderShowIndicator"; "required": false; "isSignal": true; }; "sortHeaderArrowPosition": { "alias": "comSortHeaderArrowPosition"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComSortHeader, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ComSortHeader, "[comSortHeader]", never, { "id": { "alias": "comSortHeader"; "required": true; "isSignal": true; }; "sortHeaderDisabled": { "alias": "sortHeaderDisabled"; "required": false; "isSignal": true; }; "sortHeaderShowIndicator": { "alias": "sortHeaderShowIndicator"; "required": false; "isSignal": true; }; "sortHeaderArrowPosition": { "alias": "comSortHeaderArrowPosition"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
 /**
  * Parent directive that manages sort state for a group of sortable headers.
  *
- * Apply to a container element (e.g., `<tr>`, `<div>`) that contains `[uiSortHeader]` children.
+ * Apply to a container element (e.g., `<tr>`, `<div>`) that contains `[comSortHeader]` children.
  * Children inject this directive via DI and read its signals directly.
  *
  * @tokens `--color-foreground`, `--color-muted-foreground`
@@ -103,7 +106,7 @@ declare class SortHeaderComponent implements OnInit {
  * </tr>
  * ```
  */
-declare class SortDirective {
+declare class ComSort {
     /** Currently active sort column id — two-way via model() */
     readonly sortActive: ModelSignal<string | undefined>;
     /** Current sort direction — two-way via model() */
@@ -118,16 +121,16 @@ declare class SortDirective {
     readonly sortChange: OutputEmitterRef<SortEvent>;
     private readonly headers;
     /** Register a sort header with this parent */
-    register(header: SortHeaderComponent): void;
+    register(header: ComSortHeader): void;
     /** Deregister a sort header */
     deregister(id: string): void;
     /** Programmatically sort by a column */
     sort(id: string): void;
     /** Returns the next direction in the cycle for a given column */
     getNextDirection(id: string): SortDirection;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SortDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<SortDirective, "[comSort]", ["comSort"], { "sortActive": { "alias": "sortActive"; "required": false; "isSignal": true; }; "sortDirection": { "alias": "sortDirection"; "required": false; "isSignal": true; }; "sortDisabled": { "alias": "sortDisabled"; "required": false; "isSignal": true; }; "sortCycle": { "alias": "sortCycle"; "required": false; "isSignal": true; }; "sortShowIndicator": { "alias": "sortShowIndicator"; "required": false; "isSignal": true; }; }, { "sortActive": "sortActiveChange"; "sortDirection": "sortDirectionChange"; "sortChange": "sortChange"; }, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComSort, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ComSort, "[comSort]", ["comSort"], { "sortActive": { "alias": "sortActive"; "required": false; "isSignal": true; }; "sortDirection": { "alias": "sortDirection"; "required": false; "isSignal": true; }; "sortDisabled": { "alias": "sortDisabled"; "required": false; "isSignal": true; }; "sortCycle": { "alias": "sortCycle"; "required": false; "isSignal": true; }; "sortShowIndicator": { "alias": "sortShowIndicator"; "required": false; "isSignal": true; }; }, { "sortActive": "sortActiveChange"; "sortDirection": "sortDirectionChange"; "sortChange": "sortChange"; }, never, never, true, never>;
 }
 
-export { SortDirective, SortHeaderComponent, sortHeaderVariants, sortIconVariants };
+export { ComSort, ComSortHeader, sortHeaderVariants, sortIconVariants };
 export type { SortCycle, SortDirection, SortEvent };

package/types/ngx-com-components-table.d.ts

@@ -7,6 +7,8 @@ import { VariantProps } from 'class-variance-authority';
  *
  * Use with the star syntax inside a `comColumnDef` container.
  *
+ * @tokens none
+ *
  * @example
  * ```html
  * <ng-container comColumnDef="name">
@@ -32,6 +34,8 @@ interface CellDefContext<T> {
  *
  * Use with the star syntax inside a `comColumnDef` container.
  *
+ * @tokens none
+ *
  * @example
  * ```html
  * <ng-container comColumnDef="name">
@@ -51,6 +55,8 @@ declare class ComCellDef<T = unknown> {
  *
  * Use with the star syntax inside a `comColumnDef` container.
  *
+ * @tokens none
+ *
  * @example
  * ```html
  * <ng-container comColumnDef="amount">
@@ -71,6 +77,8 @@ declare class ComFooterCellDef {
  *
  * Contains a header cell template, a body cell template, and an optional footer cell template.
  *
+ * @tokens none
+ *
  * @example
  * ```html
  * <ng-container comColumnDef="name">
@@ -95,6 +103,8 @@ declare class ComColumnDef {
 /**
  * Defines which columns appear in the header row and their order.
  *
+ * @tokens none
+ *
  * @example
  * ```html
  * <tr comHeaderRowDef="['name', 'email', 'role']"></tr>
@@ -117,6 +127,8 @@ declare class ComHeaderRowDef {
 /**
  * Defines which columns appear in each body row and their order.
  *
+ * @tokens none
+ *
  * @example
  * ```html
  * <tr comRowDef [comRowDefColumns]="['name', 'email', 'role']"></tr>
@@ -132,6 +144,8 @@ declare class ComRowDef {
 /**
  * Defines which columns appear in the footer row and their order.
  *
+ * @tokens none
+ *
  * @example
  * ```html
  * <tr comFooterRowDef="['description', 'amount']"></tr>
@@ -149,6 +163,8 @@ declare class ComFooterRowDef {
  *
  * Place inside `com-table`. The template receives the column count for colspan.
  *
+ * @tokens none
+ *
  * @example
  * ```html
  * <com-table [dataSource]="data()">
@@ -350,8 +366,6 @@ declare class ComTable<T> {
     /** @internal Map of column name → column definition for O(1) lookup. */
     protected readonly columnDefMap: Signal<Map<string, ComColumnDef>>;
     /** @internal Resolved render data — handles both array and DataSource inputs. */
-    private readonly dataSourceSignal;
-    /** @internal The actual data array to render. */
     readonly renderData: Signal<readonly T[]>;
     /** @internal Header column names. */
     protected readonly headerColumns: Signal<string[]>;