@things-factory/ai-dashboard 0.0.0-stage → 10.1.213

package/dist-client/components/card-dialogs.js

@@ -0,0 +1,457 @@
+import { __decorate, __metadata } from "tslib";
+/*
+ * The small forms a card opens - what to change with the assistant, a new name, whom to share it with, and its
+ * versions (ADR-0160 decisions 7, 9). Each changes one card through its own door and tells an open dashboard.
+ */
+import '@material/web/icon/icon.js';
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import { LitElement, css, html, nothing } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { i18next, localize } from '@operato/i18n';
+import { notify, openPopup } from '@operato/layout';
+import { askAssistant } from '@things-factory/ai-assistant/dist-client/index.js';
+import { cardApi, dashboardChanged } from '../utils/card-api.js';
+const t = (key, options = {}) => String(i18next.t(key, options));
+const FormStyles = css `
+  :host {
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+    padding: 16px 20px 20px;
+    color: var(--ui-ink, var(--md-sys-color-on-surface));
+    font-size: var(--ui-t-body, 13px);
+    line-height: 1.5;
+  }
+
+  p.lead {
+    margin: 0;
+    color: var(--ui-muted, var(--md-sys-color-on-surface-variant));
+  }
+
+  textarea,
+  input[type='text'],
+  input[type='search'] {
+    box-sizing: border-box;
+    width: 100%;
+    padding: 9px 12px;
+    border: 1px solid var(--ui-line, var(--md-sys-color-outline-variant));
+    border-radius: 8px;
+    background: var(--ui-panel, var(--md-sys-color-surface-container-lowest));
+    color: inherit;
+    font: inherit;
+  }
+
+  textarea {
+    min-height: 88px;
+    resize: vertical;
+  }
+
+  textarea:focus,
+  input:focus {
+    outline: 2px solid color-mix(in srgb, var(--ui-accent, var(--md-sys-color-primary)) 40%, transparent);
+    border-color: var(--ui-accent, var(--md-sys-color-primary));
+  }
+
+  .hints {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 6px;
+  }
+
+  .hints button {
+    padding: 4px 10px;
+    border: 1px solid var(--ui-line, var(--md-sys-color-outline-variant));
+    border-radius: 999px;
+    background: transparent;
+    color: var(--ui-muted, var(--md-sys-color-on-surface-variant));
+    font: inherit;
+    font-size: var(--ui-t-small, 12px);
+    cursor: pointer;
+  }
+
+  .hints button:hover {
+    border-color: var(--ui-accent, var(--md-sys-color-primary));
+    color: var(--ui-accent, var(--md-sys-color-primary));
+  }
+
+  .actions {
+    display: flex;
+    justify-content: flex-end;
+    gap: 8px;
+  }
+
+  h5 {
+    margin: 6px 0 0;
+    font-size: var(--ui-t-small, 12px);
+    font-weight: 600;
+    color: var(--ui-muted, var(--md-sys-color-on-surface-variant));
+    text-transform: none;
+  }
+
+  label.option {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 8px 10px;
+    border: 1px solid var(--ui-line-soft, var(--md-sys-color-outline-variant));
+    border-radius: 8px;
+    cursor: pointer;
+  }
+
+  label.option small {
+    margin-left: auto;
+    color: var(--ui-faint, var(--md-sys-color-on-surface-variant));
+  }
+
+  .people {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+  }
+
+  .person {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 6px 10px;
+    border-radius: 8px;
+    background: var(--ui-panel-2, var(--md-sys-color-surface-container-low));
+    --md-icon-size: 16px;
+  }
+
+  .person small {
+    color: var(--ui-faint, var(--md-sys-color-on-surface-variant));
+  }
+
+  .person button,
+  .found button {
+    margin-left: auto;
+    border: 0;
+    background: transparent;
+    color: var(--ui-accent, var(--md-sys-color-primary));
+    font: inherit;
+    cursor: pointer;
+  }
+
+  .found {
+    display: flex;
+    flex-direction: column;
+    border: 1px solid var(--ui-line-soft, var(--md-sys-color-outline-variant));
+    border-radius: 8px;
+  }
+
+  .found div {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 6px 10px;
+  }
+
+  .found div + div {
+    border-top: 1px solid var(--ui-line-soft, var(--md-sys-color-outline-variant));
+  }
+
+  .note {
+    margin: 0;
+    font-size: var(--ui-t-small, 12px);
+    color: var(--ui-faint, var(--md-sys-color-on-surface-variant));
+  }
+
+  ol.versions {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+  }
+
+  ol.versions li {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    padding: 10px 12px;
+    border: 1px solid var(--ui-line-soft, var(--md-sys-color-outline-variant));
+    border-radius: 8px;
+  }
+
+  ol.versions .v {
+    flex: none;
+    min-width: 36px;
+    font-weight: 650;
+    font-variant-numeric: tabular-nums;
+    color: var(--ui-accent, var(--md-sys-color-primary));
+  }
+
+  ol.versions .what {
+    flex: 1;
+    min-width: 0;
+  }
+
+  ol.versions small {
+    display: block;
+    color: var(--ui-faint, var(--md-sys-color-on-surface-variant));
+  }
+`;
+/** What to change in a card - sent to the conversation beside the page with the card picked, as a screen request. */
+let CardAiForm = class CardAiForm extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.text = '';
+    }
+    static { this.styles = FormStyles; }
+    render() {
+        const hints = ['ai-dashboard.ai.hint-period', 'ai-dashboard.ai.hint-top', 'ai-dashboard.ai.hint-line', 'ai-dashboard.ai.hint-table'];
+        return html `<p class="lead">${t('ai-dashboard.ai.lead', { name: this.card.name })}</p>
+      <textarea .value=${this.text} placeholder=${t('ai-dashboard.ai.placeholder')} @input=${(e) => (this.text = e.target.value)} @keydown=${(e) => e.key === 'Enter' && (e.metaKey || e.ctrlKey) && this.send()}></textarea>
+      <div class="hints">${hints.map(key => html `<button @click=${() => (this.text = t(key))}>${t(key)}</button>`)}</div>
+      <div class="actions">
+        <md-text-button @click=${() => this.close()}>${t('ai-dashboard.button.cancel')}</md-text-button>
+        <md-filled-button ?disabled=${!this.text.trim()} @click=${() => this.send()}>${t('ai-dashboard.ai.send')}</md-filled-button>
+      </div>`;
+    }
+    close() {
+        this.dispatchEvent(new CustomEvent('done', { bubbles: true, composed: true }));
+    }
+    send() {
+        if (!this.text.trim())
+            return;
+        /* Closed first: the dock opens over the page, and a popup that is no longer the top one refuses to close. */
+        this.close();
+        askAssistant({
+            ask: t('ai-dashboard.ai.ask', { name: this.card.name, version: this.card.version, change: this.text.trim() }),
+            selection: { title: t('ai-dashboard.title'), list: 'dashboardCards', records: [{ id: this.card.id, label: this.card.name }] }
+        });
+    }
+};
+__decorate([
+    property({ attribute: false }),
+    __metadata("design:type", Object)
+], CardAiForm.prototype, "card", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], CardAiForm.prototype, "text", void 0);
+CardAiForm = __decorate([
+    customElement('ai-dashboard-card-ai-form')
+], CardAiForm);
+export { CardAiForm };
+/** A card's new name - a new version. */
+let CardRenameForm = class CardRenameForm extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.name = '';
+    }
+    static { this.styles = FormStyles; }
+    connectedCallback() {
+        super.connectedCallback();
+        this.name = this.card?.name ?? '';
+    }
+    render() {
+        return html `<input type="text" .value=${this.name} maxlength="100" @input=${(e) => (this.name = e.target.value)} @keydown=${(e) => e.key === 'Enter' && this.save()} />
+      <div class="actions">
+        <md-text-button @click=${() => this.close()}>${t('ai-dashboard.button.cancel')}</md-text-button>
+        <md-filled-button ?disabled=${!this.name.trim() || this.name.trim() === this.card.name} @click=${() => this.save()}>${t('ai-dashboard.button.save')}</md-filled-button>
+      </div>`;
+    }
+    close() {
+        this.dispatchEvent(new CustomEvent('done', { bubbles: true, composed: true }));
+    }
+    async save() {
+        try {
+            await cardApi.rename(this.card.id, this.name.trim());
+            dashboardChanged();
+            this.close();
+        }
+        catch (error) {
+            notify({ level: 'error', message: error?.message ?? String(error) });
+        }
+    }
+};
+__decorate([
+    property({ attribute: false }),
+    __metadata("design:type", Object)
+], CardRenameForm.prototype, "card", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], CardRenameForm.prototype, "name", void 0);
+CardRenameForm = __decorate([
+    customElement('ai-dashboard-card-rename-form')
+], CardRenameForm);
+export { CardRenameForm };
+/** Whom one's own card is shared with - the whole domain, one's own departments, people found by name. */
+let CardShareForm = class CardShareForm extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.shares = [];
+        this.found = [];
+        this.search = '';
+    }
+    static { this.styles = FormStyles; }
+    async connectedCallback() {
+        super.connectedCallback();
+        this.shares = [...(this.card?.shares ?? [])].map(({ scope, targetId, targetName }) => ({ scope, targetId, targetName }));
+        try {
+            this.options = await cardApi.shareOptions();
+        }
+        catch (error) {
+            notify({ level: 'error', message: error?.message ?? String(error) });
+        }
+    }
+    has(scope, id) {
+        return this.shares.some(one => one.scope === scope && one.targetId === id);
+    }
+    toggle(share, on) {
+        this.shares = on ? [...this.shares.filter(one => !(one.scope === share.scope && one.targetId === share.targetId)), share] : this.shares.filter(one => !(one.scope === share.scope && one.targetId === share.targetId));
+    }
+    find(text) {
+        this.search = text;
+        clearTimeout(this.searching);
+        this.searching = setTimeout(async () => {
+            try {
+                this.found = text.trim() ? await cardApi.people(text.trim()) : [];
+            }
+            catch {
+                this.found = [];
+            }
+        }, 250);
+    }
+    render() {
+        const options = this.options;
+        const people = this.shares.filter(one => one.scope === 'USER');
+        return html `<p class="lead">${t('ai-dashboard.share.lead')}</p>
+      ${options
+            ? html `<h5>${t('ai-dashboard.share.everyone-title')}</h5>
+            <label class="option">
+              <input type="checkbox" .checked=${this.has('DOMAIN', options.domainId)} @change=${(e) => this.toggle({ scope: 'DOMAIN', targetId: options.domainId, targetName: options.domainName }, e.target.checked)} />
+              <md-icon>domain</md-icon>${t('ai-dashboard.share.everyone-in', { name: options.domainName })}
+            </label>
+            ${options.departmentsAvailable && options.departments.length
+                ? html `<h5>${t('ai-dashboard.share.departments')}</h5>
+                  ${options.departments.map(one => html `<label class="option">
+                      <input type="checkbox" .checked=${this.has('DEPARTMENT', one.id)} @change=${(e) => this.toggle({ scope: 'DEPARTMENT', targetId: one.id, targetName: one.name }, e.target.checked)} />
+                      <md-icon>groups</md-icon>${one.name}<small>${t('ai-dashboard.share.department-members')}</small>
+                    </label>`)}`
+                : nothing}
+            <h5>${t('ai-dashboard.share.people')}</h5>
+            ${people.length
+                ? html `<div class="people">
+                  ${people.map(one => html `<div class="person"><md-icon>person</md-icon>${one.targetName ?? one.targetId}<button @click=${() => this.toggle(one, false)}>${t('ai-dashboard.share.remove')}</button></div>`)}
+                </div>`
+                : nothing}
+            ${options.peopleAvailable
+                ? html `<input type="search" .value=${this.search} placeholder=${t('ai-dashboard.share.find-person')} @input=${(e) => this.find(e.target.value)} />
+                  ${this.found.length
+                    ? html `<div class="found">
+                        ${this.found
+                        .filter(one => !this.has('USER', one.id))
+                        .map(one => html `<div><md-icon>person_add</md-icon>${one.name} ${one.note ? html `<small>${one.note}</small>` : nothing}<button @click=${() => this.toggle({ scope: 'USER', targetId: one.id, targetName: one.name }, true)}>${t('ai-dashboard.share.add')}</button></div>`)}
+                      </div>`
+                    : nothing}`
+                : html `<p class="note">${t('ai-dashboard.share.people-unavailable')}</p>`}
+            <p class="note">${t('ai-dashboard.share.rule')}</p>`
+            : nothing}
+      <div class="actions">
+        <md-text-button @click=${() => this.close()}>${t('ai-dashboard.button.cancel')}</md-text-button>
+        <md-filled-button ?disabled=${!options} @click=${() => this.save()}>${t('ai-dashboard.button.save')}</md-filled-button>
+      </div>`;
+    }
+    close() {
+        this.dispatchEvent(new CustomEvent('done', { bubbles: true, composed: true }));
+    }
+    async save() {
+        try {
+            await cardApi.share(this.card.id, this.shares);
+            notify({ level: 'info', message: t(this.shares.length ? 'ai-dashboard.text.shared' : 'ai-dashboard.text.private', { name: this.card.name }) });
+            dashboardChanged();
+            this.close();
+        }
+        catch (error) {
+            notify({ level: 'error', message: error?.message ?? String(error) });
+        }
+    }
+};
+__decorate([
+    property({ attribute: false }),
+    __metadata("design:type", Object)
+], CardShareForm.prototype, "card", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], CardShareForm.prototype, "options", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], CardShareForm.prototype, "shares", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], CardShareForm.prototype, "found", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], CardShareForm.prototype, "search", void 0);
+CardShareForm = __decorate([
+    customElement('ai-dashboard-card-share-form')
+], CardShareForm);
+export { CardShareForm };
+/** One's own card's versions, newest first - an earlier one comes back as a new version. */
+let CardVersions = class CardVersions extends localize(i18next)(LitElement) {
+    static { this.styles = FormStyles; }
+    async connectedCallback() {
+        super.connectedCallback();
+        try {
+            this.versions = await cardApi.versions(this.card.id);
+        }
+        catch (error) {
+            notify({ level: 'error', message: error?.message ?? String(error) });
+        }
+    }
+    render() {
+        const view = (definition) => t(`ai-dashboard.view.${definition?.view?.kind ?? 'table'}`);
+        return html `<p class="lead">${t('ai-dashboard.versions.lead')}</p>
+      <ol class="versions">
+        ${(this.versions ?? []).map(one => html `<li>
+            <span class="v">v${one.version}</span>
+            <span class="what">${one.name}<small>${view(one.definition)} · ${one.creatorName ?? ''} · ${one.createdAt ? new Date(one.createdAt).toLocaleString(i18next.language) : ''}</small></span>
+            ${one.version === this.card.version
+            ? html `<small>${t('ai-dashboard.versions.current')}</small>`
+            : html `<md-text-button @click=${() => this.restore(one.version)}>${t('ai-dashboard.versions.restore')}</md-text-button>`}
+          </li>`)}
+      </ol>`;
+    }
+    async restore(version) {
+        try {
+            await cardApi.restore(this.card.id, version);
+            notify({ level: 'info', message: t('ai-dashboard.text.restored', { version }) });
+            dashboardChanged();
+            this.dispatchEvent(new CustomEvent('done', { bubbles: true, composed: true }));
+        }
+        catch (error) {
+            notify({ level: 'error', message: error?.message ?? String(error) });
+        }
+    }
+};
+__decorate([
+    property({ attribute: false }),
+    __metadata("design:type", Object)
+], CardVersions.prototype, "card", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], CardVersions.prototype, "versions", void 0);
+CardVersions = __decorate([
+    customElement('ai-dashboard-card-versions')
+], CardVersions);
+export { CardVersions };
+function open(template, title, size = 'small') {
+    const popup = openPopup(html `<div @done=${() => popup?.close?.()}>${template}</div>`, { backdrop: true, size, title });
+    return popup;
+}
+export const openCardAiPrompt = (card) => open(html `<ai-dashboard-card-ai-form .card=${card}></ai-dashboard-card-ai-form>`, t('ai-dashboard.card.ai'), 'medium');
+export const openCardRename = (card) => open(html `<ai-dashboard-card-rename-form .card=${card}></ai-dashboard-card-rename-form>`, t('ai-dashboard.card.rename'));
+export const openCardShare = (card) => open(html `<ai-dashboard-card-share-form .card=${card}></ai-dashboard-card-share-form>`, t('ai-dashboard.share.title', { name: card.name }), 'medium');
+export const openCardVersions = (card) => open(html `<ai-dashboard-card-versions .card=${card}></ai-dashboard-card-versions>`, t('ai-dashboard.card.versions'), 'medium');
+//# sourceMappingURL=card-dialogs.js.map

package/dist-client/components/card-dialogs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-dialogs.js","sourceRoot":"","sources":["../../client/components/card-dialogs.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * The small forms a card opens - what to change with the assistant, a new name, whom to share it with, and its\n * versions (ADR-0160 decisions 7, 9). Each changes one card through its own door and tells an open dashboard.\n */\nimport '@material/web/icon/icon.js'\nimport '@material/web/button/filled-button.js'\nimport '@material/web/button/text-button.js'\n\nimport { LitElement, css, html, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { notify, openPopup } from '@operato/layout'\nimport { askAssistant } from '@things-factory/ai-assistant/dist-client/index.js'\n\nimport { cardApi, dashboardChanged, type CardItem, type CardShare } from '../utils/card-api.js'\n\nconst t = (key: string, options: Record<string, unknown> = {}) => String(i18next.t(key, options))\n\nconst FormStyles = css`\n  :host {\n    display: flex;\n    flex-direction: column;\n    gap: 14px;\n    padding: 16px 20px 20px;\n    color: var(--ui-ink, var(--md-sys-color-on-surface));\n    font-size: var(--ui-t-body, 13px);\n    line-height: 1.5;\n  }\n\n  p.lead {\n    margin: 0;\n    color: var(--ui-muted, var(--md-sys-color-on-surface-variant));\n  }\n\n  textarea,\n  input[type='text'],\n  input[type='search'] {\n    box-sizing: border-box;\n    width: 100%;\n    padding: 9px 12px;\n    border: 1px solid var(--ui-line, var(--md-sys-color-outline-variant));\n    border-radius: 8px;\n    background: var(--ui-panel, var(--md-sys-color-surface-container-lowest));\n    color: inherit;\n    font: inherit;\n  }\n\n  textarea {\n    min-height: 88px;\n    resize: vertical;\n  }\n\n  textarea:focus,\n  input:focus {\n    outline: 2px solid color-mix(in srgb, var(--ui-accent, var(--md-sys-color-primary)) 40%, transparent);\n    border-color: var(--ui-accent, var(--md-sys-color-primary));\n  }\n\n  .hints {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 6px;\n  }\n\n  .hints button {\n    padding: 4px 10px;\n    border: 1px solid var(--ui-line, var(--md-sys-color-outline-variant));\n    border-radius: 999px;\n    background: transparent;\n    color: var(--ui-muted, var(--md-sys-color-on-surface-variant));\n    font: inherit;\n    font-size: var(--ui-t-small, 12px);\n    cursor: pointer;\n  }\n\n  .hints button:hover {\n    border-color: var(--ui-accent, var(--md-sys-color-primary));\n    color: var(--ui-accent, var(--md-sys-color-primary));\n  }\n\n  .actions {\n    display: flex;\n    justify-content: flex-end;\n    gap: 8px;\n  }\n\n  h5 {\n    margin: 6px 0 0;\n    font-size: var(--ui-t-small, 12px);\n    font-weight: 600;\n    color: var(--ui-muted, var(--md-sys-color-on-surface-variant));\n    text-transform: none;\n  }\n\n  label.option {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 8px 10px;\n    border: 1px solid var(--ui-line-soft, var(--md-sys-color-outline-variant));\n    border-radius: 8px;\n    cursor: pointer;\n  }\n\n  label.option small {\n    margin-left: auto;\n    color: var(--ui-faint, var(--md-sys-color-on-surface-variant));\n  }\n\n  .people {\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n  }\n\n  .person {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 6px 10px;\n    border-radius: 8px;\n    background: var(--ui-panel-2, var(--md-sys-color-surface-container-low));\n    --md-icon-size: 16px;\n  }\n\n  .person small {\n    color: var(--ui-faint, var(--md-sys-color-on-surface-variant));\n  }\n\n  .person button,\n  .found button {\n    margin-left: auto;\n    border: 0;\n    background: transparent;\n    color: var(--ui-accent, var(--md-sys-color-primary));\n    font: inherit;\n    cursor: pointer;\n  }\n\n  .found {\n    display: flex;\n    flex-direction: column;\n    border: 1px solid var(--ui-line-soft, var(--md-sys-color-outline-variant));\n    border-radius: 8px;\n  }\n\n  .found div {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 6px 10px;\n  }\n\n  .found div + div {\n    border-top: 1px solid var(--ui-line-soft, var(--md-sys-color-outline-variant));\n  }\n\n  .note {\n    margin: 0;\n    font-size: var(--ui-t-small, 12px);\n    color: var(--ui-faint, var(--md-sys-color-on-surface-variant));\n  }\n\n  ol.versions {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n  }\n\n  ol.versions li {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 10px 12px;\n    border: 1px solid var(--ui-line-soft, var(--md-sys-color-outline-variant));\n    border-radius: 8px;\n  }\n\n  ol.versions .v {\n    flex: none;\n    min-width: 36px;\n    font-weight: 650;\n    font-variant-numeric: tabular-nums;\n    color: var(--ui-accent, var(--md-sys-color-primary));\n  }\n\n  ol.versions .what {\n    flex: 1;\n    min-width: 0;\n  }\n\n  ol.versions small {\n    display: block;\n    color: var(--ui-faint, var(--md-sys-color-on-surface-variant));\n  }\n`\n\n/** What to change in a card - sent to the conversation beside the page with the card picked, as a screen request. */\n@customElement('ai-dashboard-card-ai-form')\nexport class CardAiForm extends localize(i18next)(LitElement) {\n  static styles = FormStyles\n  @property({ attribute: false }) card!: CardItem\n  @state() private text = ''\n\n  render() {\n    const hints = ['ai-dashboard.ai.hint-period', 'ai-dashboard.ai.hint-top', 'ai-dashboard.ai.hint-line', 'ai-dashboard.ai.hint-table']\n    return html`<p class=\"lead\">${t('ai-dashboard.ai.lead', { name: this.card.name })}</p>\n      <textarea .value=${this.text} placeholder=${t('ai-dashboard.ai.placeholder')} @input=${(e: any) => (this.text = e.target.value)} @keydown=${(e: KeyboardEvent) => e.key === 'Enter' && (e.metaKey || e.ctrlKey) && this.send()}></textarea>\n      <div class=\"hints\">${hints.map(key => html`<button @click=${() => (this.text = t(key))}>${t(key)}</button>`)}</div>\n      <div class=\"actions\">\n        <md-text-button @click=${() => this.close()}>${t('ai-dashboard.button.cancel')}</md-text-button>\n        <md-filled-button ?disabled=${!this.text.trim()} @click=${() => this.send()}>${t('ai-dashboard.ai.send')}</md-filled-button>\n      </div>`\n  }\n\n  private close() {\n    this.dispatchEvent(new CustomEvent('done', { bubbles: true, composed: true }))\n  }\n\n  private send() {\n    if (!this.text.trim()) return\n    /* Closed first: the dock opens over the page, and a popup that is no longer the top one refuses to close. */\n    this.close()\n    askAssistant({\n      ask: t('ai-dashboard.ai.ask', { name: this.card.name, version: this.card.version, change: this.text.trim() }),\n      selection: { title: t('ai-dashboard.title'), list: 'dashboardCards', records: [{ id: this.card.id, label: this.card.name }] }\n    })\n  }\n}\n\n/** A card's new name - a new version. */\n@customElement('ai-dashboard-card-rename-form')\nexport class CardRenameForm extends localize(i18next)(LitElement) {\n  static styles = FormStyles\n  @property({ attribute: false }) card!: CardItem\n  @state() private name = ''\n\n  connectedCallback() {\n    super.connectedCallback()\n    this.name = this.card?.name ?? ''\n  }\n\n  render() {\n    return html`<input type=\"text\" .value=${this.name} maxlength=\"100\" @input=${(e: any) => (this.name = e.target.value)} @keydown=${(e: KeyboardEvent) => e.key === 'Enter' && this.save()} />\n      <div class=\"actions\">\n        <md-text-button @click=${() => this.close()}>${t('ai-dashboard.button.cancel')}</md-text-button>\n        <md-filled-button ?disabled=${!this.name.trim() || this.name.trim() === this.card.name} @click=${() => this.save()}>${t('ai-dashboard.button.save')}</md-filled-button>\n      </div>`\n  }\n\n  private close() {\n    this.dispatchEvent(new CustomEvent('done', { bubbles: true, composed: true }))\n  }\n\n  private async save() {\n    try {\n      await cardApi.rename(this.card.id, this.name.trim())\n      dashboardChanged()\n      this.close()\n    } catch (error: any) {\n      notify({ level: 'error', message: error?.message ?? String(error) })\n    }\n  }\n}\n\n/** Whom one's own card is shared with - the whole domain, one's own departments, people found by name. */\n@customElement('ai-dashboard-card-share-form')\nexport class CardShareForm extends localize(i18next)(LitElement) {\n  static styles = FormStyles\n  @property({ attribute: false }) card!: CardItem\n  @state() private options?: Awaited<ReturnType<typeof cardApi.shareOptions>>\n  @state() private shares: CardShare[] = []\n  @state() private found: { id: string; name: string; note?: string }[] = []\n  @state() private search = ''\n  private searching?: ReturnType<typeof setTimeout>\n\n  async connectedCallback() {\n    super.connectedCallback()\n    this.shares = [...(this.card?.shares ?? [])].map(({ scope, targetId, targetName }) => ({ scope, targetId, targetName }))\n    try {\n      this.options = await cardApi.shareOptions()\n    } catch (error: any) {\n      notify({ level: 'error', message: error?.message ?? String(error) })\n    }\n  }\n\n  private has(scope: string, id: string) {\n    return this.shares.some(one => one.scope === scope && one.targetId === id)\n  }\n\n  private toggle(share: CardShare, on: boolean) {\n    this.shares = on ? [...this.shares.filter(one => !(one.scope === share.scope && one.targetId === share.targetId)), share] : this.shares.filter(one => !(one.scope === share.scope && one.targetId === share.targetId))\n  }\n\n  private find(text: string) {\n    this.search = text\n    clearTimeout(this.searching)\n    this.searching = setTimeout(async () => {\n      try {\n        this.found = text.trim() ? await cardApi.people(text.trim()) : []\n      } catch {\n        this.found = []\n      }\n    }, 250)\n  }\n\n  render() {\n    const options = this.options\n    const people = this.shares.filter(one => one.scope === 'USER')\n    return html`<p class=\"lead\">${t('ai-dashboard.share.lead')}</p>\n      ${options\n        ? html`<h5>${t('ai-dashboard.share.everyone-title')}</h5>\n            <label class=\"option\">\n              <input type=\"checkbox\" .checked=${this.has('DOMAIN', options.domainId)} @change=${(e: any) => this.toggle({ scope: 'DOMAIN', targetId: options.domainId, targetName: options.domainName }, e.target.checked)} />\n              <md-icon>domain</md-icon>${t('ai-dashboard.share.everyone-in', { name: options.domainName })}\n            </label>\n            ${options.departmentsAvailable && options.departments.length\n              ? html`<h5>${t('ai-dashboard.share.departments')}</h5>\n                  ${options.departments.map(\n                    one => html`<label class=\"option\">\n                      <input type=\"checkbox\" .checked=${this.has('DEPARTMENT', one.id)} @change=${(e: any) => this.toggle({ scope: 'DEPARTMENT', targetId: one.id, targetName: one.name }, e.target.checked)} />\n                      <md-icon>groups</md-icon>${one.name}<small>${t('ai-dashboard.share.department-members')}</small>\n                    </label>`\n                  )}`\n              : nothing}\n            <h5>${t('ai-dashboard.share.people')}</h5>\n            ${people.length\n              ? html`<div class=\"people\">\n                  ${people.map(one => html`<div class=\"person\"><md-icon>person</md-icon>${one.targetName ?? one.targetId}<button @click=${() => this.toggle(one, false)}>${t('ai-dashboard.share.remove')}</button></div>`)}\n                </div>`\n              : nothing}\n            ${options.peopleAvailable\n              ? html`<input type=\"search\" .value=${this.search} placeholder=${t('ai-dashboard.share.find-person')} @input=${(e: any) => this.find(e.target.value)} />\n                  ${this.found.length\n                    ? html`<div class=\"found\">\n                        ${this.found\n                          .filter(one => !this.has('USER', one.id))\n                          .map(one => html`<div><md-icon>person_add</md-icon>${one.name} ${one.note ? html`<small>${one.note}</small>` : nothing}<button @click=${() => this.toggle({ scope: 'USER', targetId: one.id, targetName: one.name }, true)}>${t('ai-dashboard.share.add')}</button></div>`)}\n                      </div>`\n                    : nothing}`\n              : html`<p class=\"note\">${t('ai-dashboard.share.people-unavailable')}</p>`}\n            <p class=\"note\">${t('ai-dashboard.share.rule')}</p>`\n        : nothing}\n      <div class=\"actions\">\n        <md-text-button @click=${() => this.close()}>${t('ai-dashboard.button.cancel')}</md-text-button>\n        <md-filled-button ?disabled=${!options} @click=${() => this.save()}>${t('ai-dashboard.button.save')}</md-filled-button>\n      </div>`\n  }\n\n  private close() {\n    this.dispatchEvent(new CustomEvent('done', { bubbles: true, composed: true }))\n  }\n\n  private async save() {\n    try {\n      await cardApi.share(this.card.id, this.shares)\n      notify({ level: 'info', message: t(this.shares.length ? 'ai-dashboard.text.shared' : 'ai-dashboard.text.private', { name: this.card.name }) })\n      dashboardChanged()\n      this.close()\n    } catch (error: any) {\n      notify({ level: 'error', message: error?.message ?? String(error) })\n    }\n  }\n}\n\n/** One's own card's versions, newest first - an earlier one comes back as a new version. */\n@customElement('ai-dashboard-card-versions')\nexport class CardVersions extends localize(i18next)(LitElement) {\n  static styles = FormStyles\n  @property({ attribute: false }) card!: CardItem\n  @state() private versions?: Awaited<ReturnType<typeof cardApi.versions>>\n\n  async connectedCallback() {\n    super.connectedCallback()\n    try {\n      this.versions = await cardApi.versions(this.card.id)\n    } catch (error: any) {\n      notify({ level: 'error', message: error?.message ?? String(error) })\n    }\n  }\n\n  render() {\n    const view = (definition: any) => t(`ai-dashboard.view.${definition?.view?.kind ?? 'table'}`)\n    return html`<p class=\"lead\">${t('ai-dashboard.versions.lead')}</p>\n      <ol class=\"versions\">\n        ${(this.versions ?? []).map(\n          one => html`<li>\n            <span class=\"v\">v${one.version}</span>\n            <span class=\"what\">${one.name}<small>${view(one.definition)} · ${one.creatorName ?? ''} · ${one.createdAt ? new Date(one.createdAt).toLocaleString(i18next.language) : ''}</small></span>\n            ${one.version === this.card.version\n              ? html`<small>${t('ai-dashboard.versions.current')}</small>`\n              : html`<md-text-button @click=${() => this.restore(one.version)}>${t('ai-dashboard.versions.restore')}</md-text-button>`}\n          </li>`\n        )}\n      </ol>`\n  }\n\n  private async restore(version: number) {\n    try {\n      await cardApi.restore(this.card.id, version)\n      notify({ level: 'info', message: t('ai-dashboard.text.restored', { version }) })\n      dashboardChanged()\n      this.dispatchEvent(new CustomEvent('done', { bubbles: true, composed: true }))\n    } catch (error: any) {\n      notify({ level: 'error', message: error?.message ?? String(error) })\n    }\n  }\n}\n\nfunction open(template: unknown, title: string, size: 'small' | 'medium' = 'small') {\n  const popup: any = openPopup(html`<div @done=${() => popup?.close?.()}>${template}</div>`, { backdrop: true, size, title })\n  return popup\n}\n\nexport const openCardAiPrompt = (card: CardItem) => open(html`<ai-dashboard-card-ai-form .card=${card}></ai-dashboard-card-ai-form>`, t('ai-dashboard.card.ai'), 'medium')\nexport const openCardRename = (card: CardItem) => open(html`<ai-dashboard-card-rename-form .card=${card}></ai-dashboard-card-rename-form>`, t('ai-dashboard.card.rename'))\nexport const openCardShare = (card: CardItem) => open(html`<ai-dashboard-card-share-form .card=${card}></ai-dashboard-card-share-form>`, t('ai-dashboard.share.title', { name: card.name }), 'medium')\nexport const openCardVersions = (card: CardItem) => open(html`<ai-dashboard-card-versions .card=${card}></ai-dashboard-card-versions>`, t('ai-dashboard.card.versions'), 'medium')\n"]}

package/dist-client/components/card-library.d.ts

@@ -0,0 +1,23 @@
+import '@material/web/icon/icon.js';
+import '@material/web/button/filled-tonal-button.js';
+import '@material/web/button/text-button.js';
+import { LitElement } from 'lit';
+declare const CardLibrary_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+export declare class CardLibrary extends CardLibrary_base {
+    static styles: import("lit").CSSResult;
+    private which;
+    private cards?;
+    private error?;
+    private onChanged;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private load;
+    private show;
+    render(): import("lit-html").TemplateResult<1>;
+    private renderCard;
+    private place;
+    private copy;
+    private deleteCard;
+    private attempt;
+}
+export {};