@tuprolog/arg2p-ui 0.0.0-stage → 0.1.0

package/dist/components/arg2p-flags.js

@@ -0,0 +1,358 @@
+import { LitElement, css, html, nothing } from 'lit';
+import { DEFAULT_PROFILE, DEFAULTS, FLAG_GROUPS, PROFILES, profileInfo } from '../flags/schema.js';
+import { statedFlags, statedProfile, withNone, withSwitch, withValues, without } from '../flags/text.js';
+import { tokens } from '../theme.js';
+// How long the flags and the theory are let be before the engine is asked what is in effect
+const SETTLE = 250;
+/**
+ * The flags of the solver, as controls over their text (Prolog facts, the source of truth: every change rewrites the
+ * lines of its flag alone). The profile comes first: it presets the flags its framework needs, and the flags that mean
+ * something for it are shown, the others folded away. Every flag shows the value in effect for the theory, as the
+ * engine tells it, and where it comes from: the theory (which wins: it is changed in the theory), the flags, the
+ * profile, or the default. A flag the flags state can be reset, to take the value of the profile again.
+ *
+ * Events: `arg2p-flags-change` with the flags, after every change made with the controls.
+ */
+export class Arg2pFlags extends LitElement {
+    constructor() {
+        super(...arguments);
+        /** The flags, as Prolog facts */
+        this.flags = '';
+        /** The theory the flags are for: it may state flags, and its profile */
+        this.theory = '';
+        /** What tells the settings in effect; without it, the panel shows what the flags state */
+        this.engine = null;
+        this.settings = null;
+        this.asked = 0;
+    }
+    static { this.properties = {
+        flags: {},
+        theory: {},
+        engine: { attribute: false },
+        settings: { state: true },
+    }; }
+    updated(changed) {
+        if (changed.has('flags') || changed.has('theory') || changed.has('engine'))
+            this.ask();
+        // the value of a select set once its options are there (as rendered, some DOMs pick another)
+        this.renderRoot.querySelectorAll('select[data-value]').forEach(it => {
+            it.value = it.dataset.value;
+        });
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        clearTimeout(this.timer);
+    }
+    // The settings in effect, asked once the typing settles: a later answer wins
+    ask() {
+        clearTimeout(this.timer);
+        const engine = this.engine;
+        if (engine === null) {
+            this.settings = null;
+            return;
+        }
+        this.timer = setTimeout(() => {
+            const asked = ++this.asked;
+            engine.settings(this.theory, this.flags).then(settings => {
+                if (asked === this.asked)
+                    this.settings = settings;
+            }, () => {
+                if (asked === this.asked)
+                    this.settings = null;
+            });
+        }, SETTLE);
+    }
+    /** The values in effect of [flag], and where they come from */
+    effective(flag) {
+        const fromTheory = statedFlags(this.theory).get(flag.name);
+        const fromFlags = statedFlags(this.flags).get(flag.name);
+        const fallback = DEFAULTS[flag.name] ?? [];
+        const values = this.settings?.[flag.name] ?? fromTheory ?? fromFlags ?? fallback;
+        const same = (a, b) => a.length === b.length && [...a].sort().every((it, i) => it === [...b].sort()[i]);
+        const source = fromTheory !== undefined ? 'theory'
+            : fromFlags !== undefined && same(values, fromFlags) ? 'flags'
+                : same(values, fallback) ? 'default'
+                    : 'profile';
+        return { values, source };
+    }
+    profile() {
+        const fromTheory = statedProfile(this.theory);
+        const name = this.settings?.graphBuildMode?.[0] ?? fromTheory ?? statedProfile(this.flags) ?? DEFAULT_PROFILE;
+        return { name, source: fromTheory !== null ? 'theory' : statedProfile(this.flags) !== null ? 'flags' : 'default' };
+    }
+    change(flags) {
+        this.flags = flags;
+        this.dispatchEvent(new CustomEvent('arg2p-flags-change', { detail: { flags }, bubbles: true, composed: true }));
+    }
+    set(flag, values) {
+        if (flag.kind === 'switch')
+            this.change(withSwitch(this.flags, flag.name, values.length > 0));
+        else if (flag.kind === 'set' && values.length === 0)
+            this.change(withNone(this.flags, flag.name));
+        else if (values.length === 0)
+            this.change(without(this.flags, flag.name));
+        else
+            this.change(withValues(this.flags, flag.name, values));
+    }
+    /** What the panel finds wrong with the flags in effect */
+    warnings() {
+        const all = FLAG_GROUPS.flatMap(group => group.flags);
+        const warnings = all
+            .filter(flag => flag.required && this.effective(flag).values.length === 0)
+            .map(flag => `${flag.label} has no value: the solver needs one.`);
+        const value = (name) => this.effective({ name }).values[0];
+        if (value('orderingComparator') === 'normal' && value('orderingPrinciple') === 'weakest') {
+            warnings.push('The normal comparator goes with the last link alone: with the weakest link the evaluation raises an error.');
+        }
+        return warnings;
+    }
+    render() {
+        const profile = this.profile();
+        const info = profileInfo(profile.name);
+        const relevant = FLAG_GROUPS.filter(group => info === undefined || info.groups.includes(group.id));
+        const others = FLAG_GROUPS.filter(group => !relevant.includes(group));
+        const warnings = this.warnings();
+        return html `
+            <section class="profile">
+                <label class="row">
+                    <span class="name">Profile</span>
+                    <select
+                        data-value=${profile.name}
+                        ?disabled=${profile.source === 'theory'}
+                        @change=${(e) => this.change(withValues(this.flags, 'graphBuildMode', [e.target.value]))}
+                    >
+                        ${PROFILES.map(it => html `<option value=${it.name} ?selected=${it.name === profile.name}>${it.label}</option>`)}
+                        ${info === undefined ? html `<option selected value=${profile.name}>${profile.name}</option>` : nothing}
+                    </select>
+                    ${this.badge(profile.source)}
+                </label>
+                <p class="help">
+                    ${info?.help ?? 'A profile this version of the panel does not know.'}
+                    ${profile.source === 'theory' ? html `<br /><em>The theory states it: change it there.</em>` : nothing}
+                </p>
+            </section>
+            ${warnings.length > 0 ? html `<ul class="warnings" role="alert">${warnings.map(it => html `<li>${it}</li>`)}</ul>` : nothing}
+            ${relevant.map(group => this.group(group))}
+            ${others.length > 0
+            ? html `
+                      <details class="others">
+                          <summary>Other flags <span class="muted">(${others.map(it => it.title.toLowerCase()).join(', ')}: preset by the profile)</span></summary>
+                          ${others.map(group => this.group(group))}
+                      </details>
+                  `
+            : nothing}
+        `;
+    }
+    group(group) {
+        return html `
+            <fieldset class="group">
+                <legend>${group.title}</legend>
+                ${group.flags.map(flag => this.flag(flag))}
+            </fieldset>
+        `;
+    }
+    flag(flag) {
+        const { values, source } = this.effective(flag);
+        const locked = source === 'theory';
+        const stated = statedFlags(this.flags).has(flag.name);
+        const id = `flag-${flag.name}`;
+        let control;
+        if (flag.kind === 'switch') {
+            control = html `<input id=${id} type="checkbox" .checked=${values.length > 0} ?disabled=${locked} @change=${(e) => this.set(flag, e.target.checked ? ['true'] : [])} />`;
+        }
+        else if (flag.kind === 'choice') {
+            control = html `
+                <select id=${id} data-value=${values[0] ?? ''} ?disabled=${locked} @change=${(e) => this.set(flag, [e.target.value])}>
+                    ${values.length === 0 ? html `<option selected disabled value="">none</option>` : nothing}
+                    ${flag.options.map(it => html `<option value=${it.value} title=${it.help} ?selected=${values[0] === it.value}>${it.label}</option>`)}
+                </select>
+            `;
+        }
+        else if (flag.kind === 'set') {
+            control = html `
+                <div class="set" id=${id} role="group" aria-label=${flag.label}>
+                    ${flag.options.map(it => html `
+                            <label title=${it.help}>
+                                <input
+                                    type="checkbox"
+                                    value=${it.value}
+                                    .checked=${values.includes(it.value)}
+                                    ?disabled=${locked}
+                                    @change=${(e) => {
+                const on = e.target.checked;
+                this.set(flag, on ? [...values.filter(v => v !== it.value), it.value] : values.filter(v => v !== it.value));
+            }}
+                                />
+                                ${it.label}
+                            </label>
+                        `)}
+                </div>
+            `;
+        }
+        else {
+            control = html `<input id=${id} type="text" placeholder=${flag.placeholder ?? ''} .value=${values[0] ?? ''} ?disabled=${locked} @change=${(e) => this.set(flag, [e.target.value])} />`;
+        }
+        const option = flag.options?.find(it => it.value === values[0]);
+        return html `
+            <div class="flag ${flag.kind}" data-flag=${flag.name}>
+                <div class="row">
+                    <label class="name" for=${id} title=${flag.help}>${flag.label}</label>
+                    ${flag.kind === 'set' ? nothing : control}
+                    ${this.badge(source)}
+                    ${stated && !locked ? html `<button type="button" class="reset" title="Take the value of the profile again (remove it from the flags)" @click=${() => this.change(without(this.flags, flag.name))}>reset</button>` : nothing}
+                </div>
+                ${flag.kind === 'set' ? control : nothing}
+                <p class="help">
+                    ${flag.kind === 'choice' && option !== undefined ? option.help : flag.help}
+                    ${stated && source === 'profile' ? html `<br /><em>The flags state its default, which the profile overrides: state it in the theory to keep it.</em>` : nothing}
+                </p>
+            </div>
+        `;
+    }
+    badge(source) {
+        const titles = {
+            theory: 'Stated by the theory',
+            flags: 'Stated by the flags',
+            profile: 'Preset by the profile',
+            default: 'The default',
+        };
+        return html `<span class="badge ${source}" title=${titles[source]}>${source}</span>`;
+    }
+    static { this.styles = [
+        tokens,
+        css `
+            :host {
+                display: block;
+                font-size: 13px;
+            }
+            .profile {
+                padding: 8px 0;
+            }
+            .row {
+                display: flex;
+                align-items: center;
+                gap: 8px;
+            }
+            /* a flag: its name, its control, where its value comes from, and the reset */
+            .flag .row {
+                display: grid;
+                grid-template-columns: minmax(7em, 10em) minmax(0, 1fr) auto auto;
+            }
+            .flag.set .row {
+                grid-template-columns: minmax(7em, 10em) auto auto 1fr;
+            }
+            .flag .row > select,
+            .flag .row > input[type='text'] {
+                min-width: 0;
+                width: 100%;
+            }
+            .flag .row > input[type='checkbox'] {
+                justify-self: start;
+                margin: 0;
+            }
+            .name {
+                font-weight: 600;
+            }
+            .profile select {
+                flex: 1;
+                min-width: 0;
+            }
+            select,
+            input[type='text'] {
+                font: inherit;
+                color: var(--_text);
+                background: var(--_surface);
+                border: 1px solid var(--_border);
+                border-radius: 4px;
+                padding: 2px 4px;
+            }
+            input[type='text'] {
+                font-family: var(--_mono);
+            }
+            select:disabled,
+            input:disabled {
+                opacity: 0.7;
+            }
+            .help {
+                margin: 2px 0 0 0;
+                color: var(--_muted);
+                font-size: 12px;
+            }
+            .group {
+                border: 1px solid var(--_border);
+                border-radius: 6px;
+                margin: 8px 0;
+                padding: 4px 10px 8px 10px;
+            }
+            legend {
+                font-weight: 600;
+                padding: 0 4px;
+            }
+            .flag {
+                padding: 6px 0;
+            }
+            .flag + .flag {
+                border-top: 1px dashed var(--_border);
+            }
+            .set {
+                display: flex;
+                flex-wrap: wrap;
+                gap: 4px 14px;
+                margin-top: 4px;
+            }
+            .set label {
+                display: inline-flex;
+                align-items: center;
+                gap: 4px;
+            }
+            .badge {
+                font-size: 10px;
+                text-transform: uppercase;
+                letter-spacing: 0.04em;
+                border-radius: 4px;
+                padding: 0 5px;
+                border: 1px solid var(--_border);
+                color: var(--_muted);
+            }
+            .badge.flags {
+                color: var(--_accent);
+                border-color: var(--_accent);
+            }
+            .badge.theory {
+                color: #ffffff;
+                background: var(--_accent);
+                border-color: var(--_accent);
+            }
+            .badge.profile {
+                border-style: dashed;
+            }
+            .reset {
+                font: inherit;
+                font-size: 11px;
+                color: var(--_muted);
+                background: none;
+                border: none;
+                text-decoration: underline;
+                cursor: pointer;
+                padding: 0;
+            }
+            .warnings {
+                margin: 4px 0;
+                padding: 6px 10px 6px 24px;
+                border-left: 3px solid var(--_no);
+                background: color-mix(in srgb, var(--_no) 12%, transparent);
+                border-radius: 4px;
+            }
+            .others summary {
+                cursor: pointer;
+                padding: 6px 0;
+            }
+            .muted {
+                color: var(--_muted);
+                font-size: 12px;
+            }
+        `,
+    ]; }
+}
+customElements.define('arg2p-flags', Arg2pFlags);
+//# sourceMappingURL=arg2p-flags.js.map

package/dist/components/arg2p-flags.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"arg2p-flags.js","sourceRoot":"","sources":["../../src/components/arg2p-flags.ts"],"names":[],"mappings":"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"}

package/dist/components/arg2p-framework.d.ts

@@ -0,0 +1,102 @@
+import type { Core } from 'cytoscape';
+import { LitElement, type PropertyValues } from 'lit';
+import type { GraphData } from '../engine.js';
+import type { Framework } from '../formats/frameworks.js';
+import { type Positions } from '../graph/positions.js';
+/**
+ * An abstract framework drawn: the arguments and attacks its theory (of the profile abstract) declares, as nodes and
+ * arrows. Drawing writes the theory: an argument added is a fact `a.`, an attack `a -> b.`; deleting or renaming one
+ * changes its declaration, and every other clause of the theory (those that derive attacks, say) stays as it is.
+ * The theory edited as text is drawn again, the arguments kept where they were.
+ *
+ * Given the graph of a solution, the arguments take the colours of their labels, and what the theory derives without
+ * declaring it is drawn too, dashed: it changes with the clauses that derive it, not by drawing.
+ *
+ * Events: `arg2p-theory-change` with the theory, after every change made by drawing; `arg2p-export` with the picture
+ * of the framework, as for the graph.
+ */
+export declare class Arg2pFramework extends LitElement {
+    static properties: {
+        theory: {};
+        graph: {
+            attribute: boolean;
+        };
+        positions: {
+            attribute: boolean;
+        };
+        readonly: {
+            type: BooleanConstructor;
+            reflect: boolean;
+        };
+        fileName: {
+            attribute: string;
+        };
+        mode: {
+            state: boolean;
+        };
+        selected: {
+            state: boolean;
+        };
+        renaming: {
+            state: boolean;
+        };
+        source: {
+            state: boolean;
+        };
+        derived: {
+            state: boolean;
+        };
+    };
+    /** The theory drawn */
+    theory: string;
+    /** The graph of a solution of [theory], to show its labels and what it derives; null when there is none */
+    graph: GraphData | null;
+    /** Where the arguments are, by name: shared with the graph of the framework (see arg2p-positions) */
+    positions: Positions | null;
+    readonly: boolean;
+    /** The name of the picture the framework is saved as, with no extension */
+    fileName: string;
+    private mode;
+    private selected;
+    private renaming;
+    private source;
+    private derived;
+    private cy;
+    private unfollow;
+    private drawn;
+    /** The arguments and attacks the theory declares */
+    framework(): Framework;
+    /** The drawing, for what the element does not do itself (and for tests) */
+    get drawing(): Core | null;
+    /** Fits the drawing to the element (after it was hidden, and so sized to nothing) */
+    fit(): void;
+    /** The framework as a PNG picture, as a data URL */
+    png(): string;
+    protected firstUpdated(): void;
+    protected willUpdate(changed: PropertyValues): void;
+    protected updated(changed: PropertyValues): void;
+    disconnectedCallback(): void;
+    connectedCallback(): void;
+    private draw;
+    private tellPositions;
+    private tap;
+    private pick;
+    private add;
+    private change;
+    private deleteSelected;
+    private setMode;
+    private suggestedName;
+    private isAvailable;
+    private startRename;
+    private commitRename;
+    private placeRename;
+    private onKey;
+    private export;
+    protected render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'arg2p-framework': Arg2pFramework;
+    }
+}