@aquera/nile-elements 1.3.5-beta-1.0 → 1.3.6-beta-1.0

package/dist/src/nile-floating-panel/anchor-manager.js

@@ -0,0 +1,27 @@
+export class AnchorManager {
+    static resolveAnchor(anchor) {
+        if (anchor instanceof HTMLElement) {
+            return anchor;
+        }
+        if (typeof anchor === 'string') {
+            const element = document.querySelector(anchor);
+            if (element) {
+                return element;
+            }
+            const byId = document.getElementById(anchor);
+            if (byId) {
+                return byId;
+            }
+        }
+        return document.body;
+    }
+    static appendToAnchor(anchor, panelContainer) {
+        anchor.appendChild(panelContainer);
+    }
+    static removeFromAnchor(panelContainer) {
+        if (panelContainer.parentNode) {
+            panelContainer.parentNode.removeChild(panelContainer);
+        }
+    }
+}
+//# sourceMappingURL=anchor-manager.js.map

package/dist/src/nile-floating-panel/anchor-manager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"anchor-manager.js","sourceRoot":"","sources":["../../../src/nile-floating-panel/anchor-manager.ts"],"names":[],"mappings":"AAEA,MAAM,OAAO,aAAa;IACxB,MAAM,CAAC,aAAa,CAAC,MAA2B;QAC9C,IAAI,MAAM,YAAY,WAAW,EAAE,CAAC;YAClC,OAAO,MAAM,CAAC;QAChB,CAAC;QAED,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE,CAAC;YAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAgB,CAAC;YAC9D,IAAI,OAAO,EAAE,CAAC;gBACZ,OAAO,OAAO,CAAC;YACjB,CAAC;YACD,MAAM,IAAI,GAAG,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;YAC7C,IAAI,IAAI,EAAE,CAAC;gBACT,OAAO,IAAI,CAAC;YACd,CAAC;QACH,CAAC;QAED,OAAO,QAAQ,CAAC,IAAI,CAAC;IACvB,CAAC;IAED,MAAM,CAAC,cAAc,CAAC,MAAmB,EAAE,cAA2B;QACpE,MAAM,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;IACrC,CAAC;IAED,MAAM,CAAC,gBAAgB,CAAC,cAA2B;QACjD,IAAI,cAAc,CAAC,UAAU,EAAE,CAAC;YAC9B,cAAc,CAAC,UAAU,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;QACxD,CAAC;IACH,CAAC;CACF","sourcesContent":["import type { FloatingPanelAnchor } from './types';\n\nexport class AnchorManager {\n  static resolveAnchor(anchor: FloatingPanelAnchor): HTMLElement {\n    if (anchor instanceof HTMLElement) {\n      return anchor;\n    }\n\n    if (typeof anchor === 'string') {\n      const element = document.querySelector(anchor) as HTMLElement;\n      if (element) {\n        return element;\n      }\n      const byId = document.getElementById(anchor);\n      if (byId) {\n        return byId;\n      }\n    }\n\n    return document.body;\n  }\n\n  static appendToAnchor(anchor: HTMLElement, panelContainer: HTMLElement): void {\n    anchor.appendChild(panelContainer);\n  }\n\n  static removeFromAnchor(panelContainer: HTMLElement): void {\n    if (panelContainer.parentNode) {\n      panelContainer.parentNode.removeChild(panelContainer);\n    }\n  }\n}\n\n"]}

package/dist/src/nile-floating-panel/content-manager.d.ts

@@ -0,0 +1,5 @@
+export declare class ContentManager {
+    static updatePanelContent(panelContainer: HTMLElement, slot: HTMLSlotElement | null, dataContent: string): void;
+    static hasSlotContent(slot: HTMLSlotElement | null): boolean;
+    static getSlotContent(slot: HTMLSlotElement | null): Node[];
+}

package/dist/src/nile-floating-panel/content-manager.js

@@ -0,0 +1,44 @@
+export class ContentManager {
+    static updatePanelContent(panelContainer, slot, dataContent) {
+        panelContainer.innerHTML = '';
+        const slotContent = slot ? slot.assignedNodes({ flatten: true }) : [];
+        const hasSlotContent = slotContent.length > 0 &&
+            slotContent.some(node => {
+                if (node.nodeType === Node.TEXT_NODE) {
+                    return node.textContent?.trim() !== '';
+                }
+                return node instanceof HTMLElement;
+            });
+        if (hasSlotContent) {
+            slotContent.forEach(node => {
+                if (node.nodeType === Node.TEXT_NODE) {
+                    const textNode = document.createTextNode(node.textContent || '');
+                    panelContainer.appendChild(textNode);
+                }
+                else if (node instanceof HTMLElement) {
+                    panelContainer.appendChild(node.cloneNode(true));
+                }
+            });
+        }
+        else if (dataContent) {
+            panelContainer.textContent = dataContent;
+        }
+    }
+    static hasSlotContent(slot) {
+        if (!slot) {
+            return false;
+        }
+        const slotContent = slot.assignedNodes({ flatten: true });
+        return slotContent.length > 0 &&
+            slotContent.some(node => {
+                if (node.nodeType === Node.TEXT_NODE) {
+                    return node.textContent?.trim() !== '';
+                }
+                return node instanceof HTMLElement;
+            });
+    }
+    static getSlotContent(slot) {
+        return slot ? slot.assignedNodes({ flatten: true }) : [];
+    }
+}
+//# sourceMappingURL=content-manager.js.map

package/dist/src/nile-floating-panel/content-manager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"content-manager.js","sourceRoot":"","sources":["../../../src/nile-floating-panel/content-manager.ts"],"names":[],"mappings":"AAEA,MAAM,OAAO,cAAc;IACzB,MAAM,CAAC,kBAAkB,CACvB,cAA2B,EAC3B,IAA4B,EAC5B,WAAmB;QAEnB,cAAc,CAAC,SAAS,GAAG,EAAE,CAAC;QAE9B,MAAM,WAAW,GAAG,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;QAEtE,MAAM,cAAc,GAAG,WAAW,CAAC,MAAM,GAAG,CAAC;YAC3C,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;gBACtB,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,EAAE,CAAC;oBACrC,OAAO,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;gBACzC,CAAC;gBACD,OAAO,IAAI,YAAY,WAAW,CAAC;YACrC,CAAC,CAAC,CAAC;QAEL,IAAI,cAAc,EAAE,CAAC;YACnB,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBACzB,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,EAAE,CAAC;oBACrC,MAAM,QAAQ,GAAG,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC;oBACjE,cAAc,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;gBACvC,CAAC;qBAAM,IAAI,IAAI,YAAY,WAAW,EAAE,CAAC;oBACvC,cAAc,CAAC,WAAW,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;gBACnD,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;aAAM,IAAI,WAAW,EAAE,CAAC;YACvB,cAAc,CAAC,WAAW,GAAG,WAAW,CAAC;QAC3C,CAAC;IACH,CAAC;IAED,MAAM,CAAC,cAAc,CAAC,IAA4B;QAChD,IAAI,CAAC,IAAI,EAAE,CAAC;YACV,OAAO,KAAK,CAAC;QACf,CAAC;QAED,MAAM,WAAW,GAAG,IAAI,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QAC1D,OAAO,WAAW,CAAC,MAAM,GAAG,CAAC;YAC3B,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;gBACtB,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,EAAE,CAAC;oBACrC,OAAO,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;gBACzC,CAAC;gBACD,OAAO,IAAI,YAAY,WAAW,CAAC;YACrC,CAAC,CAAC,CAAC;IACP,CAAC;IAED,MAAM,CAAC,cAAc,CAAC,IAA4B;QAChD,OAAO,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC3D,CAAC;CACF","sourcesContent":["import type { FloatingPanelContentConfig } from './types';\n\nexport class ContentManager {\n  static updatePanelContent(\n    panelContainer: HTMLElement,\n    slot: HTMLSlotElement | null,\n    dataContent: string\n  ): void {\n    panelContainer.innerHTML = '';\n\n    const slotContent = slot ? slot.assignedNodes({ flatten: true }) : [];\n\n    const hasSlotContent = slotContent.length > 0 &&\n      slotContent.some(node => {\n        if (node.nodeType === Node.TEXT_NODE) {\n          return node.textContent?.trim() !== '';\n        }\n        return node instanceof HTMLElement;\n      });\n\n    if (hasSlotContent) {\n      slotContent.forEach(node => {\n        if (node.nodeType === Node.TEXT_NODE) {\n          const textNode = document.createTextNode(node.textContent || '');\n          panelContainer.appendChild(textNode);\n        } else if (node instanceof HTMLElement) {\n          panelContainer.appendChild(node.cloneNode(true));\n        }\n      });\n    } else if (dataContent) {\n      panelContainer.textContent = dataContent;\n    }\n  }\n\n  static hasSlotContent(slot: HTMLSlotElement | null): boolean {\n    if (!slot) {\n      return false;\n    }\n\n    const slotContent = slot.assignedNodes({ flatten: true });\n    return slotContent.length > 0 &&\n      slotContent.some(node => {\n        if (node.nodeType === Node.TEXT_NODE) {\n          return node.textContent?.trim() !== '';\n        }\n        return node instanceof HTMLElement;\n      });\n  }\n\n  static getSlotContent(slot: HTMLSlotElement | null): Node[] {\n    return slot ? slot.assignedNodes({ flatten: true }) : [];\n  }\n}\n\n"]}

package/dist/src/nile-floating-panel/event-manager.d.ts

@@ -0,0 +1,14 @@
+export declare class EventManager {
+    private component;
+    private panelContainer;
+    private closeOnOutsideClick;
+    private isOpen;
+    private boundHandleDocumentClick;
+    private onCloseCallback;
+    constructor(component: HTMLElement);
+    setupOutsideClickHandler(panelContainer: HTMLElement, closeOnOutsideClick: boolean, isOpen: boolean, onClose: () => void): void;
+    updateOutsideClickHandler(panelContainer: HTMLElement | null, closeOnOutsideClick: boolean, isOpen: boolean): void;
+    cleanupOutsideClickHandler(): void;
+    private handleDocumentClick;
+    destroy(): void;
+}

package/dist/src/nile-floating-panel/event-manager.js

@@ -0,0 +1,52 @@
+export class EventManager {
+    constructor(component) {
+        this.panelContainer = null;
+        this.closeOnOutsideClick = true;
+        this.isOpen = false;
+        this.boundHandleDocumentClick = null;
+        this.onCloseCallback = null;
+        this.component = component;
+    }
+    setupOutsideClickHandler(panelContainer, closeOnOutsideClick, isOpen, onClose) {
+        this.panelContainer = panelContainer;
+        this.closeOnOutsideClick = closeOnOutsideClick;
+        this.isOpen = isOpen;
+        this.onCloseCallback = onClose;
+        if (!this.closeOnOutsideClick || this.boundHandleDocumentClick) {
+            return;
+        }
+        this.boundHandleDocumentClick = this.handleDocumentClick.bind(this);
+        document.addEventListener('mousedown', this.boundHandleDocumentClick, true);
+    }
+    updateOutsideClickHandler(panelContainer, closeOnOutsideClick, isOpen) {
+        this.panelContainer = panelContainer;
+        this.closeOnOutsideClick = closeOnOutsideClick;
+        this.isOpen = isOpen;
+        this.cleanupOutsideClickHandler();
+        if (isOpen && closeOnOutsideClick && panelContainer) {
+            this.boundHandleDocumentClick = this.handleDocumentClick.bind(this);
+            document.addEventListener('mousedown', this.boundHandleDocumentClick, true);
+        }
+    }
+    cleanupOutsideClickHandler() {
+        if (this.boundHandleDocumentClick) {
+            document.removeEventListener('mousedown', this.boundHandleDocumentClick, true);
+            this.boundHandleDocumentClick = null;
+        }
+    }
+    handleDocumentClick(event) {
+        if (!this.isOpen || !this.closeOnOutsideClick || !this.panelContainer || !this.onCloseCallback) {
+            return;
+        }
+        const target = event.target;
+        if (!this.panelContainer.contains(target) && !this.component.contains(target)) {
+            this.onCloseCallback();
+        }
+    }
+    destroy() {
+        this.cleanupOutsideClickHandler();
+        this.panelContainer = null;
+        this.onCloseCallback = null;
+    }
+}
+//# sourceMappingURL=event-manager.js.map

package/dist/src/nile-floating-panel/event-manager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"event-manager.js","sourceRoot":"","sources":["../../../src/nile-floating-panel/event-manager.ts"],"names":[],"mappings":"AAAA,MAAM,OAAO,YAAY;IAQvB,YAAY,SAAsB;QAN1B,mBAAc,GAAuB,IAAI,CAAC;QAC1C,wBAAmB,GAAY,IAAI,CAAC;QACpC,WAAM,GAAY,KAAK,CAAC;QACxB,6BAAwB,GAAyC,IAAI,CAAC;QACtE,oBAAe,GAAwB,IAAI,CAAC;QAGlD,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;IAC7B,CAAC;IAED,wBAAwB,CACtB,cAA2B,EAC3B,mBAA4B,EAC5B,MAAe,EACf,OAAmB;QAEnB,IAAI,CAAC,cAAc,GAAG,cAAc,CAAC;QACrC,IAAI,CAAC,mBAAmB,GAAG,mBAAmB,CAAC;QAC/C,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;QACrB,IAAI,CAAC,eAAe,GAAG,OAAO,CAAC;QAE/B,IAAI,CAAC,IAAI,CAAC,mBAAmB,IAAI,IAAI,CAAC,wBAAwB,EAAE,CAAC;YAC/D,OAAO;QACT,CAAC;QAED,IAAI,CAAC,wBAAwB,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACpE,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,wBAAwB,EAAE,IAAI,CAAC,CAAC;IAC9E,CAAC;IAED,yBAAyB,CACvB,cAAkC,EAClC,mBAA4B,EAC5B,MAAe;QAEf,IAAI,CAAC,cAAc,GAAG,cAAc,CAAC;QACrC,IAAI,CAAC,mBAAmB,GAAG,mBAAmB,CAAC;QAC/C,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;QAErB,IAAI,CAAC,0BAA0B,EAAE,CAAC;QAElC,IAAI,MAAM,IAAI,mBAAmB,IAAI,cAAc,EAAE,CAAC;YACpD,IAAI,CAAC,wBAAwB,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YACpE,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,wBAAwB,EAAE,IAAI,CAAC,CAAC;QAC9E,CAAC;IACH,CAAC;IAED,0BAA0B;QACxB,IAAI,IAAI,CAAC,wBAAwB,EAAE,CAAC;YAClC,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,wBAAwB,EAAE,IAAI,CAAC,CAAC;YAC/E,IAAI,CAAC,wBAAwB,GAAG,IAAI,CAAC;QACvC,CAAC;IACH,CAAC;IAEO,mBAAmB,CAAC,KAAiB;QAC3C,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,mBAAmB,IAAI,CAAC,IAAI,CAAC,cAAc,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;YAC/F,OAAO;QACT,CAAC;QAED,MAAM,MAAM,GAAG,KAAK,CAAC,MAAc,CAAC;QAEpC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC;YAC9E,IAAI,CAAC,eAAe,EAAE,CAAC;QACzB,CAAC;IACH,CAAC;IAED,OAAO;QACL,IAAI,CAAC,0BAA0B,EAAE,CAAC;QAClC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC3B,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;IAC9B,CAAC;CACF","sourcesContent":["export class EventManager {\n  private component: HTMLElement;\n  private panelContainer: HTMLElement | null = null;\n  private closeOnOutsideClick: boolean = true;\n  private isOpen: boolean = false;\n  private boundHandleDocumentClick: ((event: MouseEvent) => void) | null = null;\n  private onCloseCallback: (() => void) | null = null;\n\n  constructor(component: HTMLElement) {\n    this.component = component;\n  }\n\n  setupOutsideClickHandler(\n    panelContainer: HTMLElement,\n    closeOnOutsideClick: boolean,\n    isOpen: boolean,\n    onClose: () => void\n  ): void {\n    this.panelContainer = panelContainer;\n    this.closeOnOutsideClick = closeOnOutsideClick;\n    this.isOpen = isOpen;\n    this.onCloseCallback = onClose;\n\n    if (!this.closeOnOutsideClick || this.boundHandleDocumentClick) {\n      return;\n    }\n\n    this.boundHandleDocumentClick = this.handleDocumentClick.bind(this);\n    document.addEventListener('mousedown', this.boundHandleDocumentClick, true);\n  }\n\n  updateOutsideClickHandler(\n    panelContainer: HTMLElement | null,\n    closeOnOutsideClick: boolean,\n    isOpen: boolean\n  ): void {\n    this.panelContainer = panelContainer;\n    this.closeOnOutsideClick = closeOnOutsideClick;\n    this.isOpen = isOpen;\n\n    this.cleanupOutsideClickHandler();\n\n    if (isOpen && closeOnOutsideClick && panelContainer) {\n      this.boundHandleDocumentClick = this.handleDocumentClick.bind(this);\n      document.addEventListener('mousedown', this.boundHandleDocumentClick, true);\n    }\n  }\n\n  cleanupOutsideClickHandler(): void {\n    if (this.boundHandleDocumentClick) {\n      document.removeEventListener('mousedown', this.boundHandleDocumentClick, true);\n      this.boundHandleDocumentClick = null;\n    }\n  }\n\n  private handleDocumentClick(event: MouseEvent): void {\n    if (!this.isOpen || !this.closeOnOutsideClick || !this.panelContainer || !this.onCloseCallback) {\n      return;\n    }\n\n    const target = event.target as Node;\n\n    if (!this.panelContainer.contains(target) && !this.component.contains(target)) {\n      this.onCloseCallback();\n    }\n  }\n\n  destroy(): void {\n    this.cleanupOutsideClickHandler();\n    this.panelContainer = null;\n    this.onCloseCallback = null;\n  }\n}\n\n"]}

package/dist/src/nile-floating-panel/index.d.ts

@@ -0,0 +1 @@
+export { NileFloatingPanel } from './nile-floating-panel';

package/dist/src/nile-floating-panel/index.js

@@ -0,0 +1,2 @@
+export { NileFloatingPanel } from './nile-floating-panel';
+//# sourceMappingURL=index.js.map

package/dist/src/nile-floating-panel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/nile-floating-panel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC","sourcesContent":["export { NileFloatingPanel } from './nile-floating-panel';\n\n"]}

package/dist/src/{nile-grid-body/nile-grid-body.css.d.ts → nile-floating-panel/nile-floating-panel.css.d.ts}

@@ -4,9 +4,7 @@
  * This source code is licensed under the BSD-3-Clause license found in the
  * LICENSE file in the root directory of this source tree.
  */
-/**
- * GridBody CSS
- */
 export declare const styles: import("lit").CSSResult;
+export declare const panelContainerStyles: import("lit").CSSResult;
 declare const _default: import("lit").CSSResult[];
 export default _default;

package/dist/src/nile-floating-panel/nile-floating-panel.css.js

@@ -0,0 +1,47 @@
+/**
+ * Copyright Aquera Inc 2025
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { css } from 'lit';
+export const styles = css `
+  :host {
+    box-sizing: border-box;
+    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));
+    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));
+    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));
+    display: inline-block;
+    position: relative;
+  }
+
+  :host([hidden]) {
+    display: none;
+  }
+
+  slot {
+    display: none;
+  }
+`;
+export const panelContainerStyles = css `
+  .nile-floating-panel__container {
+    position: fixed;
+    box-sizing: border-box;
+    z-index: 800;
+    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
+    border: solid 1px var(--nile-colors-dark-200, var(--ng-colors-border-secondary-alt));
+    border-radius: var(--nile-radius-sm, var(--ng-radius-md));
+    box-shadow: var(--nile-box-shadow-2, var(--ng-shadow-lg));
+    padding: var(--nile-spacing-xl, var(--ng-spacing-xl));
+    min-width: var(--nile-width-352px, var(--ng-width-80));
+    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));
+    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));
+    font-size: var(--nile-type-scale-4, var(--ng-font-size-text-sm));
+    font-style: normal;
+    font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-semibold));
+    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));
+    letter-spacing: var(--nile-spacing-one-by-five-x, var(--ng-spacing-none));
+  }
+`;
+export default [styles];
+//# sourceMappingURL=nile-floating-panel.css.js.map

package/dist/src/nile-floating-panel/nile-floating-panel.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-floating-panel.css.js","sourceRoot":"","sources":["../../../src/nile-floating-panel/nile-floating-panel.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;CAiBxB,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;CAmBtC,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2025\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\nexport const styles = css`\n  :host {\n    box-sizing: border-box;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n    display: inline-block;\n    position: relative;\n  }\n\n  :host([hidden]) {\n    display: none;\n  }\n\n  slot {\n    display: none;\n  }\n`;\n\nexport const panelContainerStyles = css`\n  .nile-floating-panel__container {\n    position: fixed;\n    box-sizing: border-box;\n    z-index: 800;\n    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border: solid 1px var(--nile-colors-dark-200, var(--ng-colors-border-secondary-alt));\n    border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n    box-shadow: var(--nile-box-shadow-2, var(--ng-shadow-lg));\n    padding: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    min-width: var(--nile-width-352px, var(--ng-width-80));\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n    font-size: var(--nile-type-scale-4, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-semibold));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n    letter-spacing: var(--nile-spacing-one-by-five-x, var(--ng-spacing-none));\n  }\n`;\n\nexport default [styles];\n\n"]}

package/dist/src/nile-floating-panel/nile-floating-panel.d.ts

@@ -0,0 +1,43 @@
+import { CSSResultArray, TemplateResult } from 'lit';
+import NileElement from '../internal/nile-element';
+import type { FloatingPanelPosition, FloatingPanelAnchor } from './types';
+/**
+ * Nile floating panel component.
+ *
+ * @tag nile-floating-panel
+ * @event nile-show - Emitted when the panel opens.
+ * @event nile-hide - Emitted when the panel closes.
+ */
+export declare class NileFloatingPanel extends NileElement {
+    static get styles(): CSSResultArray;
+    anchor: FloatingPanelAnchor;
+    position: FloatingPanelPosition;
+    open: boolean;
+    closeOnOutsideClick: boolean;
+    enableVisibilityEffect: boolean;
+    enableTabClose: boolean;
+    private panelContainer;
+    private positionManager;
+    private styleManager;
+    private eventManager;
+    private visibilityManager?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updated(changedProperties: Map<string, unknown>): void;
+    private setupPanel;
+    private setupEventHandlers;
+    private setupPositionManager;
+    private findTriggerElement;
+    private setupVisibilityManager;
+    private updatePanelContent;
+    private reposition;
+    private cleanupPanel;
+    render(): TemplateResult;
+    private handleSlotChange;
+}
+export default NileFloatingPanel;
+declare global {
+    interface HTMLElementTagNameMap {
+        'nile-floating-panel': NileFloatingPanel;
+    }
+}

package/dist/src/nile-floating-panel/nile-floating-panel.js

@@ -0,0 +1,238 @@
+var NileFloatingPanel_1;
+import { __decorate } from "tslib";
+import { html, } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { styles } from './nile-floating-panel.css';
+import NileElement from '../internal/nile-element';
+import { PositionManager } from './position-manager';
+import { StyleManager } from './style-manager';
+import { ContentManager } from './content-manager';
+import { AnchorManager } from './anchor-manager';
+import { EventManager } from './event-manager';
+import { VisibilityManager } from '../utilities/visibility-manager';
+/**
+ * Nile floating panel component.
+ *
+ * @tag nile-floating-panel
+ * @event nile-show - Emitted when the panel opens.
+ * @event nile-hide - Emitted when the panel closes.
+ */
+let NileFloatingPanel = NileFloatingPanel_1 = class NileFloatingPanel extends NileElement {
+    constructor() {
+        super(...arguments);
+        this.anchor = null;
+        this.position = 'bottom';
+        this.open = false;
+        this.closeOnOutsideClick = true;
+        this.enableVisibilityEffect = true;
+        this.enableTabClose = false;
+        this.panelContainer = null;
+        this.positionManager = null;
+        this.styleManager = new StyleManager();
+        this.eventManager = new EventManager(this);
+        this.handleSlotChange = () => {
+            if (this.open && this.panelContainer) {
+                this.updatePanelContent();
+            }
+        };
+    }
+    static get styles() {
+        return [styles];
+    }
+    connectedCallback() {
+        super.connectedCallback();
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.cleanupPanel();
+        this.visibilityManager?.cleanup();
+    }
+    updated(changedProperties) {
+        super.updated(changedProperties);
+        if (changedProperties.has('open')) {
+            if (this.open) {
+                this.emit('nile-show');
+                this.setupPanel();
+                this.visibilityManager?.setup();
+            }
+            else {
+                this.emit('nile-hide');
+                this.visibilityManager?.cleanup();
+                this.cleanupPanel();
+            }
+        }
+        if (changedProperties.has('closeOnOutsideClick') &&
+            this.open &&
+            this.panelContainer) {
+            this.eventManager.updateOutsideClickHandler(this.panelContainer, this.closeOnOutsideClick, this.open);
+        }
+        if (changedProperties.has('anchor') && this.open) {
+            this.cleanupPanel();
+            this.setupPanel();
+        }
+        if ((changedProperties.has('enableVisibilityEffect') ||
+            changedProperties.has('enableTabClose')) &&
+            this.open) {
+            this.setupVisibilityManager();
+        }
+        if (changedProperties.has('position') &&
+            this.open &&
+            this.positionManager) {
+            this.positionManager.updatePosition(this.position);
+        }
+        if (changedProperties.has('open') && this.open && this.panelContainer) {
+            this.updatePanelContent();
+        }
+    }
+    setupPanel() {
+        if (this.panelContainer) {
+            return;
+        }
+        const componentStyles = this.constructor
+            .styles;
+        if (componentStyles) {
+            this.styleManager.injectStyles(componentStyles);
+        }
+        this.panelContainer = document.createElement('div');
+        this.panelContainer.setAttribute('part', 'panel');
+        this.panelContainer.className = 'nile-floating-panel__container';
+        this.updatePanelContent();
+        const anchorElement = AnchorManager.resolveAnchor(this.anchor);
+        AnchorManager.appendToAnchor(anchorElement, this.panelContainer);
+        requestAnimationFrame(() => {
+            this.setupPositionManager();
+            this.setupEventHandlers();
+            this.setupVisibilityManager();
+        });
+    }
+    setupEventHandlers() {
+        if (!this.panelContainer) {
+            return;
+        }
+        this.eventManager.setupOutsideClickHandler(this.panelContainer, this.closeOnOutsideClick, this.open, () => {
+            this.open = false;
+        });
+    }
+    setupPositionManager() {
+        if (!this.panelContainer) {
+            return;
+        }
+        const referenceElement = this.findTriggerElement() || this;
+        this.positionManager = new PositionManager(referenceElement, this.panelContainer, this.position);
+        this.positionManager.reposition();
+        this.positionManager.setupAutoUpdate();
+    }
+    findTriggerElement() {
+        // Try to find the next sibling element as the trigger
+        let nextSibling = this.nextElementSibling;
+        while (nextSibling) {
+            if (nextSibling instanceof HTMLElement) {
+                return nextSibling;
+            }
+            nextSibling = nextSibling.nextElementSibling;
+        }
+        // Try to find the previous sibling element
+        let previousSibling = this.previousElementSibling;
+        while (previousSibling) {
+            if (previousSibling instanceof HTMLElement) {
+                return previousSibling;
+            }
+            previousSibling = previousSibling.previousElementSibling;
+        }
+        return null;
+    }
+    setupVisibilityManager() {
+        if (!this.enableVisibilityEffect) {
+            return;
+        }
+        const triggerElement = this.findTriggerElement();
+        // Cleanup existing visibility manager if it exists
+        if (this.visibilityManager) {
+            this.visibilityManager.cleanup();
+        }
+        this.visibilityManager = new VisibilityManager({
+            host: this,
+            target: triggerElement || null,
+            enableVisibilityEffect: this.enableVisibilityEffect,
+            enableTabClose: this.enableTabClose,
+            isOpen: () => this.open,
+            onAnchorOutOfView: () => {
+                this.open = false;
+                this.emit('nile-visibility-change', {
+                    visible: false,
+                    reason: 'anchor-out-of-view',
+                });
+            },
+            onDocumentHidden: () => {
+                this.open = false;
+                this.emit('nile-visibility-change', {
+                    visible: false,
+                    reason: 'document-hidden',
+                });
+            },
+            emit: (event, detail) => this.emit(`nile-${event}`, detail),
+        });
+        if (this.open) {
+            this.visibilityManager.setup();
+        }
+    }
+    updatePanelContent() {
+        if (!this.panelContainer) {
+            return;
+        }
+        const slot = this.shadowRoot?.querySelector('slot') || null;
+        ContentManager.updatePanelContent(this.panelContainer, slot, '');
+    }
+    reposition() {
+        if (this.positionManager) {
+            this.positionManager.reposition();
+        }
+    }
+    cleanupPanel() {
+        this.eventManager.destroy();
+        if (this.positionManager) {
+            this.positionManager.destroy();
+            this.positionManager = null;
+        }
+        if (this.panelContainer) {
+            AnchorManager.removeFromAnchor(this.panelContainer);
+        }
+        this.panelContainer = null;
+        this.styleManager.cleanupStyles();
+    }
+    render() {
+        return html ` <slot @slotchange=${this.handleSlotChange}></slot> `;
+    }
+};
+__decorate([
+    property()
+], NileFloatingPanel.prototype, "anchor", void 0);
+__decorate([
+    property()
+], NileFloatingPanel.prototype, "position", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileFloatingPanel.prototype, "open", void 0);
+__decorate([
+    property({
+        type: Boolean,
+        reflect: true,
+        attribute: 'close-on-outside-click',
+        converter: {
+            fromAttribute: (value) => (!value || value === 'false' ? false : true),
+            toAttribute: (value) => (value ? 'true' : 'false'),
+        },
+    })
+], NileFloatingPanel.prototype, "closeOnOutsideClick", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NileFloatingPanel.prototype, "enableVisibilityEffect", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NileFloatingPanel.prototype, "enableTabClose", void 0);
+NileFloatingPanel = NileFloatingPanel_1 = __decorate([
+    customElement('nile-floating-panel')
+], NileFloatingPanel);
+export { NileFloatingPanel };
+export default NileFloatingPanel;
+//# sourceMappingURL=nile-floating-panel.js.map

package/dist/src/nile-floating-panel/nile-floating-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-floating-panel.js","sourceRoot":"","sources":["../../../src/nile-floating-panel/nile-floating-panel.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  LitElement,\n  html,\n  CSSResultArray,\n  TemplateResult,\n  PropertyValues,\n} from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { styles } from './nile-floating-panel.css';\nimport NileElement from '../internal/nile-element';\nimport { PositionManager } from './position-manager';\nimport { StyleManager } from './style-manager';\nimport { ContentManager } from './content-manager';\nimport { AnchorManager } from './anchor-manager';\nimport { EventManager } from './event-manager';\nimport { VisibilityManager } from '../utilities/visibility-manager';\nimport type { FloatingPanelPosition, FloatingPanelAnchor } from './types';\n\n/**\n * Nile floating panel component.\n *\n * @tag nile-floating-panel\n * @event nile-show - Emitted when the panel opens.\n * @event nile-hide - Emitted when the panel closes.\n */\n@customElement('nile-floating-panel')\nexport class NileFloatingPanel extends NileElement {\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  @property() anchor: FloatingPanelAnchor = null;\n\n  @property() position: FloatingPanelPosition = 'bottom';\n\n  @property({ type: Boolean, reflect: true, attribute: true }) open = false;\n\n  @property({\n    type: Boolean,\n    reflect: true,\n    attribute: 'close-on-outside-click',\n    converter: {\n      fromAttribute: (value: string | null) => (!value || value === 'false' ? false : true),\n      toAttribute: (value: boolean) => (value ? 'true' : 'false'),\n    },\n  })\n  closeOnOutsideClick = true;\n\n  @property({ type: Boolean, reflect: true }) enableVisibilityEffect = true;\n\n  @property({ type: Boolean, reflect: true }) enableTabClose = false;\n\n  private panelContainer: HTMLElement | null = null;\n  private positionManager: PositionManager | null = null;\n  private styleManager: StyleManager = new StyleManager();\n  private eventManager: EventManager = new EventManager(this);\n  private visibilityManager?: VisibilityManager;\n\n  connectedCallback() {\n    super.connectedCallback();\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.cleanupPanel();\n    this.visibilityManager?.cleanup();\n  }\n\n  updated(changedProperties: Map<string, unknown>) {\n    super.updated(changedProperties);\n\n    if (changedProperties.has('open')) {\n      if (this.open) {\n        this.emit('nile-show');\n        this.setupPanel();\n        this.visibilityManager?.setup();\n      } else {\n        this.emit('nile-hide');\n        this.visibilityManager?.cleanup();\n        this.cleanupPanel();\n      }\n    }\n\n    if (\n      changedProperties.has('closeOnOutsideClick') &&\n      this.open &&\n      this.panelContainer\n    ) {\n      this.eventManager.updateOutsideClickHandler(\n        this.panelContainer,\n        this.closeOnOutsideClick,\n        this.open\n      );\n    }\n\n    if (changedProperties.has('anchor') && this.open) {\n      this.cleanupPanel();\n      this.setupPanel();\n    }\n\n    if (\n      (changedProperties.has('enableVisibilityEffect') ||\n        changedProperties.has('enableTabClose')) &&\n      this.open\n    ) {\n      this.setupVisibilityManager();\n    }\n\n    if (\n      changedProperties.has('position') &&\n      this.open &&\n      this.positionManager\n    ) {\n      this.positionManager.updatePosition(this.position);\n    }\n\n    if (changedProperties.has('open') && this.open && this.panelContainer) {\n      this.updatePanelContent();\n    }\n  }\n\n  private setupPanel() {\n    if (this.panelContainer) {\n      return;\n    }\n\n    const componentStyles = (this.constructor as typeof NileFloatingPanel)\n      .styles;\n    if (componentStyles) {\n      this.styleManager.injectStyles(componentStyles);\n    }\n\n    this.panelContainer = document.createElement('div');\n    this.panelContainer.setAttribute('part', 'panel');\n    this.panelContainer.className = 'nile-floating-panel__container';\n\n    this.updatePanelContent();\n\n    const anchorElement = AnchorManager.resolveAnchor(this.anchor);\n    AnchorManager.appendToAnchor(anchorElement, this.panelContainer);\n\n    requestAnimationFrame(() => {\n      this.setupPositionManager();\n      this.setupEventHandlers();\n      this.setupVisibilityManager();\n    });\n  }\n\n  private setupEventHandlers() {\n    if (!this.panelContainer) {\n      return;\n    }\n\n    this.eventManager.setupOutsideClickHandler(\n      this.panelContainer,\n      this.closeOnOutsideClick,\n      this.open,\n      () => {\n        this.open = false;\n      }\n    );\n  }\n\n  private setupPositionManager() {\n    if (!this.panelContainer) {\n      return;\n    }\n\n    const referenceElement = this.findTriggerElement() || this;\n    this.positionManager = new PositionManager(\n      referenceElement,\n      this.panelContainer,\n      this.position\n    );\n\n    this.positionManager.reposition();\n    this.positionManager.setupAutoUpdate();\n  }\n\n  private findTriggerElement(): HTMLElement | null {\n    // Try to find the next sibling element as the trigger\n    let nextSibling = this.nextElementSibling;\n    while (nextSibling) {\n      if (nextSibling instanceof HTMLElement) {\n        return nextSibling;\n      }\n      nextSibling = nextSibling.nextElementSibling;\n    }\n\n    // Try to find the previous sibling element\n    let previousSibling = this.previousElementSibling;\n    while (previousSibling) {\n      if (previousSibling instanceof HTMLElement) {\n        return previousSibling;\n      }\n      previousSibling = previousSibling.previousElementSibling;\n    }\n\n    return null;\n  }\n\n  private setupVisibilityManager(): void {\n    if (!this.enableVisibilityEffect) {\n      return;\n    }\n\n    const triggerElement = this.findTriggerElement();\n    \n    // Cleanup existing visibility manager if it exists\n    if (this.visibilityManager) {\n      this.visibilityManager.cleanup();\n    }\n\n    this.visibilityManager = new VisibilityManager({\n      host: this,\n      target: triggerElement || null,\n      enableVisibilityEffect: this.enableVisibilityEffect,\n      enableTabClose: this.enableTabClose,\n      isOpen: () => this.open,\n      onAnchorOutOfView: () => {\n        this.open = false;\n        this.emit('nile-visibility-change', {\n          visible: false,\n          reason: 'anchor-out-of-view',\n        });\n      },\n      onDocumentHidden: () => {\n        this.open = false;\n        this.emit('nile-visibility-change', {\n          visible: false,\n          reason: 'document-hidden',\n        });\n      },\n      emit: (event, detail) => this.emit(`nile-${event}`, detail),\n    });\n\n    if (this.open) {\n      this.visibilityManager.setup();\n    }\n  }\n\n  private updatePanelContent() {\n    if (!this.panelContainer) {\n      return;\n    }\n\n    const slot = this.shadowRoot?.querySelector('slot') || null;\n    ContentManager.updatePanelContent(this.panelContainer, slot, '');\n  }\n\n  private reposition() {\n    if (this.positionManager) {\n      this.positionManager.reposition();\n    }\n  }\n\n  private cleanupPanel() {\n    this.eventManager.destroy();\n\n    if (this.positionManager) {\n      this.positionManager.destroy();\n      this.positionManager = null;\n    }\n\n    if (this.panelContainer) {\n      AnchorManager.removeFromAnchor(this.panelContainer);\n    }\n\n    this.panelContainer = null;\n\n    this.styleManager.cleanupStyles();\n  }\n\n  public render(): TemplateResult {\n    return html` <slot @slotchange=${this.handleSlotChange}></slot> `;\n  }\n\n  private handleSlotChange = () => {\n    if (this.open && this.panelContainer) {\n      this.updatePanelContent();\n    }\n  };\n}\n\nexport default NileFloatingPanel;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-floating-panel': NileFloatingPanel;\n  }\n}\n"]}

package/dist/src/nile-floating-panel/position-manager.d.ts

@@ -0,0 +1,17 @@
+import type { FloatingPanelPosition } from './types';
+export declare class PositionManager {
+    private cleanup;
+    private referenceElement;
+    private floatingElement;
+    private position;
+    private offsetValue;
+    private shiftPadding;
+    constructor(referenceElement: HTMLElement, floatingElement: HTMLElement, position: FloatingPanelPosition, offsetValue?: number, shiftPadding?: number);
+    setupAutoUpdate(): void;
+    cleanupAutoUpdate(): void;
+    reposition(): void;
+    updatePosition(position: FloatingPanelPosition): void;
+    updateOffset(offset: number): void;
+    updateShiftPadding(padding: number): void;
+    destroy(): void;
+}

package/dist/src/nile-floating-panel/position-manager.js

@@ -0,0 +1,72 @@
+import { autoUpdate, computePosition, offset, shift, flip } from '@floating-ui/dom';
+export class PositionManager {
+    constructor(referenceElement, floatingElement, position, offsetValue = 8, shiftPadding = 8) {
+        this.cleanup = null;
+        this.referenceElement = referenceElement;
+        this.floatingElement = floatingElement;
+        this.position = position;
+        this.offsetValue = offsetValue;
+        this.shiftPadding = shiftPadding;
+    }
+    setupAutoUpdate() {
+        this.cleanupAutoUpdate();
+        this.cleanup = autoUpdate(this.referenceElement, this.floatingElement, () => {
+            this.reposition();
+        }, {
+            ancestorScroll: true,
+            ancestorResize: true,
+            elementResize: true,
+            layoutShift: true,
+            animationFrame: false,
+        });
+    }
+    cleanupAutoUpdate() {
+        if (this.cleanup) {
+            this.cleanup();
+            this.cleanup = null;
+        }
+    }
+    reposition() {
+        const placement = this.position;
+        computePosition(this.referenceElement, this.floatingElement, {
+            placement,
+            strategy: 'fixed',
+            middleware: [
+                offset(this.offsetValue),
+                flip(),
+                shift({
+                    padding: this.shiftPadding,
+                }),
+            ],
+        }).then(({ x, y, placement: finalPlacement }) => {
+            let adjustedY = y;
+            if (finalPlacement.startsWith('bottom')) {
+                adjustedY = y + 10;
+            }
+            else if (finalPlacement.startsWith('top')) {
+                adjustedY = y - 20;
+            }
+            Object.assign(this.floatingElement.style, {
+                left: `${x}px`,
+                top: `${adjustedY}px`,
+                position: 'fixed',
+            });
+        });
+    }
+    updatePosition(position) {
+        this.position = position;
+        this.reposition();
+    }
+    updateOffset(offset) {
+        this.offsetValue = offset;
+        this.reposition();
+    }
+    updateShiftPadding(padding) {
+        this.shiftPadding = padding;
+        this.reposition();
+    }
+    destroy() {
+        this.cleanupAutoUpdate();
+    }
+}
+//# sourceMappingURL=position-manager.js.map