@aquera/nile-elements 0.1.63 → 0.1.64-beta-1.1

package/dist/src/nile-richeditor/nile-richeditor.js

@@ -0,0 +1,234 @@
+import { __decorate } from "tslib";
+// src/components/nile-richeditor.ts
+import { LitElement, html, css } from 'lit';
+import { customElement, query } from 'lit/decorators.js';
+let NileRicheditor = class NileRicheditor extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.lastRange = null;
+    }
+    firstUpdated() {
+        this.editor.addEventListener('mouseup', () => this.saveRange());
+        this.editor.addEventListener('keyup', () => this.saveRange());
+    }
+    saveRange() {
+        const sel = window.getSelection();
+        if (!sel || sel.rangeCount === 0)
+            return;
+        const range = sel.getRangeAt(0);
+        if (range.collapsed)
+            return;
+        const anchor = sel.anchorNode;
+        if (anchor && this.editor.contains(anchor)) {
+            this.lastRange = range.cloneRange();
+        }
+    }
+    restoreRange() {
+        const sel = window.getSelection();
+        if (!sel)
+            return;
+        sel.removeAllRanges();
+        if (this.lastRange) {
+            sel.addRange(this.lastRange);
+        }
+        else {
+            const r = document.createRange();
+            r.selectNodeContents(this.editor);
+            r.collapse(false);
+            sel.addRange(r);
+        }
+    }
+    render() {
+        return html `
+      <div class="toolbar">
+        ${['h1', 'h2', 'h3'].map(tag => html `
+          <button
+            type="button"
+            @mousedown=${(e) => e.preventDefault()}
+            @click=${() => this.onBlockClick(tag)}
+          >${tag.toUpperCase()}</button>
+        `)}
+        ${[['strong', 'B'], ['em', 'I'], ['u', 'U']].map(([tag, label]) => html `
+          <button
+            type="button"
+            @mousedown=${(e) => e.preventDefault()}
+            @click=${() => this.onInlineClick(tag)}
+          ><${label}></${label}></button>
+        `)}
+      </div>
+      <div class="editor" contenteditable="true"></div>
+    `;
+    }
+    onBlockClick(tag) {
+        this.restoreRange();
+        this.editor.focus();
+        const sel = window.getSelection();
+        if (!sel || sel.rangeCount === 0)
+            return;
+        this.formatBlock(tag);
+    }
+    onInlineClick(tag) {
+        this.restoreRange();
+        this.editor.focus();
+        const sel = window.getSelection();
+        if (!sel || sel.rangeCount === 0)
+            return;
+        this.formatInline(tag);
+    }
+    formatInline(tag) {
+        const sel = window.getSelection();
+        const range = sel.getRangeAt(0);
+        if (range.collapsed) {
+            const w = document.createElement(tag);
+            w.innerHTML = '<br>';
+            range.insertNode(w);
+            sel.removeAllRanges();
+            const nr = document.createRange();
+            nr.selectNodeContents(w);
+            nr.collapse(true);
+            sel.addRange(nr);
+            return;
+        }
+        const existing = this.findParentTag(range.commonAncestorContainer, tag);
+        if (existing) {
+            this.unwrap(existing);
+        }
+        else {
+            const w = document.createElement(tag);
+            w.appendChild(range.extractContents());
+            range.insertNode(w);
+            sel.removeAllRanges();
+            const nr2 = document.createRange();
+            nr2.setStartAfter(w);
+            nr2.collapse(true);
+            sel.addRange(nr2);
+        }
+    }
+    formatBlock(tag) {
+        const sel = window.getSelection();
+        if (!sel.rangeCount)
+            return;
+        const range = sel.getRangeAt(0);
+        // Collapsed: toggle or insert
+        if (range.collapsed) {
+            const block = this.getBlockParent(range.startContainer);
+            if (block) {
+                this.replaceBlock(block, tag);
+            }
+            else {
+                const h = document.createElement(tag);
+                h.innerHTML = '<br>';
+                range.insertNode(h);
+                sel.collapse(h, 0);
+            }
+            return;
+        }
+        // Non-collapsed: apply to each intersecting block
+        const blocks = this.getBlocksInRange(range);
+        if (blocks.length === 0) {
+            const newBlock = document.createElement(tag);
+            newBlock.appendChild(range.extractContents());
+            range.insertNode(newBlock);
+            sel.removeAllRanges();
+            const nr = document.createRange();
+            nr.selectNodeContents(newBlock);
+            nr.collapse(false);
+            sel.addRange(nr);
+            return;
+        }
+        blocks.forEach(block => {
+            if (block.tagName.toLowerCase() === tag) {
+                this.replaceBlock(block, 'p');
+            }
+            else {
+                this.replaceBlock(block, tag);
+            }
+        });
+    }
+    getBlocksInRange(range) {
+        const blocks = [];
+        const walker = document.createTreeWalker(this.editor, NodeFilter.SHOW_ELEMENT, {
+            acceptNode: (node) => {
+                if (!(node instanceof HTMLElement))
+                    return NodeFilter.FILTER_SKIP;
+                const tag = node.tagName.toLowerCase();
+                if (!['p', 'h1', 'h2', 'h3', 'blockquote', 'li'].includes(tag))
+                    return NodeFilter.FILTER_SKIP;
+                const nodeRange = document.createRange();
+                nodeRange.selectNodeContents(node);
+                if (range.compareBoundaryPoints(Range.END_TO_START, nodeRange) < 0 &&
+                    range.compareBoundaryPoints(Range.START_TO_END, nodeRange) > 0) {
+                    return NodeFilter.FILTER_ACCEPT;
+                }
+                return NodeFilter.FILTER_SKIP;
+            }
+        });
+        let current = walker.nextNode();
+        while (current) {
+            if (current instanceof HTMLElement) {
+                blocks.push(current);
+            }
+            current = walker.nextNode();
+        }
+        return blocks;
+    }
+    getBlockParent(node) {
+        let el = node;
+        while (el && el !== this.editor) {
+            if (el instanceof HTMLElement &&
+                ['P', 'H1', 'H2', 'H3', 'BLOCKQUOTE', 'LI'].includes(el.tagName))
+                return el;
+            el = el.parentNode;
+        }
+        return null;
+    }
+    replaceBlock(oldB, newTag) {
+        const nb = document.createElement(newTag);
+        while (oldB.firstChild)
+            nb.appendChild(oldB.firstChild);
+        oldB.replaceWith(nb);
+    }
+    findParentTag(node, tag) {
+        let el = node;
+        while (el && el !== this.editor) {
+            if (el instanceof HTMLElement && el.tagName.toLowerCase() === tag)
+                return el;
+            el = el.parentNode;
+        }
+        return null;
+    }
+    unwrap(el) {
+        const parent = el.parentNode;
+        while (el.firstChild)
+            parent.insertBefore(el.firstChild, el);
+        parent.removeChild(el);
+    }
+};
+NileRicheditor.styles = css `
+    :host { display: block; font-family: Arial, sans-serif; }
+    .toolbar { display: flex; gap: 8px; margin-bottom: 12px; }
+    .toolbar button {
+      cursor: pointer;
+      padding: 4px 8px;
+      border: 1px solid #ccc;
+      background: var(--toolbar-bg, #f0f0f0);
+      border-radius: 3px;
+    }
+    .toolbar button:hover { background: var(--toolbar-hover-bg, #e0e0e0); }
+    .editor {
+      min-height: 150px;
+      border: 1px solid #ccc;
+      padding: 8px;
+      border-radius: 4px;
+      outline: none;
+      user-select: text;
+    }
+  `;
+__decorate([
+    query('.editor')
+], NileRicheditor.prototype, "editor", void 0);
+NileRicheditor = __decorate([
+    customElement('nile-richeditor')
+], NileRicheditor);
+export { NileRicheditor };
+//# sourceMappingURL=nile-richeditor.js.map

package/dist/src/nile-richeditor/nile-richeditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-richeditor.js","sourceRoot":"","sources":["../../../src/nile-richeditor/nile-richeditor.ts"],"names":[],"mappings":";AAAA,oCAAoC;AACpC,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAkC,MAAM,KAAK,CAAC;AAC5E,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAGlD,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,UAAU;IAAvC;;QAuBG,cAAS,GAAiB,IAAI,CAAC;IA8MzC,CAAC;IA5MC,YAAY;QACV,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC;QAChE,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAI,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC;IAClE,CAAC;IAEO,SAAS;QACf,MAAM,GAAG,GAAG,MAAM,CAAC,YAAY,EAAE,CAAC;QAClC,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,UAAU,KAAK,CAAC;YAAE,OAAO;QACzC,MAAM,KAAK,GAAG,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;QAChC,IAAI,KAAK,CAAC,SAAS;YAAE,OAAO;QAC5B,MAAM,MAAM,GAAG,GAAG,CAAC,UAAU,CAAC;QAC9B,IAAI,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC;YAC3C,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,UAAU,EAAE,CAAC;QACtC,CAAC;IACH,CAAC;IAEO,YAAY;QAClB,MAAM,GAAG,GAAG,MAAM,CAAC,YAAY,EAAE,CAAC;QAClC,IAAI,CAAC,GAAG;YAAE,OAAO;QACjB,GAAG,CAAC,eAAe,EAAE,CAAC;QACtB,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACnB,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC/B,CAAC;aAAM,CAAC;YACN,MAAM,CAAC,GAAG,QAAQ,CAAC,WAAW,EAAE,CAAC;YACjC,CAAC,CAAC,kBAAkB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YAClC,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;YAClB,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;QAClB,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;UAEL,CAAC,IAAI,EAAC,IAAI,EAAC,IAAI,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA;;;yBAGjB,CAAC,CAAa,EAAE,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE;qBACzC,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC;aACpC,GAAG,CAAC,WAAW,EAAE;SACrB,CAAC;UACA,CAAC,CAAC,QAAQ,EAAC,GAAG,CAAC,EAAC,CAAC,IAAI,EAAC,GAAG,CAAC,EAAC,CAAC,GAAG,EAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAC,KAAK,CAAC,EAAE,EAAE,CAAC,IAAI,CAAA;;;yBAGhD,CAAC,CAAa,EAAE,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE;qBACzC,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC;cACpC,KAAK,MAAM,KAAK;SACrB,CAAC;;;KAGL,CAAC;IACJ,CAAC;IAEO,YAAY,CAAC,GAAW;QAC9B,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;QACpB,MAAM,GAAG,GAAG,MAAM,CAAC,YAAY,EAAE,CAAC;QAClC,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,UAAU,KAAK,CAAC;YAAE,OAAO;QACzC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;IACxB,CAAC;IAEO,aAAa,CAAC,GAAW;QAC/B,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;QACpB,MAAM,GAAG,GAAG,MAAM,CAAC,YAAY,EAAE,CAAC;QAClC,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,UAAU,KAAK,CAAC;YAAE,OAAO;QACzC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC;IACzB,CAAC;IAEO,YAAY,CAAC,GAAW;QAC9B,MAAM,GAAG,GAAG,MAAM,CAAC,YAAY,EAAG,CAAC;QACnC,MAAM,KAAK,GAAG,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;QAChC,IAAI,KAAK,CAAC,SAAS,EAAE,CAAC;YACpB,MAAM,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;YACtC,CAAC,CAAC,SAAS,GAAG,MAAM,CAAC;YACrB,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;YACpB,GAAG,CAAC,eAAe,EAAE,CAAC;YACtB,MAAM,EAAE,GAAG,QAAQ,CAAC,WAAW,EAAE,CAAC;YAClC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC;YACzB,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;YAClB,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;YACjB,OAAO;QACT,CAAC;QACD,MAAM,QAAQ,GAAG,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,uBAAuB,EAAE,GAAG,CAAC,CAAC;QACxE,IAAI,QAAQ,EAAE,CAAC;YACb,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;QACxB,CAAC;aAAM,CAAC;YACN,MAAM,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;YACtC,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC,CAAC;YACvC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;YACpB,GAAG,CAAC,eAAe,EAAE,CAAC;YACtB,MAAM,GAAG,GAAG,QAAQ,CAAC,WAAW,EAAE,CAAC;YACnC,GAAG,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;YACrB,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;YACnB,GAAG,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;QACpB,CAAC;IACH,CAAC;IAEO,WAAW,CAAC,GAAW;QAC7B,MAAM,GAAG,GAAG,MAAM,CAAC,YAAY,EAAG,CAAC;QACnC,IAAI,CAAC,GAAG,CAAC,UAAU;YAAE,OAAO;QAC5B,MAAM,KAAK,GAAG,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;QAEhC,8BAA8B;QAC9B,IAAI,KAAK,CAAC,SAAS,EAAE,CAAC;YACpB,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;YACxD,IAAI,KAAK,EAAE,CAAC;gBACV,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;YAChC,CAAC;iBAAM,CAAC;gBACN,MAAM,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;gBACtC,CAAC,CAAC,SAAS,GAAG,MAAM,CAAC;gBACrB,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;gBACpB,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;YACrB,CAAC;YACD,OAAO;QACT,CAAC;QAED,kDAAkD;QAClD,MAAM,MAAM,GAAG,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;QAC5C,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YACxB,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;YAC7C,QAAQ,CAAC,WAAW,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC,CAAC;YAC9C,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;YAC3B,GAAG,CAAC,eAAe,EAAE,CAAC;YACtB,MAAM,EAAE,GAAG,QAAQ,CAAC,WAAW,EAAE,CAAC;YAClC,EAAE,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;YAChC,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;YACnB,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;YACjB,OAAO;QACT,CAAC;QAED,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACrB,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,GAAG,EAAE,CAAC;gBACxC,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;YAChC,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;YAChC,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;IAEO,gBAAgB,CAAC,KAAY;QACnC,MAAM,MAAM,GAAkB,EAAE,CAAC;QACjC,MAAM,MAAM,GAAG,QAAQ,CAAC,gBAAgB,CACtC,IAAI,CAAC,MAAM,EACX,UAAU,CAAC,YAAY,EACvB;YACE,UAAU,EAAE,CAAC,IAAU,EAAE,EAAE;gBACzB,IAAI,CAAC,CAAC,IAAI,YAAY,WAAW,CAAC;oBAAE,OAAO,UAAU,CAAC,WAAW,CAAC;gBAClE,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;gBACvC,IAAI,CAAC,CAAC,GAAG,EAAC,IAAI,EAAC,IAAI,EAAC,IAAI,EAAC,YAAY,EAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC;oBAAE,OAAO,UAAU,CAAC,WAAW,CAAC;gBACzF,MAAM,SAAS,GAAG,QAAQ,CAAC,WAAW,EAAE,CAAC;gBACzC,SAAS,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;gBACnC,IACE,KAAK,CAAC,qBAAqB,CAAC,KAAK,CAAC,YAAY,EAAE,SAAS,CAAC,GAAG,CAAC;oBAC9D,KAAK,CAAC,qBAAqB,CAAC,KAAK,CAAC,YAAY,EAAE,SAAS,CAAC,GAAG,CAAC,EAC9D,CAAC;oBACD,OAAO,UAAU,CAAC,aAAa,CAAC;gBAClC,CAAC;gBACD,OAAO,UAAU,CAAC,WAAW,CAAC;YAChC,CAAC;SACF,CACF,CAAC;QAEF,IAAI,OAAO,GAAG,MAAM,CAAC,QAAQ,EAAE,CAAC;QAChC,OAAO,OAAO,EAAE,CAAC;YACf,IAAI,OAAO,YAAY,WAAW,EAAE,CAAC;gBACnC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACvB,CAAC;YACD,OAAO,GAAG,MAAM,CAAC,QAAQ,EAAE,CAAC;QAC9B,CAAC;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;IAEO,cAAc,CAAC,IAAU;QAC/B,IAAI,EAAE,GAAgB,IAAI,CAAC;QAC3B,OAAO,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC,MAAM,EAAE,CAAC;YAChC,IACE,EAAE,YAAY,WAAW;gBACzB,CAAC,GAAG,EAAC,IAAI,EAAC,IAAI,EAAC,IAAI,EAAC,YAAY,EAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,OAAO,CAAC;gBAC3D,OAAO,EAAE,CAAC;YACZ,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC;QACrB,CAAC;QACD,OAAO,IAAI,CAAC;IACd,CAAC;IAEO,YAAY,CAAC,IAAiB,EAAE,MAAc;QACpD,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;QAC1C,OAAO,IAAI,CAAC,UAAU;YAAE,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACxD,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;IACvB,CAAC;IAEO,aAAa,CAAC,IAAU,EAAE,GAAW;QAC3C,IAAI,EAAE,GAAgB,IAAI,CAAC;QAC3B,OAAO,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC,MAAM,EAAE,CAAC;YAChC,IAAI,EAAE,YAAY,WAAW,IAAI,EAAE,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,GAAG;gBAAE,OAAO,EAAE,CAAC;YAC7E,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC;QACrB,CAAC;QACD,OAAO,IAAI,CAAC;IACd,CAAC;IAEO,MAAM,CAAC,EAAe;QAC5B,MAAM,MAAM,GAAG,EAAE,CAAC,UAAW,CAAC;QAC9B,OAAO,EAAE,CAAC,UAAU;YAAE,MAAM,CAAC,YAAY,CAAC,EAAE,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;QAC7D,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;IACzB,CAAC;;AAnOM,qBAAM,GAAmB,GAAG,CAAA;;;;;;;;;;;;;;;;;;;GAmBlC,AAnBY,CAmBX;AAEwB;IAAzB,KAAK,CAAC,SAAS,CAAC;8CAA8B;AAtBpC,cAAc;IAD1B,aAAa,CAAC,iBAAiB,CAAC;GACpB,cAAc,CAqO1B","sourcesContent":["// src/components/nile-richeditor.ts\nimport { LitElement, html, css, CSSResultGroup, TemplateResult } from 'lit';\nimport { customElement, query } from 'lit/decorators.js';\n\n@customElement('nile-richeditor')\nexport class NileRicheditor extends LitElement {\n  static styles: CSSResultGroup = css`\n    :host { display: block; font-family: Arial, sans-serif; }\n    .toolbar { display: flex; gap: 8px; margin-bottom: 12px; }\n    .toolbar button {\n      cursor: pointer;\n      padding: 4px 8px;\n      border: 1px solid #ccc;\n      background: var(--toolbar-bg, #f0f0f0);\n      border-radius: 3px;\n    }\n    .toolbar button:hover { background: var(--toolbar-hover-bg, #e0e0e0); }\n    .editor {\n      min-height: 150px;\n      border: 1px solid #ccc;\n      padding: 8px;\n      border-radius: 4px;\n      outline: none;\n      user-select: text;\n    }\n  `;\n\n  @query('.editor') private editor!: HTMLElement;\n  private lastRange: Range | null = null;\n\n  firstUpdated() {\n    this.editor.addEventListener('mouseup', () => this.saveRange());\n    this.editor.addEventListener('keyup',   () => this.saveRange());\n  }\n\n  private saveRange() {\n    const sel = window.getSelection();\n    if (!sel || sel.rangeCount === 0) return;\n    const range = sel.getRangeAt(0);\n    if (range.collapsed) return;\n    const anchor = sel.anchorNode;\n    if (anchor && this.editor.contains(anchor)) {\n      this.lastRange = range.cloneRange();\n    }\n  }\n\n  private restoreRange() {\n    const sel = window.getSelection();\n    if (!sel) return;\n    sel.removeAllRanges();\n    if (this.lastRange) {\n      sel.addRange(this.lastRange);\n    } else {\n      const r = document.createRange();\n      r.selectNodeContents(this.editor);\n      r.collapse(false);\n      sel.addRange(r);\n    }\n  }\n\n  render(): TemplateResult {\n    return html`\n      <div class=\"toolbar\">\n        ${['h1','h2','h3'].map(tag => html`\n          <button\n            type=\"button\"\n            @mousedown=${(e: MouseEvent) => e.preventDefault()}\n            @click=${() => this.onBlockClick(tag)}\n          >${tag.toUpperCase()}</button>\n        `)}\n        ${[['strong','B'],['em','I'],['u','U']].map(([tag,label]) => html`\n          <button\n            type=\"button\"\n            @mousedown=${(e: MouseEvent) => e.preventDefault()}\n            @click=${() => this.onInlineClick(tag)}\n          ><${label}></${label}></button>\n        `)}\n      </div>\n      <div class=\"editor\" contenteditable=\"true\"></div>\n    `;\n  }\n\n  private onBlockClick(tag: string) {\n    this.restoreRange();\n    this.editor.focus();\n    const sel = window.getSelection();\n    if (!sel || sel.rangeCount === 0) return;\n    this.formatBlock(tag);\n  }\n\n  private onInlineClick(tag: string) {\n    this.restoreRange();\n    this.editor.focus();\n    const sel = window.getSelection();\n    if (!sel || sel.rangeCount === 0) return;\n    this.formatInline(tag);\n  }\n\n  private formatInline(tag: string) {\n    const sel = window.getSelection()!;\n    const range = sel.getRangeAt(0);\n    if (range.collapsed) {\n      const w = document.createElement(tag);\n      w.innerHTML = '<br>';\n      range.insertNode(w);\n      sel.removeAllRanges();\n      const nr = document.createRange();\n      nr.selectNodeContents(w);\n      nr.collapse(true);\n      sel.addRange(nr);\n      return;\n    }\n    const existing = this.findParentTag(range.commonAncestorContainer, tag);\n    if (existing) {\n      this.unwrap(existing);\n    } else {\n      const w = document.createElement(tag);\n      w.appendChild(range.extractContents());\n      range.insertNode(w);\n      sel.removeAllRanges();\n      const nr2 = document.createRange();\n      nr2.setStartAfter(w);\n      nr2.collapse(true);\n      sel.addRange(nr2);\n    }\n  }\n\n  private formatBlock(tag: string) {\n    const sel = window.getSelection()!;\n    if (!sel.rangeCount) return;\n    const range = sel.getRangeAt(0);\n\n    // Collapsed: toggle or insert\n    if (range.collapsed) {\n      const block = this.getBlockParent(range.startContainer);\n      if (block) {\n        this.replaceBlock(block, tag);\n      } else {\n        const h = document.createElement(tag);\n        h.innerHTML = '<br>';\n        range.insertNode(h);\n        sel.collapse(h, 0);\n      }\n      return;\n    }\n\n    // Non-collapsed: apply to each intersecting block\n    const blocks = this.getBlocksInRange(range);\n    if (blocks.length === 0) {\n      const newBlock = document.createElement(tag);\n      newBlock.appendChild(range.extractContents());\n      range.insertNode(newBlock);\n      sel.removeAllRanges();\n      const nr = document.createRange();\n      nr.selectNodeContents(newBlock);\n      nr.collapse(false);\n      sel.addRange(nr);\n      return;\n    }\n\n    blocks.forEach(block => {\n      if (block.tagName.toLowerCase() === tag) {\n        this.replaceBlock(block, 'p');\n      } else {\n        this.replaceBlock(block, tag);\n      }\n    });\n  }\n\n  private getBlocksInRange(range: Range): HTMLElement[] {\n    const blocks: HTMLElement[] = [];\n    const walker = document.createTreeWalker(\n      this.editor,\n      NodeFilter.SHOW_ELEMENT,\n      {\n        acceptNode: (node: Node) => {\n          if (!(node instanceof HTMLElement)) return NodeFilter.FILTER_SKIP;\n          const tag = node.tagName.toLowerCase();\n          if (!['p','h1','h2','h3','blockquote','li'].includes(tag)) return NodeFilter.FILTER_SKIP;\n          const nodeRange = document.createRange();\n          nodeRange.selectNodeContents(node);\n          if (\n            range.compareBoundaryPoints(Range.END_TO_START, nodeRange) < 0 &&\n            range.compareBoundaryPoints(Range.START_TO_END, nodeRange) > 0\n          ) {\n            return NodeFilter.FILTER_ACCEPT;\n          }\n          return NodeFilter.FILTER_SKIP;\n        }\n      }\n    );\n\n    let current = walker.nextNode();\n    while (current) {\n      if (current instanceof HTMLElement) {\n        blocks.push(current);\n      }\n      current = walker.nextNode();\n    }\n    return blocks;\n  }\n\n  private getBlockParent(node: Node): HTMLElement | null {\n    let el: Node | null = node;\n    while (el && el !== this.editor) {\n      if (\n        el instanceof HTMLElement &&\n        ['P','H1','H2','H3','BLOCKQUOTE','LI'].includes(el.tagName)\n      ) return el;\n      el = el.parentNode;\n    }\n    return null;\n  }\n\n  private replaceBlock(oldB: HTMLElement, newTag: string) {\n    const nb = document.createElement(newTag);\n    while (oldB.firstChild) nb.appendChild(oldB.firstChild);\n    oldB.replaceWith(nb);\n  }\n\n  private findParentTag(node: Node, tag: string): HTMLElement | null {\n    let el: Node | null = node;\n    while (el && el !== this.editor) {\n      if (el instanceof HTMLElement && el.tagName.toLowerCase() === tag) return el;\n      el = el.parentNode;\n    }\n    return null;\n  }\n\n  private unwrap(el: HTMLElement) {\n    const parent = el.parentNode!;\n    while (el.firstChild) parent.insertBefore(el.firstChild, el);\n    parent.removeChild(el);\n  }\n}\n"]}

package/dist/src/nile-richtexteditor/index.d.ts

@@ -0,0 +1 @@
+export { NileRichtexteditor } from './nile-richtexteditor';

package/dist/src/nile-richtexteditor/index.js

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

package/dist/src/nile-richtexteditor/index.js.map

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

package/dist/src/{nile-slider/nile-slider.css.d.ts → nile-richtexteditor/nile-richtexteditor.css.d.ts}

@@ -1,6 +1,6 @@
 /**
-* Slider CSS
-*/
+ * Rich Text Editor
+ */
 export declare const styles: import("lit").CSSResult;
 declare const _default: import("lit").CSSResult[];
 export default _default;

package/dist/src/nile-richtexteditor/nile-richtexteditor.css.js

@@ -0,0 +1,237 @@
+/**
+* Copyright Aquera Inc 2023
+*
+* 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';
+/**
+ * Rich Text Editor
+ */
+export const styles = css `
+  :host {
+    /* you can add host-level vars or rules here if needed */
+  }
+
+  .editor-container {
+    border: 1px solid #d1d5db;
+	position: relative;
+    border-radius: 8px;
+    overflow: hidden;
+    background: #ffffff;
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  }
+
+  .toolbar {
+    display: flex;
+    gap: 1px;
+    padding: 8px;
+    background: #f8f9fa;
+    border-bottom: 1px solid #e5e7eb;
+    align-items: center;
+    flex-wrap: wrap;
+  }
+
+  .toolbar-group {
+    display: flex;
+    gap: 1px;
+    margin-right: 8px;
+    border-right: 1px solid #e5e7eb;
+    padding-right: 8px;
+  }
+
+  .toolbar-group:last-child {
+    border-right: none;
+    margin-right: 0;
+    padding-right: 0;
+  }
+
+  .format-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-width: 28px;
+    height: 28px;
+    padding: 4px 6px;
+    border: 1px solid transparent;
+    background: transparent;
+    border-radius: 4px;
+    cursor: pointer;
+    font-size: 14px;
+    font-family: inherit;
+    color: #374151;
+    transition: all 0.1s ease;
+  }
+  .format-btn:hover {
+    background: #e5e7eb;
+    border-color: #d1d5db;
+  }
+  .format-btn:active {
+    background: #d1d5db;
+  }
+
+  .font-select,
+  .fontsize-select,
+  .heading-select {
+    height: 28px;
+    padding: 4px 8px;
+    border: 1px solid #d1d5db;
+    background: #ffffff;
+    border-radius: 4px;
+    font-size: 14px;
+    font-family: inherit;
+    color: #374151;
+    cursor: pointer;
+  }
+  .font-select { min-width: 100px; }
+  .fontsize-select { min-width: 60px; }
+  .heading-select { min-width: 90px; }
+
+  .color-picker {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 28px;
+    height: 28px;
+    border: 1px solid transparent;
+    background: transparent;
+    border-radius: 4px;
+    cursor: pointer;
+    transition: all 0.1s ease;
+  }
+  .color-picker:hover {
+    background: #e5e7eb;
+    border-color: #d1d5db;
+  }
+  .text-color {
+    flex-direction: column;
+    font-weight: bold;
+    font-size: 16px;
+    color: #374151;
+  }
+  .color-bar {
+    width: 20px;
+    height: 3px;
+    margin-top: -2px;
+  }
+  .color-picker input[type="color"] {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    opacity: 0;
+    cursor: pointer;
+  }
+
+  .editor {
+    min-height: 300px;
+    padding: 16px;
+    outline: none;
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+    font-size: 14px;
+    line-height: 1.6;
+    color: #111827;
+    background: #ffffff;
+  }
+  .editor:empty::before {
+    content: 'Start typing here...';
+    color: #9ca3af;
+    pointer-events: none;
+  }
+  .editor img {
+    max-width: 100%;
+    height: auto;
+    display: block;
+    margin: 8px 0;
+    border-radius: 4px;
+  }
+  .editor blockquote {
+    margin: 16px 0;
+    padding: 8px 16px;
+    border-left: 4px solid #e5e7eb;
+    background: #f9fafb;
+    font-style: italic;
+  }
+  .editor code {
+    background: #f3f4f6;
+    padding: 2px 4px;
+    border-radius: 3px;
+    font-family: 'Courier New', monospace;
+    font-size: 0.9em;
+  }
+  .editor hr {
+    border: none;
+    border-top: 2px solid #e5e7eb;
+    margin: 16px 0;
+  }
+
+  .status-bar {
+    display: flex;
+    justify-content: space-between;
+    padding: 8px 16px;
+    background: #f8f9fa;
+    border-top: 1px solid #e5e7eb;
+    font-size: 12px;
+    color: #6b7280;
+  }
+
+  .preview {
+    border: 1px solid #e5e7eb;
+    background: #ffffff;
+    padding: 16px;
+    border-radius: 8px;
+    margin-top: 16px;
+  }
+  .preview h3 {
+    margin: 0 0 12px 0;
+    color: #374151;
+    font-size: 16px;
+    font-weight: 600;
+  }
+  .preview .content {
+    color: #111827;
+    line-height: 1.6;
+  }
+
+  input[type="file"] {
+    display: none;
+  }
+
+  .mention-dropdown {
+    position: absolute;
+  background: #fff;
+  border: 1px solid #ccc;
+  list-style: none;
+  padding: 4px 0;
+  margin: 0;
+  max-height: 150px;
+  overflow-y: auto;
+  z-index: 100;
+}
+.mention-dropdown li {
+  padding: 4px 12px;
+  cursor: pointer;
+}
+.mention-dropdown li:hover {
+  background: #f0f0f0;
+}
+
+/* styles for the in-editor mentions */
+/* .mention {
+  background-color: #A5D3F3 
+  color: #fff;               
+  padding: 2px 4px;
+  border-radius: 4px;
+  white-space: nowrap;
+} */
+
+/* ensure preview also picks it up */
+/* .preview .mention {
+  background-color: #A5D3F3;
+  color: #fff;
+} */
+
+
+`;
+export default [styles];
+//# sourceMappingURL=nile-richtexteditor.css.js.map

package/dist/src/nile-richtexteditor/nile-richtexteditor.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-richtexteditor.css.js","sourceRoot":"","sources":["../../../src/nile-richtexteditor/nile-richtexteditor.css.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgOxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n* Copyright Aquera Inc 2023\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*/\nimport { css } from 'lit';\n\n/**\n * Rich Text Editor\n */\nexport const styles = css`\n  :host {\n    /* you can add host-level vars or rules here if needed */\n  }\n\n  .editor-container {\n    border: 1px solid #d1d5db;\n\tposition: relative;\n    border-radius: 8px;\n    overflow: hidden;\n    background: #ffffff;\n    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n  }\n\n  .toolbar {\n    display: flex;\n    gap: 1px;\n    padding: 8px;\n    background: #f8f9fa;\n    border-bottom: 1px solid #e5e7eb;\n    align-items: center;\n    flex-wrap: wrap;\n  }\n\n  .toolbar-group {\n    display: flex;\n    gap: 1px;\n    margin-right: 8px;\n    border-right: 1px solid #e5e7eb;\n    padding-right: 8px;\n  }\n\n  .toolbar-group:last-child {\n    border-right: none;\n    margin-right: 0;\n    padding-right: 0;\n  }\n\n  .format-btn {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-width: 28px;\n    height: 28px;\n    padding: 4px 6px;\n    border: 1px solid transparent;\n    background: transparent;\n    border-radius: 4px;\n    cursor: pointer;\n    font-size: 14px;\n    font-family: inherit;\n    color: #374151;\n    transition: all 0.1s ease;\n  }\n  .format-btn:hover {\n    background: #e5e7eb;\n    border-color: #d1d5db;\n  }\n  .format-btn:active {\n    background: #d1d5db;\n  }\n\n  .font-select,\n  .fontsize-select,\n  .heading-select {\n    height: 28px;\n    padding: 4px 8px;\n    border: 1px solid #d1d5db;\n    background: #ffffff;\n    border-radius: 4px;\n    font-size: 14px;\n    font-family: inherit;\n    color: #374151;\n    cursor: pointer;\n  }\n  .font-select { min-width: 100px; }\n  .fontsize-select { min-width: 60px; }\n  .heading-select { min-width: 90px; }\n\n  .color-picker {\n    position: relative;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 28px;\n    height: 28px;\n    border: 1px solid transparent;\n    background: transparent;\n    border-radius: 4px;\n    cursor: pointer;\n    transition: all 0.1s ease;\n  }\n  .color-picker:hover {\n    background: #e5e7eb;\n    border-color: #d1d5db;\n  }\n  .text-color {\n    flex-direction: column;\n    font-weight: bold;\n    font-size: 16px;\n    color: #374151;\n  }\n  .color-bar {\n    width: 20px;\n    height: 3px;\n    margin-top: -2px;\n  }\n  .color-picker input[type=\"color\"] {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    opacity: 0;\n    cursor: pointer;\n  }\n\n  .editor {\n    min-height: 300px;\n    padding: 16px;\n    outline: none;\n    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n    font-size: 14px;\n    line-height: 1.6;\n    color: #111827;\n    background: #ffffff;\n  }\n  .editor:empty::before {\n    content: 'Start typing here...';\n    color: #9ca3af;\n    pointer-events: none;\n  }\n  .editor img {\n    max-width: 100%;\n    height: auto;\n    display: block;\n    margin: 8px 0;\n    border-radius: 4px;\n  }\n  .editor blockquote {\n    margin: 16px 0;\n    padding: 8px 16px;\n    border-left: 4px solid #e5e7eb;\n    background: #f9fafb;\n    font-style: italic;\n  }\n  .editor code {\n    background: #f3f4f6;\n    padding: 2px 4px;\n    border-radius: 3px;\n    font-family: 'Courier New', monospace;\n    font-size: 0.9em;\n  }\n  .editor hr {\n    border: none;\n    border-top: 2px solid #e5e7eb;\n    margin: 16px 0;\n  }\n\n  .status-bar {\n    display: flex;\n    justify-content: space-between;\n    padding: 8px 16px;\n    background: #f8f9fa;\n    border-top: 1px solid #e5e7eb;\n    font-size: 12px;\n    color: #6b7280;\n  }\n\n  .preview {\n    border: 1px solid #e5e7eb;\n    background: #ffffff;\n    padding: 16px;\n    border-radius: 8px;\n    margin-top: 16px;\n  }\n  .preview h3 {\n    margin: 0 0 12px 0;\n    color: #374151;\n    font-size: 16px;\n    font-weight: 600;\n  }\n  .preview .content {\n    color: #111827;\n    line-height: 1.6;\n  }\n\n  input[type=\"file\"] {\n    display: none;\n  }\n\n  .mention-dropdown {\n    position: absolute;\n  background: #fff;\n  border: 1px solid #ccc;\n  list-style: none;\n  padding: 4px 0;\n  margin: 0;\n  max-height: 150px;\n  overflow-y: auto;\n  z-index: 100;\n}\n.mention-dropdown li {\n  padding: 4px 12px;\n  cursor: pointer;\n}\n.mention-dropdown li:hover {\n  background: #f0f0f0;\n}\n\n/* styles for the in-editor mentions */\n/* .mention {\n  background-color: #A5D3F3 \n  color: #fff;               \n  padding: 2px 4px;\n  border-radius: 4px;\n  white-space: nowrap;\n} */\n\n/* ensure preview also picks it up */\n/* .preview .mention {\n  background-color: #A5D3F3;\n  color: #fff;\n} */\n\n\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-richtexteditor/nile-richtexteditor.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * 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 { TemplateResult } from 'lit';
+import NileElement from '../internal/nile-element';
+/**
+ * Nile richtexteditor component.
+ *
+ * @tag nile-richtexteditor
+ *
+ */
+export declare class NileRichtexteditor extends NileElement {
+    protected createRenderRoot(): this;
+    /**
+     * The styles for nile-richtexteditor
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    /**
+     * Render method
+     * @slot This is a slot test
+     */
+    render(): TemplateResult;
+}
+export default NileRichtexteditor;
+declare global {
+    interface HTMLElementTagNameMap {
+        'nile-richtexteditor': NileRichtexteditor;
+    }
+}

package/dist/src/nile-richtexteditor/nile-richtexteditor.js

@@ -0,0 +1,46 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * 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 { __decorate } from "tslib";
+import { html } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { styles } from './nile-richtexteditor.css';
+import NileElement from '../internal/nile-element';
+/**
+ * Nile richtexteditor component.
+ *
+ * @tag nile-richtexteditor
+ *
+ */
+let NileRichtexteditor = class NileRichtexteditor extends NileElement {
+    createRenderRoot() {
+        return this;
+    }
+    /**
+     * The styles for nile-richtexteditor
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    /* #endregion */
+    /* #region Methods */
+    /**
+     * Render method
+     * @slot This is a slot test
+     */
+    render() {
+        return html `
+		 <style>
+    ${styles}
+  </style>
+			<slot> </slot>
+			`;
+    }
+};
+NileRichtexteditor = __decorate([
+    customElement('nile-richtexteditor')
+], NileRichtexteditor);
+export { NileRichtexteditor };
+export default NileRichtexteditor;
+//# sourceMappingURL=nile-richtexteditor.js.map

package/dist/src/nile-richtexteditor/nile-richtexteditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-richtexteditor.js","sourceRoot":"","sources":["../../../src/nile-richtexteditor/nile-richtexteditor.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAAa,IAAI,EAAiC,MAAM,KAAK,CAAC;AACrE,OAAO,EAAE,aAAa,EAAW,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAC,MAAM,EAAC,MAAM,2BAA2B,CAAC;AACjD,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAYnD;;;;;GAKG;AAEI,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,WAAW;IAExC,gBAAgB;QACzB,OAAO,IAAI,CAAC;IACX,CAAC;IAEH;;;OAGG;IAGH,gBAAgB;IAEhB,qBAAqB;IAErB;;;OAGG;IACI,MAAM;QACZ,OAAO,IAAI,CAAA;;MAEP,MAAM;;;IAGR,CAAC;IACJ,CAAC;CAGD,CAAA;AA9BY,kBAAkB;IAD9B,aAAa,CAAC,qBAAqB,CAAC;GACxB,kBAAkB,CA8B9B;;AAED,eAAe,kBAAkB,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\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 {LitElement, html, CSSResultArray, TemplateResult} from 'lit';\nimport { customElement, property} from 'lit/decorators.js';\nimport {styles} from './nile-richtexteditor.css';\nimport NileElement from '../internal/nile-element';\nimport {\n\tMentionItem,\n\tMentionsConfig,\n\tsaveSelection,\n\trestoreSelection,\n\tcomputeDropdownPosition,\n\tfilterSuggestions,\n\textractCurrentQuery,\n  } from './utils/nile-mention';\n\n\n/**\n * Nile richtexteditor component.\n *\n * @tag nile-richtexteditor\n *\n */\n@customElement('nile-richtexteditor')\nexport class NileRichtexteditor extends NileElement {\n\n\tprotected createRenderRoot() {\n\t\treturn this;\n\t  }\n\n\t/**\n\t * The styles for nile-richtexteditor\n\t * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n\t */\n \n\n\t/* #endregion */\n\n\t/* #region Methods */\n\n\t/**\n\t * Render method\n\t * @slot This is a slot test\n\t */\n\tpublic render(): TemplateResult {\n\t\treturn html`\n\t\t <style>\n    ${styles}\n  </style>\n\t\t\t<slot> </slot>\n\t\t\t`;\n\t}\n\n\t/* #endregion */\n}\n\nexport default NileRichtexteditor;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-richtexteditor': NileRichtexteditor;\n  }\n}"]}

package/dist/src/nile-richtexteditor/utils/nile-mention.d.ts

@@ -0,0 +1,13 @@
+export interface MentionItem {
+    key: string;
+    label: string;
+}
+export type MentionsConfig = Record<string, MentionItem[]>;
+export declare function saveSelection(editor: HTMLElement): void;
+export declare function restoreSelection(): void;
+export declare function computeDropdownPosition(editor: HTMLElement, trigger: string): {
+    x: number;
+    y: number;
+} | null;
+export declare function filterSuggestions(suggestions: MentionItem[], query: string): MentionItem[];
+export declare function extractCurrentQuery(editor: HTMLElement, trigger: string): string | null;

package/dist/src/nile-richtexteditor/utils/nile-mention.js

@@ -0,0 +1,47 @@
+// src/utils/mention-utils.ts
+let _lastRange = null;
+export function saveSelection(editor) {
+    const sel = window.getSelection();
+    if (sel && sel.rangeCount) {
+        _lastRange = sel.getRangeAt(0).cloneRange();
+    }
+}
+export function restoreSelection() {
+    const sel = window.getSelection();
+    sel?.removeAllRanges();
+    if (_lastRange)
+        sel?.addRange(_lastRange);
+}
+export function computeDropdownPosition(editor, trigger) {
+    if (!_lastRange)
+        return null;
+    const caretRange = _lastRange.cloneRange();
+    caretRange.collapse(false);
+    const rects = caretRange.getClientRects();
+    if (!rects.length)
+        return null;
+    const caretRect = rects[0];
+    const container = editor.closest('.editor-container');
+    const anchorRect = container
+        ? container.getBoundingClientRect()
+        : editor.getBoundingClientRect();
+    const x = caretRect.left - anchorRect.left + (editor.scrollLeft || 0);
+    const y = caretRect.bottom - anchorRect.top + (editor.scrollTop || 0);
+    return { x, y };
+}
+export function filterSuggestions(suggestions, query) {
+    const q = query.trim().toLowerCase();
+    return suggestions.filter(item => item.label.toLowerCase().startsWith(q));
+}
+export function extractCurrentQuery(editor, trigger) {
+    const sel = window.getSelection();
+    if (!sel || !sel.anchorNode)
+        return null;
+    const text = sel.anchorNode.textContent || '';
+    const idx = text.lastIndexOf(trigger);
+    if (idx >= 0) {
+        return text.substring(idx + 1);
+    }
+    return null;
+}
+//# sourceMappingURL=nile-mention.js.map