@nuraly/lumenui 0.2.1 → 0.2.2

package/dist/src/components/tooltips/demo/tooltips-demo.js

@@ -0,0 +1,132 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/**
+ * @license
+ * Copyright 2023 Google Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, css, html } from 'lit';
+import { customElement, state } from 'lit/decorators.js';
+import '../tooltips.component';
+let ElMeenuElement = class ElMeenuElement extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.float = 'left';
+    }
+    render() {
+        return html `
+      <h3>BOTTOM</h3>
+      <span>click me</span>
+      <hy-tooltip
+        .isPopConfirm=${true}
+        .popConfirmDescription=${'Are you sure to delete this task?'}
+        .popConfirmTitle=${'delete the task'}
+        .cancelText=${'Cancel'}
+        .okText=${'Ok'}
+        @onCancel=${() => {
+            console.log('canceled');
+        }}
+        @onConfirm=${() => {
+            console.log('confirm');
+        }}
+      >
+      </hy-tooltip>
+
+      <br /><br /><br />
+      <p>hover me</p>
+      <hy-tooltip alignement=${'start'}>
+        <span>This is bottom and start</span>
+      </hy-tooltip>
+
+      <br /><br /><br />
+      <p>hover me</p>
+      <hy-tooltip alignement=${'end'}>
+        <span>This is bottom and end</span>
+      </hy-tooltip>
+
+      <br /><br /><br />
+      <h3>TOP</h3>
+
+      <p>hover me</p>
+      <hy-tooltip position=${'top'}>
+        <span>This is a description of the p in top and center</span>
+      </hy-tooltip>
+      <br /><br /><br />
+      <div>hover me</div>
+
+      <hy-tooltip position=${'top'} alignement=${'start'}>
+        <span>This is a description of the p in top and start </span>
+      </hy-tooltip>
+      <br /><br /><br />
+
+      <p>hover me</p>
+
+      <hy-tooltip position=${'top'} alignement=${'end'}>
+        <span>This is a description of the p in top and end</span>
+      </hy-tooltip>
+      <br /><br /><br />
+      <h3>RIGHT</h3>
+      <span>hover me</span>
+      <hy-tooltip position=${'right'}>
+        <span>This is a description of the p to the right and center</span>
+      </hy-tooltip>
+
+      <br /><br /><br />
+
+      <div>hover me</div>
+      <hy-tooltip position=${'right'} alignement=${'start'}>
+        <span>This is a description of the p to the right and start</span>
+      </hy-tooltip>
+
+      <br /><br /><br />
+      <span>hover me</span>
+      <hy-tooltip position=${'right'} alignement=${'end'}>
+        <span>This is a description of the p to the right and end</span>
+      </hy-tooltip>
+
+      <br /><br /><br />
+      <h3>LEFT</h3>
+      <span>hover me</span>
+      <hy-tooltip position=${'left'}>
+        <span>This is a description of the p to the left and center</span>
+      </hy-tooltip>
+      <br /><br /><br />
+
+      <span>hover me</span>
+      <hy-tooltip position=${'left'} alignement=${'start'}>
+        <span>This is a description of the p to the left and start</span>
+      </hy-tooltip>
+
+      <br /><br /><br />
+
+      <div>hover me</div>
+      <hy-tooltip position=${'left'} alignement=${'end'}>
+        <span>This is a description of the p to the left and end</span>
+      </hy-tooltip>
+    `;
+    }
+};
+ElMeenuElement.styles = [
+    css `
+      :host {
+        width: 800px;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+      }
+    `,
+];
+__decorate([
+    state()
+], ElMeenuElement.prototype, "float", void 0);
+ElMeenuElement = __decorate([
+    customElement('hy-tooltips-demo')
+], ElMeenuElement);
+export { ElMeenuElement };
+//# sourceMappingURL=tooltips-demo.js.map

package/dist/src/components/tooltips/test/tooltips_test.d.ts

@@ -0,0 +1,2 @@
+import '../tooltips.component';
+//# sourceMappingURL=tooltips_test.d.ts.map

package/dist/src/components/tooltips/test/tooltips_test.js

@@ -0,0 +1,145 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { html, fixture, expect } from '@open-wc/testing';
+import '../tooltips.component';
+import { TooltipAlignment, TooltipPosition } from '../tooltips.constant';
+suite('TooltipElement', () => {
+    test('shows tooltip on mouseover and hides on mouseleave', () => __awaiter(void 0, void 0, void 0, function* () {
+        const wrapper = yield fixture(html `
+      <div>
+        <span id="target">Hover me</span>
+        <hy-tooltip>Tooltip Content</hy-tooltip>
+      </div>
+    `);
+        const target = wrapper.querySelector('#target');
+        const tooltip = wrapper.querySelector('hy-tooltip');
+        expect(tooltip.show).to.be.false;
+        target.dispatchEvent(new MouseEvent('mouseover'));
+        expect(tooltip.show).to.be.true;
+        target.dispatchEvent(new MouseEvent('mouseleave'));
+        expect(tooltip.show).to.be.false;
+    }));
+    test('init tooltip position on mouseleave', () => __awaiter(void 0, void 0, void 0, function* () {
+        const wrapper = yield fixture(html `
+      <div>
+        <span id="target">Hover me</span>
+        <hy-tooltip>Tooltip Content</hy-tooltip>
+      </div>
+    `);
+        const target = wrapper.querySelector('#target');
+        const tooltip = wrapper.querySelector('hy-tooltip');
+        target.dispatchEvent(new MouseEvent('mouseover'));
+        yield tooltip.updateComplete;
+        expect(tooltip.show).to.be.true;
+        expect(tooltip.style.top).to.not.be.empty;
+        expect(tooltip.style.left).to.not.be.empty;
+        expect(tooltip.style.width).to.not.be.empty;
+        target.dispatchEvent(new MouseEvent('mouseleave'));
+        expect(tooltip.show).to.be.false;
+        expect(tooltip.style.top).to.be.empty;
+        expect(tooltip.style.left).to.be.empty;
+        expect(tooltip.style.width).to.be.empty;
+    }));
+    suite('calculates tooltip style correctly', () => {
+        test('tooltip style when position is bottom and alignement is center', () => __awaiter(void 0, void 0, void 0, function* () {
+            const wrapper = yield fixture(html `
+        <div>
+          <span id="target">Hover me</span>
+          <hy-tooltip position="${TooltipPosition.Bottom}" alignement="${TooltipAlignment.Center}">
+            Tooltip Content
+          </hy-tooltip>
+        </div>
+      `);
+            const target = wrapper.querySelector('#target');
+            const tooltip = wrapper.querySelector('hy-tooltip');
+            target.dispatchEvent(new MouseEvent('mouseover'));
+            yield tooltip.updateComplete;
+            const targetRect = target.getBoundingClientRect();
+            const tooltipRect = tooltip.getBoundingClientRect();
+            expect(Math.ceil(+tooltip.style.top.split('px')[0])).to.equal(Math.ceil(targetRect.bottom + tooltip.verticalOffset));
+            expect(Math.ceil(+tooltip.style.left.split('px')[0])).to.equal(Math.ceil(targetRect.left - tooltipRect.width / 2 + targetRect.width / 2));
+        }));
+        test('tooltip style when position is left and alignement is end', () => __awaiter(void 0, void 0, void 0, function* () {
+            const wrapper = yield fixture(html `
+        <div>
+          <span id="target">Hover me</span>
+          <hy-tooltip position="${TooltipPosition.Left}" alignement="${TooltipAlignment.End}">
+            Tooltip Content
+          </hy-tooltip>
+        </div>
+      `);
+            const target = wrapper.querySelector('#target');
+            const tooltip = wrapper.querySelector('hy-tooltip');
+            target.dispatchEvent(new MouseEvent('mouseover'));
+            yield tooltip.updateComplete;
+            const targetRect = target.getBoundingClientRect();
+            const tooltipRect = tooltip.getBoundingClientRect();
+            expect(Math.ceil(+tooltip.style.top.split('px')[0])).to.equal(Math.ceil(targetRect.bottom - tooltipRect.height));
+            expect(Math.ceil(+tooltip.style.left.split('px')[0])).to.equal(Math.ceil(targetRect.left - tooltipRect.width - tooltip.horizontalOffset));
+        }));
+        test('tooltip style when position is top and alignement is start', () => __awaiter(void 0, void 0, void 0, function* () {
+            const wrapper = yield fixture(html `
+        <div>
+          <span id="target">Hover me</span>
+          <hy-tooltip position="${TooltipPosition.Top}" alignement="${TooltipAlignment.Start}">
+            Tooltip Content
+          </hy-tooltip>
+        </div>
+      `);
+            const target = wrapper.querySelector('#target');
+            const tooltip = wrapper.querySelector('hy-tooltip');
+            target.dispatchEvent(new MouseEvent('mouseover'));
+            yield tooltip.updateComplete;
+            const targetRect = target.getBoundingClientRect();
+            const tooltipRect = tooltip.getBoundingClientRect();
+            expect(Math.ceil(+tooltip.style.top.split('px')[0])).to.equal(Math.ceil(targetRect.top - tooltipRect.height - tooltip.verticalOffset));
+            expect(Math.ceil(+tooltip.style.left.split('px')[0])).to.equal(Math.ceil(targetRect.left - tooltip.horizontalOffset));
+        }));
+    });
+    suite('removes event listeners on disconnectedCallback', () => {
+        test('removes mouseleave listener', () => __awaiter(void 0, void 0, void 0, function* () {
+            const wrapper = yield fixture(html `
+        <div>
+          <span id="target">Hover me</span>
+          <hy-tooltip>Tooltip Content</hy-tooltip>
+        </div>
+      `);
+            const target = wrapper.querySelector('#target');
+            const tooltip = wrapper.querySelector('hy-tooltip');
+            target.dispatchEvent(new MouseEvent('mouseover'));
+            expect(tooltip.show).to.be.true;
+            target.dispatchEvent(new MouseEvent('mouseleave'));
+            expect(tooltip.show).to.be.false;
+            target.dispatchEvent(new MouseEvent('mouseover'));
+            expect(tooltip.show).to.be.true;
+            wrapper.removeChild(tooltip);
+            target.dispatchEvent(new MouseEvent('mouseleave'));
+            expect(tooltip.show).to.be.true;
+        }));
+        test('removes mouseover listener', () => __awaiter(void 0, void 0, void 0, function* () {
+            const wrapper = yield fixture(html `
+        <div>
+          <span id="target">Hover me</span>
+          <hy-tooltip>Tooltip Content</hy-tooltip>
+        </div>
+      `);
+            const target = wrapper.querySelector('#target');
+            const tooltip = wrapper.querySelector('hy-tooltip');
+            target.dispatchEvent(new MouseEvent('mouseover'));
+            expect(tooltip.show).to.be.true;
+            target.dispatchEvent(new MouseEvent('mouseleave'));
+            expect(tooltip.show).to.be.false;
+            wrapper.removeChild(tooltip);
+            target.dispatchEvent(new MouseEvent('mouseover'));
+            expect(tooltip.show).to.be.false;
+        }));
+    });
+});
+//# sourceMappingURL=tooltips_test.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nuraly/lumenui",
-  "version": "0.2.1",
+  "version": "0.2.2",
   "description": "A comprehensive collection of enterprise-class web components built with Lit and TypeScript",
   "type": "module",
   "main": "dist/nuralyui.bundle.js",
@@ -49,6 +49,30 @@
     "./*/react": {
       "import": "./dist/src/components/*/react.js",
       "types": "./dist/src/components/*/react.d.ts"
+    },
+    "./chatbot/core": {
+      "import": "./dist/src/components/chatbot/core/index.js",
+      "types": "./dist/src/components/chatbot/core/index.d.ts"
+    },
+    "./chatbot/providers": {
+      "import": "./dist/src/components/chatbot/providers/index.js",
+      "types": "./dist/src/components/chatbot/providers/index.d.ts"
+    },
+    "./chatbot/plugins": {
+      "import": "./dist/src/components/chatbot/plugins/index.js",
+      "types": "./dist/src/components/chatbot/plugins/index.d.ts"
+    },
+    "./chatbot/storage": {
+      "import": "./dist/src/components/chatbot/storage/index.js",
+      "types": "./dist/src/components/chatbot/storage/index.d.ts"
+    },
+    "./chatbot/controllers": {
+      "import": "./dist/src/components/chatbot/controllers/index.js",
+      "types": "./dist/src/components/chatbot/controllers/index.d.ts"
+    },
+    "./chatbot/utils": {
+      "import": "./dist/src/components/chatbot/utils/index.js",
+      "types": "./dist/src/components/chatbot/utils/index.d.ts"
     }
   },
   "files": [
@@ -58,6 +82,8 @@
     "dist/src/components/*/index.d.ts",
     "dist/src/components/*/*.js",
     "dist/src/components/*/*.d.ts",
+    "dist/src/components/*/*/*.js",
+    "dist/src/components/*/*/*.d.ts",
     "dist/src/components/*/bundle.js",
     "dist/src/components/*/bundle.js.gz",
     "packages/common/dist",

package/packages/common/dist/VERSIONS.md

@@ -1,4 +1,4 @@
 # @nuralyui/common
 
 Version: 0.1.5
-Build Date: 2026-03-31
+Build Date: 2026-04-01