anentrypoint-design 0.0.28 → 0.0.29

package/src/markdown.js

@@ -0,0 +1,61 @@
+import { register } from './debug.js';
+
+let _marked = null;
+let _purify = null;
+let _stats = { renders: 0, sanitizedTags: 0 };
+
+async function loadMarked() {
+    if (_marked) return _marked;
+    const mod = await import('https://cdn.jsdelivr.net/npm/marked@15.0.7/lib/marked.esm.js');
+    _marked = mod.marked;
+    _marked.setOptions({ breaks: true, gfm: true });
+    return _marked;
+}
+
+async function loadPurify() {
+    if (_purify) return _purify;
+    const mod = await import('https://cdn.jsdelivr.net/npm/dompurify@3.4.1/+esm');
+    _purify = mod.default || mod;
+    if (!_purify.sanitize) throw new Error('dompurify did not load a sanitize fn');
+    _purify.addHook('uponSanitizeElement', (node, data) => {
+        if (data.tagName && data.allowedTags && !data.allowedTags[data.tagName]) _stats.sanitizedTags += 1;
+    });
+    return _purify;
+}
+
+let _ready = null;
+export function ensureReady() {
+    if (_ready) return _ready;
+    _ready = Promise.all([loadMarked(), loadPurify()]).then(() => true);
+    return _ready;
+}
+
+export async function renderMarkdown(text) {
+    const [marked, purify] = await Promise.all([loadMarked(), loadPurify()]);
+    const dirty = marked.parse(String(text || ''));
+    const clean = purify.sanitize(dirty, {
+        FORBID_TAGS: ['script', 'iframe', 'object', 'embed', 'form'],
+        FORBID_ATTR: ['onerror', 'onclick', 'onload', 'onmouseover'],
+        ADD_ATTR: ['target', 'rel']
+    });
+    _stats.renders += 1;
+    return clean;
+}
+
+export function renderMarkdownSync(text) {
+    if (!_marked || !_purify) return null;
+    const dirty = _marked.parse(String(text || ''));
+    const clean = _purify.sanitize(dirty, {
+        FORBID_TAGS: ['script', 'iframe', 'object', 'embed', 'form'],
+        FORBID_ATTR: ['onerror', 'onclick', 'onload', 'onmouseover'],
+        ADD_ATTR: ['target', 'rel']
+    });
+    _stats.renders += 1;
+    return clean;
+}
+
+register('markdown', () => ({
+    loaded: { marked: !!_marked, dompurify: !!_purify },
+    renders: _stats.renders,
+    sanitizedTags: _stats.sanitizedTags
+}));

package/src/web-components/ds-chat.js

@@ -0,0 +1,75 @@
+import * as webjsx from '../../vendor/webjsx/index.js';
+import { Chat, ChatComposer } from '../components/chat.js';
+import { register } from '../debug.js';
+
+let _stats = { mounts: 0, sends: 0 };
+
+class DsChat extends HTMLElement {
+    static get observedAttributes() { return ['title', 'sub', 'placeholder']; }
+
+    constructor() {
+        super();
+        this._messages = [];
+        this._draft = '';
+        this._title = 'chat';
+        this._sub = '';
+        this._placeholder = 'message…';
+    }
+
+    set messages(v) { this._messages = Array.isArray(v) ? v : []; this._render(); }
+    get messages() { return this._messages; }
+
+    connectedCallback() {
+        if (this.hasAttribute('messages')) {
+            try { this._messages = JSON.parse(this.getAttribute('messages')); } catch {}
+        }
+        this._title = this.getAttribute('title') || this._title;
+        this._sub = this.getAttribute('sub') || '';
+        this._placeholder = this.getAttribute('placeholder') || this._placeholder;
+        _stats.mounts += 1;
+        this._render();
+    }
+
+    attributeChangedCallback(name, _old, val) {
+        if (name === 'title') this._title = val || 'chat';
+        if (name === 'sub') this._sub = val || '';
+        if (name === 'placeholder') this._placeholder = val || 'message…';
+        this._render();
+    }
+
+    pushMessage(msg) {
+        this._messages = [...this._messages, msg];
+        this._render();
+    }
+
+    _render() {
+        const onSend = (text) => {
+            _stats.sends += 1;
+            this.dispatchEvent(new CustomEvent('send', { detail: { text }, bubbles: true, composed: true }));
+        };
+        const onInput = (v) => { this._draft = v; this._render(); };
+        const view = Chat({
+            title: this._title,
+            sub: this._sub,
+            messages: this._messages,
+            composer: ChatComposer({
+                value: this._draft,
+                placeholder: this._placeholder,
+                onInput,
+                onSend
+            })
+        });
+        webjsx.applyDiff(this, view);
+    }
+}
+
+let _registered = false;
+export function registerChatElement() {
+    if (_registered) return;
+    if (!customElements.get('ds-chat')) customElements.define('ds-chat', DsChat);
+    _registered = true;
+}
+
+register('ds-chat', () => ({ registered: _registered, ..._stats, instances: document.querySelectorAll('ds-chat').length }));
+
+export { DsChat };