@design.estate/dees-catalog 3.91.0 → 3.92.0

package/dist_ts_web/elements/00group-harness/dees-harness-content-blocks/dees-harness-content-blocks.demo.js

@@ -0,0 +1,41 @@
+import { html } from '@design.estate/dees-element';
+// 1×1 px png (red) as a stand-in for tool screenshot output
+const tinyPngBase64 = 'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAEhQGAhKmMIQAAAABJRU5ErkJggg==';
+const demoBlocks = [
+    { type: 'text', text: 'Query returned 3 rows. Full result set embedded below.' },
+    { type: 'image', data: tinyPngBase64, mimeType: 'image/png' },
+    {
+        type: 'resource',
+        resource: {
+            uri: 'file:///srv/reports/summary.csv',
+            mimeType: 'text/csv',
+            text: 'id,name,status\n1,alpha,ok\n2,beta,ok\n3,gamma,degraded',
+        },
+    },
+    {
+        type: 'resource_link',
+        uri: 'https://example.com/dashboards/deploy-42',
+        name: 'deploy-42',
+        title: 'Deploy #42 dashboard',
+        description: 'Grafana panel for the deploy window',
+        mimeType: 'text/html',
+        size: 12_480,
+    },
+];
+export const demoFunc = () => html `
+  <style>
+    .blocksDemo {
+      display: grid;
+      gap: 16px;
+      max-width: 640px;
+      margin: 40px auto;
+      padding: 24px;
+      border-radius: var(--dees-radius-xl);
+      background: var(--dees-color-bg-secondary);
+    }
+  </style>
+  <div class="blocksDemo">
+    <dees-harness-content-blocks .blocks=${demoBlocks}></dees-harness-content-blocks>
+  </div>
+`;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1oYXJuZXNzLWNvbnRlbnQtYmxvY2tzLmRlbW8uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi90c193ZWIvZWxlbWVudHMvMDBncm91cC1oYXJuZXNzL2RlZXMtaGFybmVzcy1jb250ZW50LWJsb2Nrcy9kZWVzLWhhcm5lc3MtY29udGVudC1ibG9ja3MuZGVtby50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFHbkQsNERBQTREO0FBQzVELE1BQU0sYUFBYSxHQUFHLGtHQUFrRyxDQUFDO0FBRXpILE1BQU0sVUFBVSxHQUEyQjtJQUN6QyxFQUFFLElBQUksRUFBRSxNQUFNLEVBQUUsSUFBSSxFQUFFLHdEQUF3RCxFQUFFO0lBQ2hGLEVBQUUsSUFBSSxFQUFFLE9BQU8sRUFBRSxJQUFJLEVBQUUsYUFBYSxFQUFFLFFBQVEsRUFBRSxXQUFXLEVBQUU7SUFDN0Q7UUFDRSxJQUFJLEVBQUUsVUFBVTtRQUNoQixRQUFRLEVBQUU7WUFDUixHQUFHLEVBQUUsaUNBQWlDO1lBQ3RDLFFBQVEsRUFBRSxVQUFVO1lBQ3BCLElBQUksRUFBRSx5REFBeUQ7U0FDaEU7S0FDRjtJQUNEO1FBQ0UsSUFBSSxFQUFFLGVBQWU7UUFDckIsR0FBRyxFQUFFLDBDQUEwQztRQUMvQyxJQUFJLEVBQUUsV0FBVztRQUNqQixLQUFLLEVBQUUsc0JBQXNCO1FBQzdCLFdBQVcsRUFBRSxxQ0FBcUM7UUFDbEQsUUFBUSxFQUFFLFdBQVc7UUFDckIsSUFBSSxFQUFFLE1BQU07S0FDYjtDQUNGLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxRQUFRLEdBQUcsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFBOzs7Ozs7Ozs7Ozs7OzJDQWFTLFVBQVU7O0NBRXBELENBQUMifQ==

package/dist_ts_web/elements/00group-harness/dees-harness-content-blocks/dees-harness-content-blocks.js

@@ -0,0 +1,215 @@
+var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
+    function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
+    var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
+    var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
+    var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
+    var _, done = false;
+    for (var i = decorators.length - 1; i >= 0; i--) {
+        var context = {};
+        for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
+        for (var p in contextIn.access) context.access[p] = contextIn.access[p];
+        context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
+        var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
+        if (kind === "accessor") {
+            if (result === void 0) continue;
+            if (result === null || typeof result !== "object") throw new TypeError("Object expected");
+            if (_ = accept(result.get)) descriptor.get = _;
+            if (_ = accept(result.set)) descriptor.set = _;
+            if (_ = accept(result.init)) initializers.unshift(_);
+        }
+        else if (_ = accept(result)) {
+            if (kind === "field") initializers.unshift(_);
+            else descriptor[key] = _;
+        }
+    }
+    if (target) Object.defineProperty(target, contextIn.name, descriptor);
+    done = true;
+};
+var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
+    var useValue = arguments.length > 2;
+    for (var i = 0; i < initializers.length; i++) {
+        value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
+    }
+    return useValue ? value : void 0;
+};
+import { demoFunc } from './dees-harness-content-blocks.demo.js';
+import { DeesElement, html, css, customElement, property, cssManager, } from '@design.estate/dees-element';
+import { themeDefaultStyles } from '../../00theme.js';
+import { harnessFormatBytes } from '../harness.helpers.js';
+import { harnessMonoStyles } from '../harness.styles.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
+/**
+ * Structural renderer for MCP CallToolResult content blocks: text, image,
+ * audio, embedded resources, and resource links keep their nature instead of
+ * being flattened to strings.
+ */
+let DeesHarnessContentBlocks = (() => {
+    let _classDecorators = [customElement('dees-harness-content-blocks')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = DeesElement;
+    let _blocks_decorators;
+    let _blocks_initializers = [];
+    let _blocks_extraInitializers = [];
+    var DeesHarnessContentBlocks = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _blocks_decorators = [property({ attribute: false })];
+            __esDecorate(this, null, _blocks_decorators, { kind: "accessor", name: "blocks", static: false, private: false, access: { has: obj => "blocks" in obj, get: obj => obj.blocks, set: (obj, value) => { obj.blocks = value; } }, metadata: _metadata }, _blocks_initializers, _blocks_extraInitializers);
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            DeesHarnessContentBlocks = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        static demo = demoFunc;
+        static demoGroups = ['Agent Chat'];
+        #blocks_accessor_storage = __runInitializers(this, _blocks_initializers, []);
+        get blocks() { return this.#blocks_accessor_storage; }
+        set blocks(value) { this.#blocks_accessor_storage = value; }
+        static styles = [
+            themeDefaultStyles,
+            cssManager.defaultStyles,
+            harnessMonoStyles,
+            css `
+      :host {
+        display: grid;
+        gap: var(--dees-spacing-sm);
+        font-family: var(--dees-font-family);
+      }
+
+      .textBlock {
+        color: var(--dees-color-text-primary);
+        white-space: pre-wrap;
+        overflow-wrap: anywhere;
+        font-size: var(--dees-font-control-size-sm, 12px);
+        line-height: 1.5;
+      }
+
+      img {
+        display: block;
+        max-width: 100%;
+        max-height: 420px;
+        border-radius: var(--dees-radius-md);
+        border: 1px solid var(--dees-color-border-subtle);
+      }
+
+      audio {
+        width: 100%;
+      }
+
+      .resourceLink {
+        display: flex;
+        align-items: center;
+        gap: var(--dees-spacing-sm);
+        padding: var(--dees-spacing-xs) var(--dees-spacing-sm);
+        border: 1px solid var(--dees-color-border-subtle);
+        border-radius: var(--dees-radius-md);
+        corner-shape: var(--dees-corner-shape);
+        background: var(--dees-color-bg-tertiary);
+        color: var(--dees-color-text-primary);
+        text-decoration: none;
+        font-size: var(--dees-font-control-size-sm, 12px);
+      }
+
+      .resourceLink:hover {
+        background: var(--dees-color-hover);
+      }
+
+      .resourceLink dees-icon {
+        color: var(--dees-color-accent-primary);
+      }
+
+      .resourceInfo {
+        min-width: 0;
+      }
+
+      .resourceName {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        font-weight: 500;
+      }
+
+      .resourceMeta {
+        margin-top: 1px;
+        color: var(--dees-color-text-secondary);
+        font-size: var(--dees-font-caption1-size, 11px);
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .resourceUri {
+        color: var(--dees-color-text-muted);
+        font-size: var(--dees-font-caption1-size, 11px);
+        font-family: var(--dees-font-family-mono);
+        overflow-wrap: anywhere;
+      }
+    `,
+        ];
+        render() {
+            return html `${this.blocks.map((block) => this.renderBlock(block))}`;
+        }
+        renderBlock(block) {
+            switch (block.type) {
+                case 'text':
+                    return html `<div class="textBlock">${block.text}</div>`;
+                case 'image':
+                    return html `<img src=${`data:${block.mimeType};base64,${block.data}`} alt="tool result image" />`;
+                case 'audio':
+                    return html `<audio controls src=${`data:${block.mimeType};base64,${block.data}`}></audio>`;
+                case 'resource': {
+                    const resource = block.resource;
+                    if (resource.text !== undefined) {
+                        return html `
+            <div>
+              <div class="resourceUri">${resource.uri}</div>
+              <pre class="harness-mono">${resource.text}</pre>
+            </div>
+          `;
+                    }
+                    return html `
+          <a
+            class="resourceLink"
+            href=${`data:${resource.mimeType ?? 'application/octet-stream'};base64,${resource.blob ?? ''}`}
+            download
+          >
+            <dees-icon icon="lucide:FileDown" iconSize="16"></dees-icon>
+            <div class="resourceInfo">
+              <div class="resourceName">${resource.uri}</div>
+              <div class="resourceMeta">${resource.mimeType ?? 'binary resource'}</div>
+            </div>
+          </a>
+        `;
+                }
+                case 'resource_link':
+                    return html `
+          <a class="resourceLink" href=${block.uri} target="_blank" rel="noopener noreferrer">
+            <dees-icon icon="lucide:Link" iconSize="16"></dees-icon>
+            <div class="resourceInfo">
+              <div class="resourceName">${block.title || block.name}</div>
+              <div class="resourceMeta">
+                ${[block.description, block.mimeType, block.size !== undefined ? harnessFormatBytes(block.size) : '']
+                        .filter(Boolean)
+                        .join(' · ') || block.uri}
+              </div>
+            </div>
+          </a>
+        `;
+                default:
+                    return html ``;
+            }
+        }
+        constructor() {
+            super(...arguments);
+            __runInitializers(this, _blocks_extraInitializers);
+        }
+        static {
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+    };
+    return DeesHarnessContentBlocks = _classThis;
+})();
+export { DeesHarnessContentBlocks };
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1oYXJuZXNzLWNvbnRlbnQtYmxvY2tzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vdHNfd2ViL2VsZW1lbnRzLzAwZ3JvdXAtaGFybmVzcy9kZWVzLWhhcm5lc3MtY29udGVudC1ibG9ja3MvZGVlcy1oYXJuZXNzLWNvbnRlbnQtYmxvY2tzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFBQSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sdUNBQXVDLENBQUM7QUFDakUsT0FBTyxFQUNMLFdBQVcsRUFDWCxJQUFJLEVBQ0osR0FBRyxFQUNILGFBQWEsRUFFYixRQUFRLEVBQ1IsVUFBVSxHQUNYLE1BQU0sNkJBQTZCLENBQUM7QUFDckMsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFFdEQsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDM0QsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDekQsT0FBTyw4Q0FBOEMsQ0FBQztBQVF0RDs7OztHQUlHO0lBRVUsd0JBQXdCOzRCQURwQyxhQUFhLENBQUMsNkJBQTZCLENBQUM7Ozs7c0JBQ0MsV0FBVzs7Ozt3Q0FBbkIsU0FBUSxXQUFXOzs7O2tDQUl0RCxRQUFRLENBQUMsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLENBQUM7WUFDL0IsdUtBQVMsTUFBTSw2QkFBTixNQUFNLHVGQUE4QjtZQUwvQyw2S0ErSUM7Ozs7UUE5SVEsTUFBTSxDQUFDLElBQUksR0FBRyxRQUFRLENBQUM7UUFDdkIsTUFBTSxDQUFDLFVBQVUsR0FBRyxDQUFDLFlBQVksQ0FBQyxDQUFDO1FBRzFDLHlFQUEwQyxFQUFFLEVBQUM7UUFBN0MsSUFBUyxNQUFNLDRDQUE4QjtRQUE3QyxJQUFTLE1BQU0sa0RBQThCO1FBRXRDLE1BQU0sQ0FBQyxNQUFNLEdBQUc7WUFDckIsa0JBQWtCO1lBQ2xCLFVBQVUsQ0FBQyxhQUFhO1lBQ3hCLGlCQUFpQjtZQUNqQixHQUFHLENBQUE7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztLQTJFRjtTQUNGLENBQUM7UUFFSyxNQUFNO1lBQ1gsT0FBTyxJQUFJLENBQUEsR0FBRyxJQUFJLENBQUMsTUFBTSxDQUFDLEdBQUcsQ0FBQyxDQUFDLEtBQUssRUFBRSxFQUFFLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxLQUFLLENBQUMsQ0FBQyxFQUFFLENBQUM7UUFDdEUsQ0FBQztRQUVPLFdBQVcsQ0FBQyxLQUEyQjtZQUM3QyxRQUFRLEtBQUssQ0FBQyxJQUFJLEVBQUUsQ0FBQztnQkFDbkIsS0FBSyxNQUFNO29CQUNULE9BQU8sSUFBSSxDQUFBLDBCQUEwQixLQUFLLENBQUMsSUFBSSxRQUFRLENBQUM7Z0JBQzFELEtBQUssT0FBTztvQkFDVixPQUFPLElBQUksQ0FBQSxZQUFZLFFBQVEsS0FBSyxDQUFDLFFBQVEsV0FBVyxLQUFLLENBQUMsSUFBSSxFQUFFLDZCQUE2QixDQUFDO2dCQUNwRyxLQUFLLE9BQU87b0JBQ1YsT0FBTyxJQUFJLENBQUEsdUJBQXVCLFFBQVEsS0FBSyxDQUFDLFFBQVEsV0FBVyxLQUFLLENBQUMsSUFBSSxFQUFFLFdBQVcsQ0FBQztnQkFDN0YsS0FBSyxVQUFVLENBQUMsQ0FBQyxDQUFDO29CQUNoQixNQUFNLFFBQVEsR0FBRyxLQUFLLENBQUMsUUFBUSxDQUFDO29CQUNoQyxJQUFJLFFBQVEsQ0FBQyxJQUFJLEtBQUssU0FBUyxFQUFFLENBQUM7d0JBQ2hDLE9BQU8sSUFBSSxDQUFBOzt5Q0FFb0IsUUFBUSxDQUFDLEdBQUc7MENBQ1gsUUFBUSxDQUFDLElBQUk7O1dBRTVDLENBQUM7b0JBQ0osQ0FBQztvQkFDRCxPQUFPLElBQUksQ0FBQTs7O21CQUdBLFFBQVEsUUFBUSxDQUFDLFFBQVEsSUFBSSwwQkFBMEIsV0FBVyxRQUFRLENBQUMsSUFBSSxJQUFJLEVBQUUsRUFBRTs7Ozs7MENBS2hFLFFBQVEsQ0FBQyxHQUFHOzBDQUNaLFFBQVEsQ0FBQyxRQUFRLElBQUksaUJBQWlCOzs7U0FHdkUsQ0FBQztnQkFDSixDQUFDO2dCQUNELEtBQUssZUFBZTtvQkFDbEIsT0FBTyxJQUFJLENBQUE7eUNBQ3NCLEtBQUssQ0FBQyxHQUFHOzs7MENBR1IsS0FBSyxDQUFDLEtBQUssSUFBSSxLQUFLLENBQUMsSUFBSTs7a0JBRWpELENBQUMsS0FBSyxDQUFDLFdBQVcsRUFBRSxLQUFLLENBQUMsUUFBUSxFQUFFLEtBQUssQ0FBQyxJQUFJLEtBQUssU0FBUyxDQUFDLENBQUMsQ0FBQyxrQkFBa0IsQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQzt5QkFDbEcsTUFBTSxDQUFDLE9BQU8sQ0FBQzt5QkFDZixJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksS0FBSyxDQUFDLEdBQUc7Ozs7U0FJbEMsQ0FBQztnQkFDSjtvQkFDRSxPQUFPLElBQUksQ0FBQSxFQUFFLENBQUM7WUFDbEIsQ0FBQztRQUNILENBQUM7Ozs7OztZQTlJVSx1REFBd0I7Ozs7O1NBQXhCLHdCQUF3QiJ9

package/dist_ts_web/elements/00group-harness/dees-harness-content-blocks/index.d.ts

@@ -0,0 +1 @@
+export * from './dees-harness-content-blocks.js';

package/dist_ts_web/elements/00group-harness/dees-harness-content-blocks/index.js

@@ -0,0 +1,2 @@
+export * from './dees-harness-content-blocks.js';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi90c193ZWIvZWxlbWVudHMvMDBncm91cC1oYXJuZXNzL2RlZXMtaGFybmVzcy1jb250ZW50LWJsb2Nrcy9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLGtDQUFrQyxDQUFDIn0=

package/dist_ts_web/elements/00group-harness/dees-harness-message/dees-harness-message.d.ts

@@ -0,0 +1,58 @@
+import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
+import type { IHarnessMessage, IHarnessUsage } from '../interfaces.js';
+import { DeesHarnessToolRegistry } from '../toolregistry.js';
+import '../dees-harness-reasoning/dees-harness-reasoning.js';
+import '../dees-harness-tool-card/dees-harness-tool-card.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
+declare global {
+    interface HTMLElementTagNameMap {
+        'dees-harness-message': DeesHarnessMessage;
+    }
+}
+/**
+ * One conversation message. The `message` property object is the source of
+ * truth; the streaming fast path (`appendTextDelta` etc.) mutates that same
+ * object and re-renders only this element, so a later wholesale property
+ * re-assignment by the host is idempotent.
+ */
+export declare class DeesHarnessMessage extends DeesElement {
+    static demo: () => TemplateResult<1>;
+    static demoGroups: string[];
+    accessor message: IHarnessMessage;
+    accessor showRole: boolean;
+    accessor showTimestamp: boolean;
+    /** parse markdown during streaming (throttled); plain text otherwise */
+    accessor markdownWhileStreaming: boolean;
+    accessor toolRegistry: DeesHarnessToolRegistry;
+    /**
+     * When true at first render, the entry animation is skipped permanently
+     * for this element (initial-batch rendering). Captured once in
+     * firstUpdated — later property changes must not restart the animation.
+     */
+    accessor suppressEntry: boolean;
+    accessor renderedMarkdownHtml: string;
+    static styles: import("@design.estate/dees-element").CSSResult[];
+    private markdownParseToken;
+    private lastParsedText;
+    private markdownThrottleTimeout;
+    private highlightJs;
+    get markdownActive(): boolean;
+    /** Appends a text delta, mutating the shared message object. */
+    appendTextDelta(delta: string): void;
+    /** Appends to (or creates) a reasoning part by id. */
+    appendReasoningDelta(partId: string, delta: string, startedAt?: number): void;
+    /** Marks a reasoning part as ended. */
+    endReasoning(partId: string, endedAt?: number): void;
+    /** Ends the stream: final markdown parse, usage/error attach. */
+    endStream(usage?: IHarnessUsage, error?: string): void;
+    render(): TemplateResult;
+    private renderText;
+    private renderAttachments;
+    firstUpdated(changedProperties: Map<string, any>): void;
+    updated(changedProperties: Map<string, any>): Promise<void>;
+    private scheduleThrottledParse;
+    private parseMarkdown;
+    /** Lazy hljs pass over rendered fences; runs only after the final parse. */
+    private highlightCodeFences;
+    disconnectedCallback(): Promise<void>;
+}

package/dist_ts_web/elements/00group-harness/dees-harness-message/dees-harness-message.demo.d.ts

@@ -0,0 +1 @@
+export declare const demoFunc: () => import("@design.estate/dees-element").TemplateResult<1>;

package/dist_ts_web/elements/00group-harness/dees-harness-message/dees-harness-message.demo.js

@@ -0,0 +1,126 @@
+import { html } from '@design.estate/dees-element';
+const markdownSample = [
+    '## Findings',
+    '',
+    'The failing test compares against a **stale fixture**. Two options:',
+    '',
+    '1. Regenerate the fixture from the current schema',
+    '2. Pin the schema version in the test setup',
+    '',
+    '| Option | Effort | Risk |',
+    '| --- | --- | --- |',
+    '| Regenerate | low | drifts again |',
+    '| Pin version | medium | stays honest |',
+    '',
+    '```typescript',
+    'const fixture = await loadFixture({ schemaVersion: 3 });',
+    'expect(result).toEqual(fixture);',
+    '```',
+    '',
+    'I recommend pinning — see [the docs](https://example.com/docs).',
+].join('\n');
+const streamSource = 'Let me look at the build output. The bundler resolved the entry, but the **css tokens** were emitted twice — once from the theme and once from the component. Deduplicating the emission fixes the double-border artifact you saw.';
+const startStreamingDemo = (event) => {
+    const container = event.target.closest('.messageDemo');
+    const target = container?.querySelector('#streamingMessage');
+    if (!target)
+        return;
+    target.message = {
+        id: 'streaming-demo',
+        role: 'assistant',
+        text: '',
+        createdAt: Date.now(),
+        streaming: true,
+    };
+    target.requestUpdate();
+    let offset = 0;
+    const interval = setInterval(() => {
+        const chunk = streamSource.slice(offset, offset + 6);
+        offset += 6;
+        if (!chunk) {
+            clearInterval(interval);
+            target.endStream({ inputTokens: 412, outputTokens: 96, totalTokens: 508 });
+            return;
+        }
+        target.appendTextDelta(chunk);
+    }, 40);
+};
+export const demoFunc = () => html `
+  <style>
+    .messageDemo {
+      display: grid;
+      gap: 16px;
+      max-width: 720px;
+      margin: 40px auto;
+      padding: 24px;
+      border-radius: var(--dees-radius-xl);
+      background: var(--dees-color-bg-primary);
+    }
+  </style>
+  <div class="messageDemo">
+    <dees-harness-message
+      .message=${{
+    id: 'u1',
+    role: 'user',
+    text: 'Why does the badge render with a double border in dark mode?',
+    createdAt: Date.now() - 90_000,
+    attachments: [
+        {
+            id: 'a1',
+            name: 'screenshot.png',
+            mediaType: 'image/png',
+            size: 48_213,
+            kind: 'image',
+        },
+        {
+            id: 'a2',
+            name: 'build.log',
+            mediaType: 'text/plain',
+            size: 5_120,
+            kind: 'text',
+            truncated: true,
+        },
+    ],
+}}
+      showTimestamp
+    ></dees-harness-message>
+    <dees-harness-message
+      .message=${{
+    id: 'a1',
+    role: 'assistant',
+    text: markdownSample,
+    createdAt: Date.now() - 60_000,
+    reasoning: [
+        {
+            id: 'r1',
+            text: 'Compare fixture timestamps against the schema migration dates first.',
+            startedAt: Date.now() - 64_000,
+            endedAt: Date.now() - 61_500,
+        },
+    ],
+    usage: { inputTokens: 1200, outputTokens: 340, totalTokens: 1540 },
+}}
+    ></dees-harness-message>
+    <dees-harness-message
+      .message=${{
+    id: 'e1',
+    role: 'assistant',
+    text: '',
+    createdAt: Date.now() - 30_000,
+    error: 'The model endpoint returned 429 — retry in 20s.',
+}}
+    ></dees-harness-message>
+    <dees-button @clicked=${startStreamingDemo}>Simulate streaming</dees-button>
+    <dees-harness-message
+      id="streamingMessage"
+      .message=${{
+    id: 'streaming-demo',
+    role: 'assistant',
+    text: 'Press “Simulate streaming” above.',
+    createdAt: Date.now(),
+    markdown: false,
+}}
+    ></dees-harness-message>
+  </div>
+`;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1oYXJuZXNzLW1lc3NhZ2UuZGVtby5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3RzX3dlYi9lbGVtZW50cy8wMGdyb3VwLWhhcm5lc3MvZGVlcy1oYXJuZXNzLW1lc3NhZ2UvZGVlcy1oYXJuZXNzLW1lc3NhZ2UuZGVtby50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFHbkQsTUFBTSxjQUFjLEdBQUc7SUFDckIsYUFBYTtJQUNiLEVBQUU7SUFDRixxRUFBcUU7SUFDckUsRUFBRTtJQUNGLG1EQUFtRDtJQUNuRCw2Q0FBNkM7SUFDN0MsRUFBRTtJQUNGLDRCQUE0QjtJQUM1QixxQkFBcUI7SUFDckIscUNBQXFDO0lBQ3JDLHlDQUF5QztJQUN6QyxFQUFFO0lBQ0YsZUFBZTtJQUNmLDBEQUEwRDtJQUMxRCxrQ0FBa0M7SUFDbEMsS0FBSztJQUNMLEVBQUU7SUFDRixpRUFBaUU7Q0FDbEUsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7QUFFYixNQUFNLFlBQVksR0FBRyxvT0FBb08sQ0FBQztBQUUxUCxNQUFNLGtCQUFrQixHQUFHLENBQUMsS0FBaUIsRUFBRSxFQUFFO0lBQy9DLE1BQU0sU0FBUyxHQUFJLEtBQUssQ0FBQyxNQUFzQixDQUFDLE9BQU8sQ0FBQyxjQUFjLENBQUMsQ0FBQztJQUN4RSxNQUFNLE1BQU0sR0FBRyxTQUFTLEVBQUUsYUFBYSxDQUFxQixtQkFBbUIsQ0FBQyxDQUFDO0lBQ2pGLElBQUksQ0FBQyxNQUFNO1FBQUUsT0FBTztJQUNwQixNQUFNLENBQUMsT0FBTyxHQUFHO1FBQ2YsRUFBRSxFQUFFLGdCQUFnQjtRQUNwQixJQUFJLEVBQUUsV0FBVztRQUNqQixJQUFJLEVBQUUsRUFBRTtRQUNSLFNBQVMsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFO1FBQ3JCLFNBQVMsRUFBRSxJQUFJO0tBQ2hCLENBQUM7SUFD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