@acorex/cdk 21.0.2-next.4 → 21.0.2-next.40

package/fesm2022/acorex-cdk-overlay.mjs

@@ -195,6 +195,7 @@ class AXOverlayService {
                 dispose();
             });
         }
+        this.addHostClass(options?.anchorOptions?.anchor, overlayContainer);
         return {
             instance,
             updatePosition,
@@ -381,10 +382,22 @@ class AXOverlayService {
         container.style.top = `${coords.top}px`;
         container.style.left = `${coords.left}px`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXOverlayService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXOverlayService, providedIn: 'root' }); }
+    addHostClass(refElement, targetElement) {
+        if (!refElement || !targetElement)
+            return;
+        const el = refElement instanceof ElementRef ? refElement.nativeElement : refElement;
+        const computedStyle = getComputedStyle(el);
+        const classSize = computedStyle.getPropertyValue('--ax-sys-size');
+        const themeColor = +computedStyle.getPropertyValue('--ax-sys-theme-isDark');
+        if (themeColor === 1)
+            targetElement.classList.add('ax-dark');
+        if (classSize)
+            targetElement.classList.add(classSize);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXOverlayService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXOverlayService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXOverlayService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXOverlayService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',

package/fesm2022/acorex-cdk-overlay.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-cdk-overlay.mjs","sources":["../../../../packages/cdk/overlay/src/lib/overlay.types.ts","../../../../packages/cdk/overlay/src/lib/overlay.service.ts","../../../../packages/cdk/overlay/src/acorex-cdk-overlay.ts"],"sourcesContent":["import { AXConnectedPosition, AXPlacement, AXPlacementType } from '@acorex/cdk/common';\nimport { AXComponentOptions } from '@acorex/core/components';\nimport { AXZToken } from '@acorex/core/z-index';\nimport { ComponentRef, ElementRef, EmbeddedViewRef } from '@angular/core';\n\nexport interface AXOverlayRef<T> {\n  instance: EmbeddedViewRef<T> | ComponentRef<T>;\n  /** Updates the overlay position relative to the anchor */\n  updatePosition: () => void;\n  /** Destroys the overlay and removes it from the DOM */\n  dispose: () => void;\n  /** The overlay container element */\n  overlayElement: HTMLElement | null;\n  /** The z-index token for this overlay */\n  zToken: AXZToken | null;\n  /** Brings this overlay to the front of all other overlays */\n  bringToFront: () => void;\n}\n\nexport interface AXOverlayAnchorOptions {\n  /** The anchor element to position relative to */\n  anchor: HTMLElement | ElementRef<HTMLElement>;\n  /** Placement of the overlay relative to the anchor */\n  placement?: AXPlacementType;\n  /** Horizontal offset in pixels */\n  offsetX?: number;\n  /** Vertical offset in pixels */\n  offsetY?: number;\n  /** Whether to flip the overlay when it overflows the viewport */\n  autoFlip?: boolean;\n}\n\nexport interface AXOverlayOptions extends AXComponentOptions {\n  backdrop?: {\n    enabled?: boolean;\n    background?: boolean;\n    backdropClass?: string;\n    closeOnClick?: boolean;\n  };\n  position?: AXPlacement;\n  /** Anchor-based positioning options for tooltips, popovers, etc. */\n  anchorOptions?: AXOverlayAnchorOptions;\n  /** Custom CSS class for the overlay panel */\n  panelClass?: string | string[];\n  /** Whether to close when clicking outside */\n  closeOnOutsideClick?: boolean;\n  /** Whether to close when pressing Escape */\n  closeOnEscape?: boolean;\n  /** Width of the overlay container (e.g., 'auto', '200px', '100%') */\n  width?: string;\n  /** Callback when the overlay is disposed (e.g., due to scroll) */\n  onDispose?: () => void;\n  /** Whether to use centered container (default: true). Set to false for positioned overlays like toasts */\n  centered?: boolean;\n  actionSheetStyle?: boolean;\n}\n\n/**\n * Calculates the position of an overlay element relative to an anchor element.\n */\nexport function calculateAnchorPosition(\n  anchorRect: DOMRect,\n  overlayRect: DOMRect,\n  position: AXConnectedPosition,\n): { top: number; left: number } {\n  let left = 0;\n  let top = 0;\n\n  // Calculate origin point on anchor\n  switch (position.originX) {\n    case 'start':\n      left = anchorRect.left;\n      break;\n    case 'center':\n      left = anchorRect.left + anchorRect.width / 2;\n      break;\n    case 'end':\n      left = anchorRect.right;\n      break;\n  }\n\n  switch (position.originY) {\n    case 'top':\n      top = anchorRect.top;\n      break;\n    case 'center':\n      top = anchorRect.top + anchorRect.height / 2;\n      break;\n    case 'bottom':\n      top = anchorRect.bottom;\n      break;\n  }\n\n  // Adjust for overlay alignment\n  switch (position.overlayX) {\n    case 'start':\n      // left stays the same\n      break;\n    case 'center':\n      left -= overlayRect.width / 2;\n      break;\n    case 'end':\n      left -= overlayRect.width;\n      break;\n  }\n\n  switch (position.overlayY) {\n    case 'top':\n      // top stays the same\n      break;\n    case 'center':\n      top -= overlayRect.height / 2;\n      break;\n    case 'bottom':\n      top -= overlayRect.height;\n      break;\n  }\n\n  // Apply offsets\n  if (position.offsetX) {\n    left += position.offsetX;\n  }\n  if (position.offsetY) {\n    top += position.offsetY;\n  }\n\n  return { top, left };\n}\n\n/**\n * Checks if the overlay position fits within the viewport.\n */\nexport function fitsInViewport(\n  position: { top: number; left: number },\n  overlayRect: DOMRect,\n  viewportWidth: number,\n  viewportHeight: number,\n): boolean {\n  return (\n    position.left >= 0 &&\n    position.top >= 0 &&\n    position.left + overlayRect.width <= viewportWidth &&\n    position.top + overlayRect.height <= viewportHeight\n  );\n}\n\n/**\n * Clamps a position to ensure the overlay stays within viewport bounds.\n */\nexport function clampToViewport(\n  coords: { top: number; left: number },\n  overlayRect: DOMRect,\n  viewportWidth: number,\n  viewportHeight: number,\n  margin = 4,\n): { top: number; left: number } {\n  const clampedLeft = Math.max(margin, Math.min(coords.left, viewportWidth - overlayRect.width - margin));\n  const clampedTop = Math.max(margin, Math.min(coords.top, viewportHeight - overlayRect.height - margin));\n\n  return { top: clampedTop, left: clampedLeft };\n}\n\n/**\n * Finds the best position for an overlay that fits in the viewport.\n */\nexport function findBestPosition(\n  anchorRect: DOMRect,\n  overlayRect: DOMRect,\n  positions: AXConnectedPosition[],\n  viewportWidth: number,\n  viewportHeight: number,\n): { position: AXConnectedPosition; coords: { top: number; left: number } } {\n  for (const position of positions) {\n    const coords = calculateAnchorPosition(anchorRect, overlayRect, position);\n\n    if (fitsInViewport(coords, overlayRect, viewportWidth, viewportHeight)) {\n      return { position, coords };\n    }\n  }\n\n  // Fallback to first position if none fit, but clamp to viewport bounds\n  const fallbackCoords = calculateAnchorPosition(anchorRect, overlayRect, positions[0]);\n  const clampedCoords = clampToViewport(fallbackCoords, overlayRect, viewportWidth, viewportHeight);\n  return { position: positions[0], coords: clampedCoords };\n}\n","import { convertToPlacement } from '@acorex/cdk/common';\nimport { AXComponentContent, AXComponentService } from '@acorex/core/components';\nimport { AXPlatform } from '@acorex/core/platform';\nimport { AXZIndexService, AXZToken } from '@acorex/core/z-index';\nimport { DOCUMENT } from '@angular/common';\nimport { ComponentRef, ElementRef, EmbeddedViewRef, inject, Injectable, TemplateRef } from '@angular/core';\nimport { AXOverlayOptions, AXOverlayRef, findBestPosition } from './overlay.types';\n\n@Injectable({\n  providedIn: 'root',\n})\nexport class AXOverlayService {\n  private componentService = inject(AXComponentService);\n  private document = inject(DOCUMENT);\n  private zIndexService = inject(AXZIndexService);\n  private _platform: AXPlatform = inject(AXPlatform);\n\n  /**\n   * Creates an overlay with optional anchor-based positioning.\n   * @param content - Component or template to display\n   * @param options - Configuration options for the overlay\n   * @returns Promise<AXOverlayRef> - Reference to the created overlay\n   */\n  async create<T = unknown>(content: AXComponentContent<T>, options?: AXOverlayOptions): Promise<AXOverlayRef<T>> {\n    let instance: EmbeddedViewRef<T> | ComponentRef<T>;\n    let overlayContainer: HTMLElement | null = null;\n    let backdropElement: HTMLElement | null = null;\n    let isDisposed = false;\n\n    // Acquire a z-index token for this overlay\n    let zToken: AXZToken | null = this.zIndexService.acquire();\n\n    if (content instanceof TemplateRef) {\n      instance = this.componentService.createFromTemplate<T>(content);\n    } else {\n      instance = this.componentService.createFromComponent<T>(content);\n      if (options?.inputs) {\n        Object.entries(options.inputs).forEach((c) => {\n          (instance as ComponentRef<T>).setInput(c[0], c[1]);\n        });\n      }\n    }\n\n    // Get the host element\n    const hostElement = this.getHostElement(instance);\n\n    // Create backdrop if enabled\n    if (options?.backdrop?.enabled) {\n      backdropElement = this.createBackdrop(options, zToken.zIndex);\n    }\n\n    // If anchor options are provided, set up positioned overlay (for tooltips, popovers)\n    if (options?.anchorOptions?.anchor) {\n      overlayContainer = this.createOverlayContainer(hostElement, options, zToken.zIndex);\n      this.positionOverlay(overlayContainer, options);\n    } else if (options?.centered === false) {\n      // Non-centered positioned overlay (for toasts, notifications)\n      overlayContainer = this.createOverlayContainer(hostElement, options, zToken.zIndex);\n    } else {\n      // No anchor - create centered overlay (for modals, popups)\n      overlayContainer = this.createCenteredOverlayContainer(hostElement, options, zToken.zIndex);\n    }\n\n    const updatePosition = () => {\n      if (overlayContainer && options?.anchorOptions?.anchor) {\n        this.positionOverlay(overlayContainer, options);\n      }\n    };\n\n    const dispose = () => {\n      if (isDisposed) return;\n      isDisposed = true;\n\n      // Remove backdrop\n      if (backdropElement) {\n        backdropElement.remove();\n      }\n\n      if (overlayContainer) {\n        overlayContainer.remove();\n      }\n      if (instance instanceof ComponentRef) {\n        instance.destroy();\n      } else {\n        instance.destroy();\n      }\n\n      // Release the z-index token\n      this.zIndexService.release(zToken);\n      zToken = null;\n\n      // Notify callback\n      options?.onDispose?.();\n    };\n\n    const bringToFront = () => {\n      if (!zToken || isDisposed) return;\n      zToken = this.zIndexService.bringToFront(zToken);\n      if (backdropElement) {\n        backdropElement.style.zIndex = String(zToken.zIndex);\n      }\n      if (overlayContainer) {\n        overlayContainer.style.zIndex = String(zToken.zIndex);\n      }\n    };\n\n    // Set up backdrop click handler\n    if (backdropElement && options?.backdrop?.closeOnClick) {\n      backdropElement.addEventListener('click', () => {\n        dispose();\n      });\n    }\n\n    return {\n      instance,\n      updatePosition,\n      dispose,\n      overlayElement: overlayContainer,\n      zToken,\n      bringToFront,\n    };\n  }\n\n  /**\n   * Creates a backdrop element.\n   */\n  private createBackdrop(options: AXOverlayOptions | undefined, zIndex: number): HTMLElement {\n    const backdrop = this.document.createElement('div');\n    backdrop.classList.add('ax-overlay-backdrop');\n\n    if (options?.backdrop?.backdropClass) {\n      backdrop.classList.add(options.backdrop.backdropClass);\n    }\n\n    // Style the backdrop\n    backdrop.style.position = 'fixed';\n    backdrop.style.top = '0';\n    backdrop.style.left = '0';\n    backdrop.style.width = '100%';\n    backdrop.style.height = '100%';\n    backdrop.style.zIndex = String(zIndex);\n\n    if (options?.backdrop?.background) {\n      backdrop.style.backgroundColor = 'rgba(0, 0, 0, 0.5)';\n    }\n\n    this.document.body.appendChild(backdrop);\n    return backdrop;\n  }\n\n  /**\n   * Creates a centered overlay container (for modals/popups).\n   */\n  private createCenteredOverlayContainer(\n    content: HTMLElement,\n    options: AXOverlayOptions | undefined,\n    zIndex: number,\n  ): HTMLElement {\n    const container = this.document.createElement('div');\n    container.classList.add('ax-overlay-container', 'ax-overlay-centered');\n\n    // Add custom panel classes\n    if (options?.panelClass) {\n      const classes = Array.isArray(options.panelClass) ? options.panelClass : [options.panelClass];\n      classes.forEach((cls) => {\n        if (cls) {\n          container.classList.add(cls);\n        }\n      });\n    }\n\n    // Set styles for centered positioning\n    container.style.position = 'fixed';\n    container.style.top = '0';\n    container.style.left = '0';\n    container.style.width = '100%';\n    container.style.height = '100%';\n    container.style.display = 'flex';\n    container.style.alignItems = 'center';\n    container.style.justifyContent = 'center';\n    container.style.zIndex = String(zIndex);\n\n    // Create inner wrapper for the content\n    const contentWrapper = this.document.createElement('div');\n    contentWrapper.classList.add('ax-overlay-content');\n\n    // Apply width if provided\n    if (options?.width) {\n      contentWrapper.style.width = options.width;\n    }\n\n    // Move content into wrapper\n    contentWrapper.appendChild(content);\n    container.appendChild(contentWrapper);\n\n    // Append to body\n    this.document.body.appendChild(container);\n\n    return container;\n  }\n\n  /**\n   * Gets the host element from a ComponentRef or EmbeddedViewRef.\n   */\n  private getHostElement<T>(instance: EmbeddedViewRef<T> | ComponentRef<T>): HTMLElement {\n    if (instance instanceof ComponentRef) {\n      return instance.location.nativeElement;\n    } else {\n      // EmbeddedViewRef - get the first root node\n      return instance.rootNodes[0] as HTMLElement;\n    }\n  }\n\n  /**\n   * Creates an overlay container element and appends the content to it.\n   */\n  private createOverlayContainer(\n    content: HTMLElement,\n    options: AXOverlayOptions | undefined,\n    zIndex: number,\n  ): HTMLElement {\n    const container = this.document.createElement('div');\n    const pane = this.document.createElement('div');\n    container.classList.add('ax-overlay-container');\n\n    if (Array.isArray(options.panelClass)) {\n      const check = options.panelClass.some((element) => {\n        return element === 'ax-action-sheet-panel';\n      });\n      if (!check) pane.classList.add('ax-overlay-pane');\n    }\n\n    if (options.actionSheetStyle && this._platform.is('SM')) pane.classList.add('ax-overlay-actionsheet');\n\n    // Add custom panel classes\n    if (options?.panelClass) {\n      const classes = Array.isArray(options.panelClass) ? options.panelClass : [options.panelClass];\n      classes.forEach((cls) => {\n        if (cls) {\n          container.classList.add(cls);\n        }\n      });\n    }\n\n    // Set initial styles for positioning\n    container.style.position = 'fixed';\n    container.style.zIndex = String(zIndex);\n    container.style.maxWidth = '100vw';\n    container.style.maxHeight = '100vh';\n\n    if (options?.actionSheetStyle) {\n      container.style.width = this._platform.is('SM') ? '100%' : 'fit-content';\n    } else {\n      container.style.width = options?.width || 'fit-content';\n    }\n\n    // Move content into container\n    pane.appendChild(content);\n    container.appendChild(pane);\n\n    // Append to body\n    this.document.body.appendChild(container);\n\n    return container;\n  }\n\n  /**\n   * Positions the overlay container relative to the anchor element.\n   */\n  private positionOverlay(container: HTMLElement, options: AXOverlayOptions): void {\n    if (options.actionSheetStyle && this._platform.is('SM')) {\n      container.style.bottom = `0px`;\n      container.style.left = `0px`;\n      return;\n    }\n\n    const anchorOptions = options.anchorOptions;\n    if (!anchorOptions?.anchor) return;\n\n    const anchorElement =\n      anchorOptions.anchor instanceof ElementRef ? anchorOptions.anchor.nativeElement : anchorOptions.anchor;\n\n    const anchorRect = anchorElement.getBoundingClientRect();\n    const containerRect = container.getBoundingClientRect();\n    const viewportWidth = window.innerWidth;\n    const viewportHeight = window.innerHeight;\n\n    // Get positions from placement\n    let positions = convertToPlacement(anchorOptions.placement ?? 'bottom');\n    if (positions.length === 0) {\n      positions = convertToPlacement('bottom');\n    }\n\n    // Apply custom offsets to positions with direction-aware inversion\n    // When position flips, the offset should also be inverted to maintain the intended gap\n    if (anchorOptions.offsetX || anchorOptions.offsetY) {\n      const primaryPosition = positions[0];\n      positions = positions.map((p) => {\n        let adjustedOffsetX = anchorOptions.offsetX ?? 0;\n        let adjustedOffsetY = anchorOptions.offsetY ?? 0;\n\n        // Invert offsetY when vertical direction flips\n        // (from bottom to top or vice versa)\n        if (primaryPosition.originY !== p.originY) {\n          adjustedOffsetY = -adjustedOffsetY;\n        }\n\n        // Invert offsetX when horizontal direction flips\n        // (from end to start or vice versa)\n        if (primaryPosition.originX !== p.originX) {\n          adjustedOffsetX = -adjustedOffsetX;\n        }\n\n        return {\n          ...p,\n          offsetX: (p.offsetX ?? 0) + adjustedOffsetX,\n          offsetY: (p.offsetY ?? 0) + adjustedOffsetY,\n        };\n      });\n    }\n\n    // Find the best position that fits in viewport\n    const { coords } = anchorOptions.autoFlip\n      ? findBestPosition(anchorRect, containerRect, positions, viewportWidth, viewportHeight)\n      : {\n          coords: {\n            top:\n              positions[0].originY === 'bottom'\n                ? anchorRect.bottom + (positions[0].offsetY ?? 0)\n                : anchorRect.top - containerRect.height + (positions[0].offsetY ?? 0),\n            left: anchorRect.left + (positions[0].offsetX ?? 0),\n          },\n        };\n\n    // Apply position\n    container.style.top = `${coords.top}px`;\n    container.style.left = `${coords.left}px`;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-cdk-overlay.mjs","sources":["../../../../packages/cdk/overlay/src/lib/overlay.types.ts","../../../../packages/cdk/overlay/src/lib/overlay.service.ts","../../../../packages/cdk/overlay/src/acorex-cdk-overlay.ts"],"sourcesContent":["import { AXConnectedPosition, AXPlacement, AXPlacementType } from '@acorex/cdk/common';\nimport { AXComponentOptions } from '@acorex/core/components';\nimport { AXZToken } from '@acorex/core/z-index';\nimport { ComponentRef, ElementRef, EmbeddedViewRef } from '@angular/core';\n\nexport interface AXOverlayRef<T> {\n  instance: EmbeddedViewRef<T> | ComponentRef<T>;\n  /** Updates the overlay position relative to the anchor */\n  updatePosition: () => void;\n  /** Destroys the overlay and removes it from the DOM */\n  dispose: () => void;\n  /** The overlay container element */\n  overlayElement: HTMLElement | null;\n  /** The z-index token for this overlay */\n  zToken: AXZToken | null;\n  /** Brings this overlay to the front of all other overlays */\n  bringToFront: () => void;\n}\n\nexport interface AXOverlayAnchorOptions {\n  /** The anchor element to position relative to */\n  anchor: HTMLElement | ElementRef<HTMLElement>;\n  /** Placement of the overlay relative to the anchor */\n  placement?: AXPlacementType;\n  /** Horizontal offset in pixels */\n  offsetX?: number;\n  /** Vertical offset in pixels */\n  offsetY?: number;\n  /** Whether to flip the overlay when it overflows the viewport */\n  autoFlip?: boolean;\n}\n\nexport interface AXOverlayOptions extends AXComponentOptions {\n  backdrop?: {\n    enabled?: boolean;\n    background?: boolean;\n    backdropClass?: string;\n    closeOnClick?: boolean;\n  };\n  position?: AXPlacement;\n  /** Anchor-based positioning options for tooltips, popovers, etc. */\n  anchorOptions?: AXOverlayAnchorOptions;\n  /** Custom CSS class for the overlay panel */\n  panelClass?: string | string[];\n  /** Whether to close when clicking outside */\n  closeOnOutsideClick?: boolean;\n  /** Whether to close when pressing Escape */\n  closeOnEscape?: boolean;\n  /** Width of the overlay container (e.g., 'auto', '200px', '100%') */\n  width?: string;\n  /** Callback when the overlay is disposed (e.g., due to scroll) */\n  onDispose?: () => void;\n  /** Whether to use centered container (default: true). Set to false for positioned overlays like toasts */\n  centered?: boolean;\n  actionSheetStyle?: boolean;\n}\n\n/**\n * Calculates the position of an overlay element relative to an anchor element.\n */\nexport function calculateAnchorPosition(\n  anchorRect: DOMRect,\n  overlayRect: DOMRect,\n  position: AXConnectedPosition,\n): { top: number; left: number } {\n  let left = 0;\n  let top = 0;\n\n  // Calculate origin point on anchor\n  switch (position.originX) {\n    case 'start':\n      left = anchorRect.left;\n      break;\n    case 'center':\n      left = anchorRect.left + anchorRect.width / 2;\n      break;\n    case 'end':\n      left = anchorRect.right;\n      break;\n  }\n\n  switch (position.originY) {\n    case 'top':\n      top = anchorRect.top;\n      break;\n    case 'center':\n      top = anchorRect.top + anchorRect.height / 2;\n      break;\n    case 'bottom':\n      top = anchorRect.bottom;\n      break;\n  }\n\n  // Adjust for overlay alignment\n  switch (position.overlayX) {\n    case 'start':\n      // left stays the same\n      break;\n    case 'center':\n      left -= overlayRect.width / 2;\n      break;\n    case 'end':\n      left -= overlayRect.width;\n      break;\n  }\n\n  switch (position.overlayY) {\n    case 'top':\n      // top stays the same\n      break;\n    case 'center':\n      top -= overlayRect.height / 2;\n      break;\n    case 'bottom':\n      top -= overlayRect.height;\n      break;\n  }\n\n  // Apply offsets\n  if (position.offsetX) {\n    left += position.offsetX;\n  }\n  if (position.offsetY) {\n    top += position.offsetY;\n  }\n\n  return { top, left };\n}\n\n/**\n * Checks if the overlay position fits within the viewport.\n */\nexport function fitsInViewport(\n  position: { top: number; left: number },\n  overlayRect: DOMRect,\n  viewportWidth: number,\n  viewportHeight: number,\n): boolean {\n  return (\n    position.left >= 0 &&\n    position.top >= 0 &&\n    position.left + overlayRect.width <= viewportWidth &&\n    position.top + overlayRect.height <= viewportHeight\n  );\n}\n\n/**\n * Clamps a position to ensure the overlay stays within viewport bounds.\n */\nexport function clampToViewport(\n  coords: { top: number; left: number },\n  overlayRect: DOMRect,\n  viewportWidth: number,\n  viewportHeight: number,\n  margin = 4,\n): { top: number; left: number } {\n  const clampedLeft = Math.max(margin, Math.min(coords.left, viewportWidth - overlayRect.width - margin));\n  const clampedTop = Math.max(margin, Math.min(coords.top, viewportHeight - overlayRect.height - margin));\n\n  return { top: clampedTop, left: clampedLeft };\n}\n\n/**\n * Finds the best position for an overlay that fits in the viewport.\n */\nexport function findBestPosition(\n  anchorRect: DOMRect,\n  overlayRect: DOMRect,\n  positions: AXConnectedPosition[],\n  viewportWidth: number,\n  viewportHeight: number,\n): { position: AXConnectedPosition; coords: { top: number; left: number } } {\n  for (const position of positions) {\n    const coords = calculateAnchorPosition(anchorRect, overlayRect, position);\n\n    if (fitsInViewport(coords, overlayRect, viewportWidth, viewportHeight)) {\n      return { position, coords };\n    }\n  }\n\n  // Fallback to first position if none fit, but clamp to viewport bounds\n  const fallbackCoords = calculateAnchorPosition(anchorRect, overlayRect, positions[0]);\n  const clampedCoords = clampToViewport(fallbackCoords, overlayRect, viewportWidth, viewportHeight);\n  return { position: positions[0], coords: clampedCoords };\n}\n","import { convertToPlacement } from '@acorex/cdk/common';\nimport { AXComponentContent, AXComponentService } from '@acorex/core/components';\nimport { AXPlatform } from '@acorex/core/platform';\nimport { AXZIndexService, AXZToken } from '@acorex/core/z-index';\nimport { DOCUMENT } from '@angular/common';\nimport { ComponentRef, ElementRef, EmbeddedViewRef, inject, Injectable, TemplateRef } from '@angular/core';\nimport { AXOverlayOptions, AXOverlayRef, findBestPosition } from './overlay.types';\n\n@Injectable({\n  providedIn: 'root',\n})\nexport class AXOverlayService {\n  private componentService = inject(AXComponentService);\n  private document = inject(DOCUMENT);\n  private zIndexService = inject(AXZIndexService);\n  private _platform: AXPlatform = inject(AXPlatform);\n\n  /**\n   * Creates an overlay with optional anchor-based positioning.\n   * @param content - Component or template to display\n   * @param options - Configuration options for the overlay\n   * @returns Promise<AXOverlayRef> - Reference to the created overlay\n   */\n  async create<T = unknown>(content: AXComponentContent<T>, options?: AXOverlayOptions): Promise<AXOverlayRef<T>> {\n    let instance: EmbeddedViewRef<T> | ComponentRef<T>;\n    let overlayContainer: HTMLElement | null = null;\n    let backdropElement: HTMLElement | null = null;\n    let isDisposed = false;\n\n    // Acquire a z-index token for this overlay\n    let zToken: AXZToken | null = this.zIndexService.acquire();\n\n    if (content instanceof TemplateRef) {\n      instance = this.componentService.createFromTemplate<T>(content);\n    } else {\n      instance = this.componentService.createFromComponent<T>(content);\n      if (options?.inputs) {\n        Object.entries(options.inputs).forEach((c) => {\n          (instance as ComponentRef<T>).setInput(c[0], c[1]);\n        });\n      }\n    }\n\n    // Get the host element\n    const hostElement = this.getHostElement(instance);\n\n    // Create backdrop if enabled\n    if (options?.backdrop?.enabled) {\n      backdropElement = this.createBackdrop(options, zToken.zIndex);\n    }\n\n    // If anchor options are provided, set up positioned overlay (for tooltips, popovers)\n    if (options?.anchorOptions?.anchor) {\n      overlayContainer = this.createOverlayContainer(hostElement, options, zToken.zIndex);\n      this.positionOverlay(overlayContainer, options);\n    } else if (options?.centered === false) {\n      // Non-centered positioned overlay (for toasts, notifications)\n      overlayContainer = this.createOverlayContainer(hostElement, options, zToken.zIndex);\n    } else {\n      // No anchor - create centered overlay (for modals, popups)\n      overlayContainer = this.createCenteredOverlayContainer(hostElement, options, zToken.zIndex);\n    }\n\n    const updatePosition = () => {\n      if (overlayContainer && options?.anchorOptions?.anchor) {\n        this.positionOverlay(overlayContainer, options);\n      }\n    };\n\n    const dispose = () => {\n      if (isDisposed) return;\n      isDisposed = true;\n\n      // Remove backdrop\n      if (backdropElement) {\n        backdropElement.remove();\n      }\n\n      if (overlayContainer) {\n        overlayContainer.remove();\n      }\n      if (instance instanceof ComponentRef) {\n        instance.destroy();\n      } else {\n        instance.destroy();\n      }\n\n      // Release the z-index token\n      this.zIndexService.release(zToken);\n      zToken = null;\n\n      // Notify callback\n      options?.onDispose?.();\n    };\n\n    const bringToFront = () => {\n      if (!zToken || isDisposed) return;\n      zToken = this.zIndexService.bringToFront(zToken);\n      if (backdropElement) {\n        backdropElement.style.zIndex = String(zToken.zIndex);\n      }\n      if (overlayContainer) {\n        overlayContainer.style.zIndex = String(zToken.zIndex);\n      }\n    };\n\n    // Set up backdrop click handler\n    if (backdropElement && options?.backdrop?.closeOnClick) {\n      backdropElement.addEventListener('click', () => {\n        dispose();\n      });\n    }\n\n    this.addHostClass(options?.anchorOptions?.anchor, overlayContainer);\n\n    return {\n      instance,\n      updatePosition,\n      dispose,\n      overlayElement: overlayContainer,\n      zToken,\n      bringToFront,\n    };\n  }\n\n  /**\n   * Creates a backdrop element.\n   */\n  private createBackdrop(options: AXOverlayOptions | undefined, zIndex: number): HTMLElement {\n    const backdrop = this.document.createElement('div');\n    backdrop.classList.add('ax-overlay-backdrop');\n\n    if (options?.backdrop?.backdropClass) {\n      backdrop.classList.add(options.backdrop.backdropClass);\n    }\n\n    // Style the backdrop\n    backdrop.style.position = 'fixed';\n    backdrop.style.top = '0';\n    backdrop.style.left = '0';\n    backdrop.style.width = '100%';\n    backdrop.style.height = '100%';\n    backdrop.style.zIndex = String(zIndex);\n\n    if (options?.backdrop?.background) {\n      backdrop.style.backgroundColor = 'rgba(0, 0, 0, 0.5)';\n    }\n\n    this.document.body.appendChild(backdrop);\n    return backdrop;\n  }\n\n  /**\n   * Creates a centered overlay container (for modals/popups).\n   */\n  private createCenteredOverlayContainer(\n    content: HTMLElement,\n    options: AXOverlayOptions | undefined,\n    zIndex: number,\n  ): HTMLElement {\n    const container = this.document.createElement('div');\n    container.classList.add('ax-overlay-container', 'ax-overlay-centered');\n\n    // Add custom panel classes\n    if (options?.panelClass) {\n      const classes = Array.isArray(options.panelClass) ? options.panelClass : [options.panelClass];\n      classes.forEach((cls) => {\n        if (cls) {\n          container.classList.add(cls);\n        }\n      });\n    }\n\n    // Set styles for centered positioning\n    container.style.position = 'fixed';\n    container.style.top = '0';\n    container.style.left = '0';\n    container.style.width = '100%';\n    container.style.height = '100%';\n    container.style.display = 'flex';\n    container.style.alignItems = 'center';\n    container.style.justifyContent = 'center';\n    container.style.zIndex = String(zIndex);\n\n    // Create inner wrapper for the content\n    const contentWrapper = this.document.createElement('div');\n    contentWrapper.classList.add('ax-overlay-content');\n\n    // Apply width if provided\n    if (options?.width) {\n      contentWrapper.style.width = options.width;\n    }\n\n    // Move content into wrapper\n    contentWrapper.appendChild(content);\n    container.appendChild(contentWrapper);\n\n    // Append to body\n    this.document.body.appendChild(container);\n\n    return container;\n  }\n\n  /**\n   * Gets the host element from a ComponentRef or EmbeddedViewRef.\n   */\n  private getHostElement<T>(instance: EmbeddedViewRef<T> | ComponentRef<T>): HTMLElement {\n    if (instance instanceof ComponentRef) {\n      return instance.location.nativeElement;\n    } else {\n      // EmbeddedViewRef - get the first root node\n      return instance.rootNodes[0] as HTMLElement;\n    }\n  }\n\n  /**\n   * Creates an overlay container element and appends the content to it.\n   */\n  private createOverlayContainer(\n    content: HTMLElement,\n    options: AXOverlayOptions | undefined,\n    zIndex: number,\n  ): HTMLElement {\n    const container = this.document.createElement('div');\n    const pane = this.document.createElement('div');\n    container.classList.add('ax-overlay-container');\n\n    if (Array.isArray(options.panelClass)) {\n      const check = options.panelClass.some((element) => {\n        return element === 'ax-action-sheet-panel';\n      });\n      if (!check) pane.classList.add('ax-overlay-pane');\n    }\n\n    if (options.actionSheetStyle && this._platform.is('SM')) pane.classList.add('ax-overlay-actionsheet');\n\n    // Add custom panel classes\n    if (options?.panelClass) {\n      const classes = Array.isArray(options.panelClass) ? options.panelClass : [options.panelClass];\n      classes.forEach((cls) => {\n        if (cls) {\n          container.classList.add(cls);\n        }\n      });\n    }\n\n    // Set initial styles for positioning\n    container.style.position = 'fixed';\n    container.style.zIndex = String(zIndex);\n    container.style.maxWidth = '100vw';\n    container.style.maxHeight = '100vh';\n\n    if (options?.actionSheetStyle) {\n      container.style.width = this._platform.is('SM') ? '100%' : 'fit-content';\n    } else {\n      container.style.width = options?.width || 'fit-content';\n    }\n\n    // Move content into container\n    pane.appendChild(content);\n    container.appendChild(pane);\n\n    // Append to body\n    this.document.body.appendChild(container);\n\n    return container;\n  }\n\n  /**\n   * Positions the overlay container relative to the anchor element.\n   */\n  private positionOverlay(container: HTMLElement, options: AXOverlayOptions): void {\n    if (options.actionSheetStyle && this._platform.is('SM')) {\n      container.style.bottom = `0px`;\n      container.style.left = `0px`;\n      return;\n    }\n\n    const anchorOptions = options.anchorOptions;\n    if (!anchorOptions?.anchor) return;\n\n    const anchorElement =\n      anchorOptions.anchor instanceof ElementRef ? anchorOptions.anchor.nativeElement : anchorOptions.anchor;\n\n    const anchorRect = anchorElement.getBoundingClientRect();\n    const containerRect = container.getBoundingClientRect();\n    const viewportWidth = window.innerWidth;\n    const viewportHeight = window.innerHeight;\n\n    // Get positions from placement\n    let positions = convertToPlacement(anchorOptions.placement ?? 'bottom');\n    if (positions.length === 0) {\n      positions = convertToPlacement('bottom');\n    }\n\n    // Apply custom offsets to positions with direction-aware inversion\n    // When position flips, the offset should also be inverted to maintain the intended gap\n    if (anchorOptions.offsetX || anchorOptions.offsetY) {\n      const primaryPosition = positions[0];\n      positions = positions.map((p) => {\n        let adjustedOffsetX = anchorOptions.offsetX ?? 0;\n        let adjustedOffsetY = anchorOptions.offsetY ?? 0;\n\n        // Invert offsetY when vertical direction flips\n        // (from bottom to top or vice versa)\n        if (primaryPosition.originY !== p.originY) {\n          adjustedOffsetY = -adjustedOffsetY;\n        }\n\n        // Invert offsetX when horizontal direction flips\n        // (from end to start or vice versa)\n        if (primaryPosition.originX !== p.originX) {\n          adjustedOffsetX = -adjustedOffsetX;\n        }\n\n        return {\n          ...p,\n          offsetX: (p.offsetX ?? 0) + adjustedOffsetX,\n          offsetY: (p.offsetY ?? 0) + adjustedOffsetY,\n        };\n      });\n    }\n\n    // Find the best position that fits in viewport\n    const { coords } = anchorOptions.autoFlip\n      ? findBestPosition(anchorRect, containerRect, positions, viewportWidth, viewportHeight)\n      : {\n          coords: {\n            top:\n              positions[0].originY === 'bottom'\n                ? anchorRect.bottom + (positions[0].offsetY ?? 0)\n                : anchorRect.top - containerRect.height + (positions[0].offsetY ?? 0),\n            left: anchorRect.left + (positions[0].offsetX ?? 0),\n          },\n        };\n\n    // Apply position\n    container.style.top = `${coords.top}px`;\n    container.style.left = `${coords.left}px`;\n  }\n\n  private addHostClass(refElement: HTMLElement | ElementRef, targetElement: HTMLElement) {\n    if (!refElement || !targetElement) return;\n    const el = refElement instanceof ElementRef ? refElement.nativeElement : refElement;\n    const computedStyle = getComputedStyle(el);\n    const classSize = computedStyle.getPropertyValue('--ax-sys-size');\n    const themeColor = +computedStyle.getPropertyValue('--ax-sys-theme-isDark');\n    if (themeColor === 1) targetElement.classList.add('ax-dark');\n    if (classSize) targetElement.classList.add(classSize);\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/acorex-cdk-pan-view.mjs

@@ -9,50 +9,35 @@ class AXPanViewDirective {
         this.render = inject(Renderer2);
         this.document = inject(DOCUMENT);
         this.el = inject((ElementRef));
-        this.startX = signal(0, ...(ngDevMode ? [{ debugName: "startX" }] : []));
-        this.startY = signal(0, ...(ngDevMode ? [{ debugName: "startY" }] : []));
-        this.pointerDown = signal(false, ...(ngDevMode ? [{ debugName: "pointerDown" }] : []));
-        this.wrapper = signal(null, ...(ngDevMode ? [{ debugName: "wrapper" }] : []));
-        this.zoomStep = input(7, ...(ngDevMode ? [{ debugName: "zoomStep" }] : []));
-        this.minZoom = input(25, ...(ngDevMode ? [{ debugName: "minZoom" }] : []));
-        this.maxZoom = input(400, ...(ngDevMode ? [{ debugName: "maxZoom" }] : []));
-        this.freeMode = input(false, ...(ngDevMode ? [{ debugName: "freeMode" }] : []));
-        this.fitContent = input(true, ...(ngDevMode ? [{ debugName: "fitContent" }] : []));
-        this.disablePan = input(false, ...(ngDevMode ? [{ debugName: "disablePan" }] : []));
-        this.disableZoom = input(false, ...(ngDevMode ? [{ debugName: "disableZoom" }] : []));
-        this.wrapperClasses = input('', ...(ngDevMode ? [{ debugName: "wrapperClasses" }] : []));
-        this.panX = model(0, ...(ngDevMode ? [{ debugName: "panX" }] : []));
-        this.panY = model(0, ...(ngDevMode ? [{ debugName: "panY" }] : []));
-        this.zoom = model(100, ...(ngDevMode ? [{ debugName: "zoom" }] : []));
+        this.startX = signal(0, ...(ngDevMode ? [{ debugName: "startX" }] : /* istanbul ignore next */ []));
+        this.startY = signal(0, ...(ngDevMode ? [{ debugName: "startY" }] : /* istanbul ignore next */ []));
+        this.pointerDown = signal(false, ...(ngDevMode ? [{ debugName: "pointerDown" }] : /* istanbul ignore next */ []));
+        this.wrapper = signal(null, ...(ngDevMode ? [{ debugName: "wrapper" }] : /* istanbul ignore next */ []));
+        this.wheelListener = (e) => this.handleWheel(e);
+        this.zoomStep = input(7, ...(ngDevMode ? [{ debugName: "zoomStep" }] : /* istanbul ignore next */ []));
+        this.minZoom = input(25, ...(ngDevMode ? [{ debugName: "minZoom" }] : /* istanbul ignore next */ []));
+        this.maxZoom = input(400, ...(ngDevMode ? [{ debugName: "maxZoom" }] : /* istanbul ignore next */ []));
+        this.freeMode = input(false, ...(ngDevMode ? [{ debugName: "freeMode" }] : /* istanbul ignore next */ []));
+        this.fitContent = input(true, ...(ngDevMode ? [{ debugName: "fitContent" }] : /* istanbul ignore next */ []));
+        this.disablePan = input(false, ...(ngDevMode ? [{ debugName: "disablePan" }] : /* istanbul ignore next */ []));
+        this.disableZoom = input(false, ...(ngDevMode ? [{ debugName: "disableZoom" }] : /* istanbul ignore next */ []));
+        this.wrapperClasses = input('', ...(ngDevMode ? [{ debugName: "wrapperClasses" }] : /* istanbul ignore next */ []));
+        this.panX = model(0, ...(ngDevMode ? [{ debugName: "panX" }] : /* istanbul ignore next */ []));
+        this.panY = model(0, ...(ngDevMode ? [{ debugName: "panY" }] : /* istanbul ignore next */ []));
+        this.zoom = model(100, ...(ngDevMode ? [{ debugName: "zoom" }] : /* istanbul ignore next */ []));
         this.zoomChange = output();
         this.positionChange = output();
-        this.nativeEl = computed(() => this.el.nativeElement, ...(ngDevMode ? [{ debugName: "nativeEl" }] : []));
-        this.initialWidth = linkedSignal(() => this.nativeEl().getBoundingClientRect().width, ...(ngDevMode ? [{ debugName: "initialWidth" }] : []));
-        this.initialHeight = linkedSignal(() => this.nativeEl().getBoundingClientRect().height, ...(ngDevMode ? [{ debugName: "initialHeight" }] : []));
+        this.nativeEl = computed(() => this.el.nativeElement, ...(ngDevMode ? [{ debugName: "nativeEl" }] : /* istanbul ignore next */ []));
+        this.initialWidth = linkedSignal(() => this.nativeEl().getBoundingClientRect().width, ...(ngDevMode ? [{ debugName: "initialWidth" }] : /* istanbul ignore next */ []));
+        this.initialHeight = linkedSignal(() => this.nativeEl().getBoundingClientRect().height, ...(ngDevMode ? [{ debugName: "initialHeight" }] : /* istanbul ignore next */ []));
         this.#anr = afterNextRender(() => {
             // Create Wrapper
             this.createWrapper();
             this.zone.runOutsideAngular(() => {
-                // Wheel Event
-                this.wrapper().onwheel = (e) => {
-                    e.preventDefault();
-                    if (e.ctrlKey || this.freeMode()) {
-                        this.handleZoomChange(e);
-                        return;
-                    }
-                    else if (e.shiftKey) {
-                        if (this.disablePan())
-                            return;
-                        this.panX.update((prev) => prev - e.deltaY / 3);
-                        this.setElementPosition();
-                    }
-                    else {
-                        if (this.disablePan())
-                            return;
-                        this.panY.update((prev) => prev - e.deltaY / 3);
-                        this.setElementPosition();
-                    }
-                };
+                const wrapper = this.wrapper();
+                if (!wrapper)
+                    return;
+                wrapper.addEventListener('wheel', this.wheelListener, { passive: false });
                 // Pointer Down Event
                 this.wrapper().onpointerdown = (e) => this.handlePointerDown(e);
                 // Pointer Move Event
@@ -70,10 +55,13 @@ class AXPanViewDirective {
             });
         });
     }
+    static { this.WHEEL_PAN_FACTOR = 1 / 3; }
     #anr;
     ngOnDestroy() {
-        if (isPlatformBrowser(this.platformId))
-            this.resizeObserver.disconnect();
+        if (!isPlatformBrowser(this.platformId))
+            return;
+        this.wrapper()?.removeEventListener('wheel', this.wheelListener);
+        this.resizeObserver?.disconnect();
     }
     createWrapper() {
         this.wrapper.set(this.render.createElement('div'));
@@ -120,10 +108,38 @@ class AXPanViewDirective {
         this.pointerDown.set(false);
         this.wrapper().style.cursor = 'auto';
     }
+    handleWheel(e) {
+        e.preventDefault();
+        if (this.freeMode()) {
+            this.handleZoomChange(e);
+            return;
+        }
+        if (e.ctrlKey) {
+            this.handleZoomChange(e);
+            return;
+        }
+        if (this.disablePan())
+            return;
+        const delta = this.getWheelDelta(e, e.shiftKey);
+        this.zone.run(() => {
+            if (e.shiftKey) {
+                this.panX.update((prev) => prev - delta * AXPanViewDirective.WHEEL_PAN_FACTOR);
+            }
+            else {
+                this.panY.update((prev) => prev - delta * AXPanViewDirective.WHEEL_PAN_FACTOR);
+            }
+            this.setElementPosition();
+        });
+    }
+    getWheelDelta(e, horizontal) {
+        if (horizontal) {
+            return e.deltaX !== 0 ? e.deltaX : e.deltaY;
+        }
+        return e.deltaY !== 0 ? e.deltaY : e.deltaX;
+    }
     handleZoomChange(e) {
         if (this.disableZoom())
             return;
-        e.preventDefault();
         const rect = this.nativeEl().getBoundingClientRect();
         const mouseX = e.clientX - rect.left;
         const mouseY = e.clientY - rect.top;
@@ -131,11 +147,13 @@ class AXPanViewDirective {
         const zoomDirection = e.deltaY > 0 ? -1 : 1; // Scroll up -> zoom in, scroll down -> zoom out
         const newZoom = Math.round(Math.max(this.minZoom(), Math.min(this.maxZoom(), this.zoom() + zoomDirection * this.zoomStep())));
         const scaleChange = newZoom / this.zoom();
-        // Adjust pan to keep zoom centered at the mouse position
-        this.panX.update((prev) => prev - (mouseX - rect.width / 2) * (scaleChange - 1));
-        this.panY.update((prev) => prev - (mouseY - rect.height / 2) * (scaleChange - 1));
-        this.zoom.set(newZoom);
-        this.setElementPosition();
+        this.zone.run(() => {
+            // Adjust pan to keep zoom centered at the mouse position
+            this.panX.update((prev) => prev - (mouseX - rect.width / 2) * (scaleChange - 1));
+            this.panY.update((prev) => prev - (mouseY - rect.height / 2) * (scaleChange - 1));
+            this.zoom.set(newZoom);
+            this.setElementPosition();
+        });
     }
     sizeChanged() {
         const prevWidth = this.initialWidth();
@@ -182,10 +200,10 @@ class AXPanViewDirective {
         this.zoom.set(Math.round(Math.max(this.minZoom(), Math.min(this.maxZoom(), this.zoom() - this.zoomStep()))));
         this.setElementPosition();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXPanViewDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.3", type: AXPanViewDirective, isStandalone: true, selector: "[axPanView]", inputs: { zoomStep: { classPropertyName: "zoomStep", publicName: "zoomStep", isSignal: true, isRequired: false, transformFunction: null }, minZoom: { classPropertyName: "minZoom", publicName: "minZoom", isSignal: true, isRequired: false, transformFunction: null }, maxZoom: { classPropertyName: "maxZoom", publicName: "maxZoom", isSignal: true, isRequired: false, transformFunction: null }, freeMode: { classPropertyName: "freeMode", publicName: "freeMode", isSignal: true, isRequired: false, transformFunction: null }, fitContent: { classPropertyName: "fitContent", publicName: "fitContent", isSignal: true, isRequired: false, transformFunction: null }, disablePan: { classPropertyName: "disablePan", publicName: "disablePan", isSignal: true, isRequired: false, transformFunction: null }, disableZoom: { classPropertyName: "disableZoom", publicName: "disableZoom", isSignal: true, isRequired: false, transformFunction: null }, wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, panX: { classPropertyName: "panX", publicName: "panX", isSignal: true, isRequired: false, transformFunction: null }, panY: { classPropertyName: "panY", publicName: "panY", isSignal: true, isRequired: false, transformFunction: null }, zoom: { classPropertyName: "zoom", publicName: "zoom", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { panX: "panXChange", panY: "panYChange", zoom: "zoomChange", zoomChange: "zoomChange", positionChange: "positionChange" }, exportAs: ["axPanView"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPanViewDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: AXPanViewDirective, isStandalone: true, selector: "[axPanView]", inputs: { zoomStep: { classPropertyName: "zoomStep", publicName: "zoomStep", isSignal: true, isRequired: false, transformFunction: null }, minZoom: { classPropertyName: "minZoom", publicName: "minZoom", isSignal: true, isRequired: false, transformFunction: null }, maxZoom: { classPropertyName: "maxZoom", publicName: "maxZoom", isSignal: true, isRequired: false, transformFunction: null }, freeMode: { classPropertyName: "freeMode", publicName: "freeMode", isSignal: true, isRequired: false, transformFunction: null }, fitContent: { classPropertyName: "fitContent", publicName: "fitContent", isSignal: true, isRequired: false, transformFunction: null }, disablePan: { classPropertyName: "disablePan", publicName: "disablePan", isSignal: true, isRequired: false, transformFunction: null }, disableZoom: { classPropertyName: "disableZoom", publicName: "disableZoom", isSignal: true, isRequired: false, transformFunction: null }, wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, panX: { classPropertyName: "panX", publicName: "panX", isSignal: true, isRequired: false, transformFunction: null }, panY: { classPropertyName: "panY", publicName: "panY", isSignal: true, isRequired: false, transformFunction: null }, zoom: { classPropertyName: "zoom", publicName: "zoom", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { panX: "panXChange", panY: "panYChange", zoom: "zoomChange", zoomChange: "zoomChange", positionChange: "positionChange" }, exportAs: ["axPanView"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXPanViewDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPanViewDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[axPanView]',

package/fesm2022/acorex-cdk-pan-view.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-cdk-pan-view.mjs","sources":["../../../../packages/cdk/pan-view/src/lib/pan-view.directive.ts","../../../../packages/cdk/pan-view/src/acorex-cdk-pan-view.ts"],"sourcesContent":["import { isPlatformBrowser } from '@angular/common';\nimport {\n  afterNextRender,\n  computed,\n  Directive,\n  DOCUMENT,\n  ElementRef,\n  inject,\n  input,\n  linkedSignal,\n  model,\n  NgZone,\n  OnDestroy,\n  output,\n  PLATFORM_ID,\n  Renderer2,\n  signal,\n} from '@angular/core';\n\n@Directive({\n  selector: '[axPanView]',\n  exportAs: 'axPanView',\n})\nexport class AXPanViewDirective implements OnDestroy {\n  private resizeObserver: ResizeObserver;\n\n  private platformId = inject(PLATFORM_ID);\n  private zone = inject(NgZone);\n  private render = inject(Renderer2);\n  private document = inject(DOCUMENT);\n  private el = inject(ElementRef<HTMLElement>);\n\n  private startX = signal(0);\n  private startY = signal(0);\n  private pointerDown = signal(false);\n  private wrapper = signal<HTMLDivElement | null>(null);\n\n  zoomStep = input(7);\n  minZoom = input(25);\n  maxZoom = input(400);\n  freeMode = input(false);\n  fitContent = input(true);\n  disablePan = input(false);\n  disableZoom = input(false);\n  wrapperClasses = input('');\n\n  panX = model(0);\n  panY = model(0);\n  zoom = model(100);\n\n  zoomChange = output<number>();\n  positionChange = output<{ x: number; y: number }>();\n\n  private nativeEl = computed(() => this.el.nativeElement as HTMLElement);\n\n  private initialWidth = linkedSignal(() => this.nativeEl().getBoundingClientRect().width);\n  private initialHeight = linkedSignal(() => this.nativeEl().getBoundingClientRect().height);\n\n  #anr = afterNextRender(() => {\n    // Create Wrapper\n    this.createWrapper();\n    this.zone.runOutsideAngular(() => {\n      // Wheel Event\n      this.wrapper().onwheel = (e) => {\n        e.preventDefault();\n        if (e.ctrlKey || this.freeMode()) {\n          this.handleZoomChange(e);\n          return;\n        } else if (e.shiftKey) {\n          if (this.disablePan()) return;\n          this.panX.update((prev) => prev - e.deltaY / 3);\n          this.setElementPosition();\n        } else {\n          if (this.disablePan()) return;\n          this.panY.update((prev) => prev - e.deltaY / 3);\n          this.setElementPosition();\n        }\n      };\n      // Pointer Down Event\n      this.wrapper().onpointerdown = (e) => this.handlePointerDown(e);\n      // Pointer Move Event\n      this.document.onpointermove = (e) => this.handlePointerMove(e);\n      // Pointer Up/Leave Event\n      this.document.onpointerup = (e) => this.handlePointerUp(e);\n\n      if (isPlatformBrowser(this.platformId)) {\n        this.resizeObserver = new ResizeObserver(() => this.sizeChanged());\n        this.resizeObserver.observe(this.wrapper());\n        this.resizeObserver.observe(this.nativeEl());\n      }\n    });\n    setTimeout(() => {\n      this.resetPosition();\n    });\n  });\n\n  ngOnDestroy(): void {\n    if (isPlatformBrowser(this.platformId)) this.resizeObserver.disconnect();\n  }\n\n  private createWrapper() {\n    this.wrapper.set(this.render.createElement('div'));\n    this.render.addClass(this.wrapper(), 'ax-pan-view-wrapper');\n    if (this.wrapperClasses()) this.render.addClass(this.wrapper(), this.wrapperClasses());\n\n    const parent = this.nativeEl().parentNode;\n    this.render.appendChild(this.wrapper(), this.nativeEl());\n    this.render.insertBefore(parent, this.wrapper(), this.nativeEl().nextSibling);\n\n    this.render.setStyle(this.wrapper(), 'width', '100%');\n    this.render.setStyle(this.wrapper(), 'height', '100%');\n    this.render.setStyle(this.wrapper(), 'overflow', 'hidden');\n    this.render.setStyle(this.wrapper(), 'position', 'relative');\n\n    this.render.setStyle(this.nativeEl(), 'top', '0');\n    this.render.setStyle(this.nativeEl(), 'left', '0');\n    this.render.setStyle(this.nativeEl(), 'position', 'absolute');\n  }\n\n  private handlePointerDown(e: PointerEvent) {\n    if (this.disablePan()) return;\n    if (!this.freeMode() && e.pointerType === 'mouse' && e.buttons !== 4) return;\n    if (this.freeMode() && e.pointerType === 'mouse' && e.buttons !== 1) return;\n    e.preventDefault();\n    this.pointerDown.set(true);\n    this.wrapper().style.cursor = 'grabbing';\n\n    // Update previous position for next move\n    this.startX.set(e.clientX - this.panX());\n    this.startY.set(e.clientY - this.panY());\n  }\n\n  private handlePointerMove(e: PointerEvent) {\n    if (!this.pointerDown() || this.disablePan()) return;\n    e.preventDefault();\n    this.panX.set(e.clientX - this.startX());\n    this.panY.set(e.clientY - this.startY());\n\n    this.setElementPosition();\n  }\n\n  private handlePointerUp(e: PointerEvent) {\n    if (!this.pointerDown() || this.disablePan()) return;\n    e.preventDefault();\n    this.pointerDown.set(false);\n    this.wrapper().style.cursor = 'auto';\n  }\n\n  private handleZoomChange(e: WheelEvent) {\n    if (this.disableZoom()) return;\n\n    e.preventDefault();\n\n    const rect = this.nativeEl().getBoundingClientRect();\n    const mouseX = e.clientX - rect.left;\n    const mouseY = e.clientY - rect.top;\n\n    // Calculate the new zoom based on step\n    const zoomDirection = e.deltaY > 0 ? -1 : 1; // Scroll up -> zoom in, scroll down -> zoom out\n    const newZoom = Math.round(\n      Math.max(this.minZoom(), Math.min(this.maxZoom(), this.zoom() + zoomDirection * this.zoomStep())),\n    );\n\n    const scaleChange = newZoom / this.zoom();\n\n    // Adjust pan to keep zoom centered at the mouse position\n    this.panX.update((prev) => prev - (mouseX - rect.width / 2) * (scaleChange - 1));\n    this.panY.update((prev) => prev - (mouseY - rect.height / 2) * (scaleChange - 1));\n    this.zoom.set(newZoom);\n\n    this.setElementPosition();\n  }\n\n  private sizeChanged() {\n    const prevWidth = this.initialWidth();\n    const prevHeight = this.initialHeight();\n\n    this.initialWidth.set((this.nativeEl().getBoundingClientRect().width * 100) / this.zoom());\n    this.initialHeight.set((this.nativeEl().getBoundingClientRect().height * 100) / this.zoom());\n\n    const newWidth = this.initialWidth();\n    const newHeight = this.initialHeight();\n\n    // Maintain the same relative position\n    this.panX.update((prev) => prev - (newWidth - prevWidth) / 2);\n    this.panY.update((prev) => prev - (newHeight - prevHeight) / 2);\n\n    this.setElementPosition();\n  }\n\n  private setFitContentScale() {\n    if (!this.fitContent()) return;\n    const height = this.wrapper().clientHeight / this.nativeEl().clientHeight;\n    const width = this.wrapper().clientWidth / this.nativeEl().clientWidth;\n    this.zoom.set(Math.round(Math.min(height, width) * 100));\n  }\n\n  setElementPosition() {\n    this.nativeEl().style.transform = `translate(${this.panX()}px, ${this.panY()}px) scale(${this.zoom() / 100})`;\n\n    this.positionChange.emit({ x: this.panX(), y: this.panY() });\n    this.zoomChange.emit(this.zoom());\n  }\n\n  resetPosition() {\n    const containerWidth = this.wrapper().offsetWidth;\n    const containerHeight = this.wrapper().offsetHeight;\n\n    const boxLeft = (containerWidth - this.initialWidth()) / 2;\n    const boxTop = (containerHeight - this.initialHeight()) / 2;\n\n    this.panX.set(boxLeft);\n    this.panY.set(boxTop);\n\n    if (this.fitContent()) this.setFitContentScale();\n    else this.zoom.set(100);\n\n    this.setElementPosition();\n  }\n\n  zoomIn() {\n    this.zoom.set(Math.round(Math.max(this.minZoom(), Math.min(this.maxZoom(), this.zoom() + this.zoomStep()))));\n    this.setElementPosition();\n  }\n\n  zoomOut() {\n    this.zoom.set(Math.round(Math.max(this.minZoom(), Math.min(this.maxZoom(), this.zoom() - this.zoomStep()))));\n    this.setElementPosition();\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-cdk-pan-view.mjs","sources":["../../../../packages/cdk/pan-view/src/lib/pan-view.directive.ts","../../../../packages/cdk/pan-view/src/acorex-cdk-pan-view.ts"],"sourcesContent":["import { isPlatformBrowser } from '@angular/common';\nimport {\n  afterNextRender,\n  computed,\n  Directive,\n  DOCUMENT,\n  ElementRef,\n  inject,\n  input,\n  linkedSignal,\n  model,\n  NgZone,\n  OnDestroy,\n  output,\n  PLATFORM_ID,\n  Renderer2,\n  signal,\n} from '@angular/core';\n\n@Directive({\n  selector: '[axPanView]',\n  exportAs: 'axPanView',\n})\nexport class AXPanViewDirective implements OnDestroy {\n  private resizeObserver: ResizeObserver;\n\n  private platformId = inject(PLATFORM_ID);\n  private zone = inject(NgZone);\n  private render = inject(Renderer2);\n  private document = inject(DOCUMENT);\n  private el = inject(ElementRef<HTMLElement>);\n\n  private startX = signal(0);\n  private startY = signal(0);\n  private pointerDown = signal(false);\n  private wrapper = signal<HTMLDivElement | null>(null);\n  private readonly wheelListener = (e: WheelEvent) => this.handleWheel(e);\n\n  private static readonly WHEEL_PAN_FACTOR = 1 / 3;\n\n  zoomStep = input(7);\n  minZoom = input(25);\n  maxZoom = input(400);\n  freeMode = input(false);\n  fitContent = input(true);\n  disablePan = input(false);\n  disableZoom = input(false);\n  wrapperClasses = input('');\n\n  panX = model(0);\n  panY = model(0);\n  zoom = model(100);\n\n  zoomChange = output<number>();\n  positionChange = output<{ x: number; y: number }>();\n\n  private nativeEl = computed(() => this.el.nativeElement as HTMLElement);\n\n  private initialWidth = linkedSignal(() => this.nativeEl().getBoundingClientRect().width);\n  private initialHeight = linkedSignal(() => this.nativeEl().getBoundingClientRect().height);\n\n  #anr = afterNextRender(() => {\n    // Create Wrapper\n    this.createWrapper();\n    this.zone.runOutsideAngular(() => {\n      const wrapper = this.wrapper();\n      if (!wrapper) return;\n      wrapper.addEventListener('wheel', this.wheelListener, { passive: false });\n      // Pointer Down Event\n      this.wrapper().onpointerdown = (e) => this.handlePointerDown(e);\n      // Pointer Move Event\n      this.document.onpointermove = (e) => this.handlePointerMove(e);\n      // Pointer Up/Leave Event\n      this.document.onpointerup = (e) => this.handlePointerUp(e);\n\n      if (isPlatformBrowser(this.platformId)) {\n        this.resizeObserver = new ResizeObserver(() => this.sizeChanged());\n        this.resizeObserver.observe(this.wrapper());\n        this.resizeObserver.observe(this.nativeEl());\n      }\n    });\n    setTimeout(() => {\n      this.resetPosition();\n    });\n  });\n\n  ngOnDestroy(): void {\n    if (!isPlatformBrowser(this.platformId)) return;\n    this.wrapper()?.removeEventListener('wheel', this.wheelListener);\n    this.resizeObserver?.disconnect();\n  }\n\n  private createWrapper() {\n    this.wrapper.set(this.render.createElement('div'));\n    this.render.addClass(this.wrapper(), 'ax-pan-view-wrapper');\n    if (this.wrapperClasses()) this.render.addClass(this.wrapper(), this.wrapperClasses());\n\n    const parent = this.nativeEl().parentNode;\n    this.render.appendChild(this.wrapper(), this.nativeEl());\n    this.render.insertBefore(parent, this.wrapper(), this.nativeEl().nextSibling);\n\n    this.render.setStyle(this.wrapper(), 'width', '100%');\n    this.render.setStyle(this.wrapper(), 'height', '100%');\n    this.render.setStyle(this.wrapper(), 'overflow', 'hidden');\n    this.render.setStyle(this.wrapper(), 'position', 'relative');\n\n    this.render.setStyle(this.nativeEl(), 'top', '0');\n    this.render.setStyle(this.nativeEl(), 'left', '0');\n    this.render.setStyle(this.nativeEl(), 'position', 'absolute');\n  }\n\n  private handlePointerDown(e: PointerEvent) {\n    if (this.disablePan()) return;\n    if (!this.freeMode() && e.pointerType === 'mouse' && e.buttons !== 4) return;\n    if (this.freeMode() && e.pointerType === 'mouse' && e.buttons !== 1) return;\n    e.preventDefault();\n    this.pointerDown.set(true);\n    this.wrapper().style.cursor = 'grabbing';\n\n    // Update previous position for next move\n    this.startX.set(e.clientX - this.panX());\n    this.startY.set(e.clientY - this.panY());\n  }\n\n  private handlePointerMove(e: PointerEvent) {\n    if (!this.pointerDown() || this.disablePan()) return;\n    e.preventDefault();\n    this.panX.set(e.clientX - this.startX());\n    this.panY.set(e.clientY - this.startY());\n\n    this.setElementPosition();\n  }\n\n  private handlePointerUp(e: PointerEvent) {\n    if (!this.pointerDown() || this.disablePan()) return;\n    e.preventDefault();\n    this.pointerDown.set(false);\n    this.wrapper().style.cursor = 'auto';\n  }\n\n  private handleWheel(e: WheelEvent) {\n    e.preventDefault();\n\n    if (this.freeMode()) {\n      this.handleZoomChange(e);\n      return;\n    }\n\n    if (e.ctrlKey) {\n      this.handleZoomChange(e);\n      return;\n    }\n\n    if (this.disablePan()) return;\n\n    const delta = this.getWheelDelta(e, e.shiftKey);\n    this.zone.run(() => {\n      if (e.shiftKey) {\n        this.panX.update((prev) => prev - delta * AXPanViewDirective.WHEEL_PAN_FACTOR);\n      } else {\n        this.panY.update((prev) => prev - delta * AXPanViewDirective.WHEEL_PAN_FACTOR);\n      }\n      this.setElementPosition();\n    });\n  }\n\n  private getWheelDelta(e: WheelEvent, horizontal: boolean): number {\n    if (horizontal) {\n      return e.deltaX !== 0 ? e.deltaX : e.deltaY;\n    }\n    return e.deltaY !== 0 ? e.deltaY : e.deltaX;\n  }\n\n  private handleZoomChange(e: WheelEvent) {\n    if (this.disableZoom()) return;\n\n    const rect = this.nativeEl().getBoundingClientRect();\n    const mouseX = e.clientX - rect.left;\n    const mouseY = e.clientY - rect.top;\n\n    // Calculate the new zoom based on step\n    const zoomDirection = e.deltaY > 0 ? -1 : 1; // Scroll up -> zoom in, scroll down -> zoom out\n    const newZoom = Math.round(\n      Math.max(this.minZoom(), Math.min(this.maxZoom(), this.zoom() + zoomDirection * this.zoomStep())),\n    );\n\n    const scaleChange = newZoom / this.zoom();\n\n    this.zone.run(() => {\n      // Adjust pan to keep zoom centered at the mouse position\n      this.panX.update((prev) => prev - (mouseX - rect.width / 2) * (scaleChange - 1));\n      this.panY.update((prev) => prev - (mouseY - rect.height / 2) * (scaleChange - 1));\n      this.zoom.set(newZoom);\n      this.setElementPosition();\n    });\n  }\n\n  private sizeChanged() {\n    const prevWidth = this.initialWidth();\n    const prevHeight = this.initialHeight();\n\n    this.initialWidth.set((this.nativeEl().getBoundingClientRect().width * 100) / this.zoom());\n    this.initialHeight.set((this.nativeEl().getBoundingClientRect().height * 100) / this.zoom());\n\n    const newWidth = this.initialWidth();\n    const newHeight = this.initialHeight();\n\n    // Maintain the same relative position\n    this.panX.update((prev) => prev - (newWidth - prevWidth) / 2);\n    this.panY.update((prev) => prev - (newHeight - prevHeight) / 2);\n\n    this.setElementPosition();\n  }\n\n  private setFitContentScale() {\n    if (!this.fitContent()) return;\n    const height = this.wrapper().clientHeight / this.nativeEl().clientHeight;\n    const width = this.wrapper().clientWidth / this.nativeEl().clientWidth;\n    this.zoom.set(Math.round(Math.min(height, width) * 100));\n  }\n\n  setElementPosition() {\n    this.nativeEl().style.transform = `translate(${this.panX()}px, ${this.panY()}px) scale(${this.zoom() / 100})`;\n\n    this.positionChange.emit({ x: this.panX(), y: this.panY() });\n    this.zoomChange.emit(this.zoom());\n  }\n\n  resetPosition() {\n    const containerWidth = this.wrapper().offsetWidth;\n    const containerHeight = this.wrapper().offsetHeight;\n\n    const boxLeft = (containerWidth - this.initialWidth()) / 2;\n    const boxTop = (containerHeight - this.initialHeight()) / 2;\n\n    this.panX.set(boxLeft);\n    this.panY.set(boxTop);\n\n    if (this.fitContent()) this.setFitContentScale();\n    else this.zoom.set(100);\n\n    this.setElementPosition();\n  }\n\n  zoomIn() {\n    this.zoom.set(Math.round(Math.max(this.minZoom(), Math.min(this.maxZoom(), this.zoom() + this.zoomStep()))));\n    this.setElementPosition();\n  }\n\n  zoomOut() {\n    this.zoom.set(Math.round(Math.max(this.minZoom(), Math.min(this.maxZoom(), this.zoom() - this.zoomStep()))));\n    this.setElementPosition();\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/acorex-cdk-resizable.mjs

@@ -2,7 +2,7 @@ import { AXPlatform } from '@acorex/core/platform';
 import { AXHtmlUtil } from '@acorex/core/utils';
 import { isPlatformBrowser } from '@angular/common';
 import * as i0 from '@angular/core';
-import { inject, ElementRef, NgZone, DOCUMENT, PLATFORM_ID, signal, model, output, Directive } from '@angular/core';
+import { inject, ElementRef, NgZone, DOCUMENT, PLATFORM_ID, signal, model, output, effect, Directive } from '@angular/core';
 import { Subscription } from 'rxjs';
 
 class AXResizableDirective {
@@ -12,7 +12,7 @@ class AXResizableDirective {
         this.zone = inject(NgZone);
         this.document = inject(DOCUMENT);
         this.platformID = inject(PLATFORM_ID);
-        this.isResizing = signal(false, ...(ngDevMode ? [{ debugName: "isResizing" }] : []));
+        this.isResizing = signal(false, ...(ngDevMode ? [{ debugName: "isResizing" }] : /* istanbul ignore next */ []));
         this.initialElementWidth = 0;
         this.startMoveWidth = 0;
         this.subscriptions = new Subscription();
@@ -35,24 +35,24 @@ class AXResizableDirective {
             }
         });
         /** Define if directive is active or not */
-        this.axResizable = model(true, ...(ngDevMode ? [{ debugName: "axResizable" }] : []));
+        this.axResizable = model(true, ...(ngDevMode ? [{ debugName: "axResizable" }] : /* istanbul ignore next */ []));
         /** Minimum width for the resizable element. */
-        this.minWidth = model(100, ...(ngDevMode ? [{ debugName: "minWidth" }] : []));
+        this.minWidth = model(100, ...(ngDevMode ? [{ debugName: "minWidth" }] : /* istanbul ignore next */ []));
         /** Maximum width for the resizable element. Defaults to parent width if not provided. */
-        this.maxWidth = model(Infinity, ...(ngDevMode ? [{ debugName: "maxWidth" }] : []));
+        this.maxWidth = model(Infinity, ...(ngDevMode ? [{ debugName: "maxWidth" }] : /* istanbul ignore next */ []));
         /** Behavior on double-click: 'reset' or 'maximize'. */
-        this.dblClickAction = model('reset', ...(ngDevMode ? [{ debugName: "dblClickAction" }] : []));
+        this.dblClickAction = model('reset', ...(ngDevMode ? [{ debugName: "dblClickAction" }] : /* istanbul ignore next */ []));
         /** Define initial width for the element. */
-        this.width = model(null, ...(ngDevMode ? [{ debugName: "width" }] : []));
+        this.width = model(null, ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
         /** Define reset width for the element. */
-        this.defaultWidth = model(null, ...(ngDevMode ? [{ debugName: "defaultWidth" }] : []));
+        this.defaultWidth = model(null, ...(ngDevMode ? [{ debugName: "defaultWidth" }] : /* istanbul ignore next */ []));
         /** Event emitted when resizing starts. */
         this.onResizingStarted = output();
         /** Event emitted when resizing ends. */
         this.onResizingEnded = output();
         /** Event emitted on double-click. */
         this.onResizingDblClick = output();
-        this.isRTL = signal(AXHtmlUtil.isRtl(this.document.documentElement), ...(ngDevMode ? [{ debugName: "isRTL" }] : []));
+        this.isRTL = signal(AXHtmlUtil.isRtl(this.document.documentElement), ...(ngDevMode ? [{ debugName: "isRTL" }] : /* istanbul ignore next */ []));
         this.isBrowser = isPlatformBrowser(this.platformID);
         this.hostElement = this.el.nativeElement;
         this.subscriptions.add(this.platformService.directionChange.subscribe((i) => {
@@ -61,15 +61,23 @@ class AXResizableDirective {
                 this.updateHandlePosition();
             }
         }));
+        if (this.isBrowser) {
+            effect(() => {
+                if (this.isResizing()) {
+                    return;
+                }
+                const resolvedWidth = this.width() ?? this.defaultWidth();
+                if (resolvedWidth !== null) {
+                    this.applyElementWidth(resolvedWidth);
+                }
+            });
+        }
     }
     ngAfterViewInit() {
         if (!this.isBrowser)
             return;
         this.initialElementWidth = this.hostElement.offsetWidth;
-        const initialWidth = this.width();
-        if (initialWidth !== null) {
-            this.hostElement.style.width = `${initialWidth}px`;
-        }
+        this.applyWidthFromModel();
         if (this.maxWidth() === Infinity) {
             const parentWidth = this.hostElement.parentElement?.offsetWidth;
             if (parentWidth) {
@@ -91,14 +99,29 @@ class AXResizableDirective {
     setupResizableState() {
         this.subscriptions.add(this.axResizable.subscribe((isActive) => {
             if (!isActive) {
-                this.resetToInitialWidth();
+                this.applyWidthFromModel();
                 this.cleanupEventListeners();
             }
             else {
+                this.applyWidthFromModel();
                 this.createResizeHandle();
             }
         }));
     }
+    applyWidthFromModel() {
+        const width = this.width();
+        if (width !== null) {
+            this.applyElementWidth(width);
+            return;
+        }
+        const defaultWidth = this.defaultWidth();
+        if (defaultWidth !== null) {
+            this.applyElementWidth(defaultWidth);
+        }
+    }
+    applyElementWidth(width) {
+        this.hostElement.style.width = `${width}px`;
+    }
     createResizeHandle() {
         if (!this.axResizable() || this.resizeHandle)
             return;
@@ -201,11 +224,11 @@ class AXResizableDirective {
     onMouseUp() {
         if (!this.isResizing() || !this.resizeHandle)
             return;
-        this.isResizing.set(false);
         this.document.body.style.cursor = '';
         this.resizeHandle.style.backgroundColor = STYLES.backgroundColor;
         const currentWidth = this.hostElement.offsetWidth;
         this.zone.run(() => {
+            this.width.set(currentWidth);
             this.onResizingEnded.emit({
                 component: this,
                 htmlElement: this.hostElement,
@@ -215,6 +238,7 @@ class AXResizableDirective {
                 oldValue: this.startMoveWidth,
             });
         });
+        this.isResizing.set(false);
     }
     onMouseEnter() {
         if (!this.isResizing() && this.resizeHandle) {
@@ -257,21 +281,21 @@ class AXResizableDirective {
     resetToInitialWidth() {
         const defaultWidth = this.defaultWidth();
         if (defaultWidth !== null) {
-            this.hostElement.style.width = `${defaultWidth}px`;
+            this.applyElementWidth(defaultWidth);
             return defaultWidth;
         }
         const initialWidth = this.width();
         if (initialWidth !== null) {
-            this.hostElement.style.width = `${initialWidth}px`;
+            this.applyElementWidth(initialWidth);
             return initialWidth;
         }
-        this.hostElement.style.width = `${this.initialElementWidth}px`;
+        this.applyElementWidth(this.initialElementWidth);
         return this.initialElementWidth;
     }
     maximizeToMaxWidth() {
         const maxWidth = this.maxWidth();
         if (maxWidth !== Infinity) {
-            this.hostElement.style.width = `${maxWidth}px`;
+            this.applyElementWidth(maxWidth);
         }
         return maxWidth;
     }
@@ -279,10 +303,10 @@ class AXResizableDirective {
         this.hostElement.style.width = 'fit-content';
         return this.hostElement.clientWidth;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXResizableDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.3", type: AXResizableDirective, isStandalone: true, selector: "[axResizable]", inputs: { axResizable: { classPropertyName: "axResizable", publicName: "axResizable", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, dblClickAction: { classPropertyName: "dblClickAction", publicName: "dblClickAction", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, defaultWidth: { classPropertyName: "defaultWidth", publicName: "defaultWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { axResizable: "axResizableChange", minWidth: "minWidthChange", maxWidth: "maxWidthChange", dblClickAction: "dblClickActionChange", width: "widthChange", defaultWidth: "defaultWidthChange", onResizingStarted: "onResizingStarted", onResizingEnded: "onResizingEnded", onResizingDblClick: "onResizingDblClick" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXResizableDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: AXResizableDirective, isStandalone: true, selector: "[axResizable]", inputs: { axResizable: { classPropertyName: "axResizable", publicName: "axResizable", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, dblClickAction: { classPropertyName: "dblClickAction", publicName: "dblClickAction", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, defaultWidth: { classPropertyName: "defaultWidth", publicName: "defaultWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { axResizable: "axResizableChange", minWidth: "minWidthChange", maxWidth: "maxWidthChange", dblClickAction: "dblClickActionChange", width: "widthChange", defaultWidth: "defaultWidthChange", onResizingStarted: "onResizingStarted", onResizingEnded: "onResizingEnded", onResizingDblClick: "onResizingDblClick" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXResizableDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXResizableDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[axResizable]',