@things-factory/learning 0.0.0-stage → 10.1.260

package/dist-client/bootstrap.d.ts

@@ -0,0 +1,2 @@
+import './components/learning-todo.js';
+export default function bootstrap(): void;

package/dist-client/bootstrap.js

@@ -0,0 +1,4 @@
+import './components/learning-todo.js';
+/* The to-do's element registers itself on load - the pages come in through the route when an application puts them in its menu. */
+export default function bootstrap() { }
+//# sourceMappingURL=bootstrap.js.map

package/dist-client/bootstrap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bootstrap.js","sourceRoot":"","sources":["../client/bootstrap.ts"],"names":[],"mappings":"AAAA,OAAO,+BAA+B,CAAA;AAEtC,mIAAmI;AACnI,MAAM,CAAC,OAAO,UAAU,SAAS,KAAI,CAAC","sourcesContent":["import './components/learning-todo.js'\n\n/* The to-do's element registers itself on load - the pages come in through the route when an application puts them in its menu. */\nexport default function bootstrap() {}\n"]}

package/dist-client/components/learning-assign-form.d.ts

@@ -0,0 +1,24 @@
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@operato/popup/ox-popup-actions.js';
+import '@things-factory/announcement/dist-client';
+import { LitElement } from 'lit';
+/** Opens the assignment form of a course. Resolves with how many enrolments it holds now, or null. */
+export declare function openAssignForm(course: {
+    id: string;
+    name: string;
+}): Promise<number | null>;
+declare const LearningAssignForm_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+export declare class LearningAssignForm extends LearningAssignForm_base {
+    static styles: import("lit").CSSResult[];
+    course: {
+        id: string;
+        name: string;
+    };
+    private audiences;
+    private dueOn;
+    private assign;
+    render(): import("lit-html").TemplateResult<1>;
+    private submit;
+}
+export {};

package/dist-client/components/learning-assign-form.js

@@ -0,0 +1,77 @@
+import { __decorate, __metadata } from "tslib";
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@operato/popup/ox-popup-actions.js';
+import '@things-factory/announcement/dist-client';
+import gql from 'graphql-tag';
+import { html, LitElement, nothing } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { MutationController } from '@operato/graphql';
+import { i18next, localize } from '@operato/i18n';
+import { openPopup } from '@operato/layout';
+import { CommonPopupStyles, FormFieldStyles, PopupBodyStyles, PopupFieldStyles } from '@operato/styles';
+import { t } from '../utils/learning-words.js';
+/** Opens the assignment form of a course. Resolves with how many enrolments it holds now, or null. */
+export function openAssignForm(course) {
+    const popup = openPopup(html `<learning-assign-form .course=${course} @assigned=${(e) => popup.close(e.detail)} @close=${() => popup.close()}></learning-assign-form>`, { backdrop: true, size: 'medium', title: t('title.learning-assign', { course: course.name }) });
+    return popup.result.then(value => (value ?? null));
+}
+/*
+ * 수강 배정 (ADR-0194 decision 7) - whom a course is assigned to, by the one audience rule (the domain, departments with
+ * those under them, roles and people - ADR-0163), and the day it is due. Each person gets a to-do.
+ */
+let LearningAssignForm = class LearningAssignForm extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.course = { id: '', name: '' };
+        this.audiences = [];
+        this.dueOn = '';
+        this.assign = new MutationController(this, gql `mutation ($courseId: String!, $audiences: [LearningAudienceInput!]!, $dueOn: String) { assignCourse(courseId: $courseId, audiences: $audiences, dueOn: $dueOn) { id } }`, { showsError: true });
+    }
+    static { this.styles = [CommonPopupStyles, PopupBodyStyles, FormFieldStyles, PopupFieldStyles]; }
+    render() {
+        const error = this.assign.error;
+        return html `
+      <div class="body">
+        <div class="field">
+          <span>${t('field.learning-assign-audience')}</span>
+          <announcement-audience-picker .value=${this.audiences} @change=${(e) => Array.isArray(e.detail) && (this.audiences = e.detail)}></announcement-audience-picker>
+          <span>${t('text.learning-assign-audience-hint')}</span>
+        </div>
+        <label class="field">
+          <span>${t('field.learning-due-on')}</span>
+          <input type="date" .value=${this.dueOn} @input=${(e) => (this.dueOn = e.target.value)} />
+          <span>${t('text.learning-due-on-hint')}</span>
+        </label>
+        ${error ? html `<div class="field"><span invalid role="alert">${error.graphQLErrors?.[0]?.message ?? error.message}</span></div>` : nothing}
+      </div>
+      <ox-popup-actions>
+        <md-text-button slot="cancel" @click=${() => this.dispatchEvent(new CustomEvent('close'))}>${t('button.cancel')}</md-text-button>
+        <md-filled-button slot="confirm" ?disabled=${!this.audiences.length || this.assign.pending} @click=${() => this.submit()}>${t('button.learning-assign')}</md-filled-button>
+      </ox-popup-actions>
+    `;
+    }
+    async submit() {
+        const audiences = this.audiences.map(({ scope, targetId, targetName }) => ({ scope, targetId, targetName }));
+        const done = await this.assign.run({ courseId: this.course.id, audiences, dueOn: this.dueOn || null });
+        if (done)
+            this.dispatchEvent(new CustomEvent('assigned', { detail: done.assignCourse.length }));
+    }
+};
+__decorate([
+    property({ attribute: false }),
+    __metadata("design:type", Object)
+], LearningAssignForm.prototype, "course", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], LearningAssignForm.prototype, "audiences", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], LearningAssignForm.prototype, "dueOn", void 0);
+LearningAssignForm = __decorate([
+    customElement('learning-assign-form')
+], LearningAssignForm);
+export { LearningAssignForm };
+//# sourceMappingURL=learning-assign-form.js.map

package/dist-client/components/learning-assign-form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"learning-assign-form.js","sourceRoot":"","sources":["../../client/components/learning-assign-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/button/filled-button.js'\nimport '@material/web/button/text-button.js'\nimport '@operato/popup/ox-popup-actions.js'\nimport '@things-factory/announcement/dist-client'\n\nimport gql from 'graphql-tag'\nimport { html, LitElement, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { MutationController } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { openPopup } from '@operato/layout'\nimport { CommonPopupStyles, FormFieldStyles, PopupBodyStyles, PopupFieldStyles } from '@operato/styles'\n\nimport { t } from '../utils/learning-words.js'\n\n/** Opens the assignment form of a course. Resolves with how many enrolments it holds now, or null. */\nexport function openAssignForm(course: { id: string; name: string }): Promise<number | null> {\n  const popup = openPopup(html`<learning-assign-form .course=${course} @assigned=${(e: CustomEvent) => popup.close(e.detail)} @close=${() => popup.close()}></learning-assign-form>`, { backdrop: true, size: 'medium', title: t('title.learning-assign', { course: course.name }) })\n  return popup.result.then(value => (value ?? null) as any)\n}\n\n/*\n * 수강 배정 (ADR-0194 decision 7) - whom a course is assigned to, by the one audience rule (the domain, departments with\n * those under them, roles and people - ADR-0163), and the day it is due. Each person gets a to-do.\n */\n@customElement('learning-assign-form')\nexport class LearningAssignForm extends localize(i18next)(LitElement) {\n  static styles = [CommonPopupStyles, PopupBodyStyles, FormFieldStyles, PopupFieldStyles]\n\n  @property({ attribute: false }) course: { id: string; name: string } = { id: '', name: '' }\n  @state() private audiences: { scope: string; targetId: string; targetName?: string }[] = []\n  @state() private dueOn = ''\n\n  private assign = new MutationController(this, gql`mutation ($courseId: String!, $audiences: [LearningAudienceInput!]!, $dueOn: String) { assignCourse(courseId: $courseId, audiences: $audiences, dueOn: $dueOn) { id } }`, { showsError: true })\n\n  render() {\n    const error: any = this.assign.error\n    return html`\n      <div class=\"body\">\n        <div class=\"field\">\n          <span>${t('field.learning-assign-audience')}</span>\n          <announcement-audience-picker .value=${this.audiences} @change=${(e: CustomEvent) => Array.isArray(e.detail) && (this.audiences = e.detail)}></announcement-audience-picker>\n          <span>${t('text.learning-assign-audience-hint')}</span>\n        </div>\n        <label class=\"field\">\n          <span>${t('field.learning-due-on')}</span>\n          <input type=\"date\" .value=${this.dueOn} @input=${(e: any) => (this.dueOn = e.target.value)} />\n          <span>${t('text.learning-due-on-hint')}</span>\n        </label>\n        ${error ? html`<div class=\"field\"><span invalid role=\"alert\">${error.graphQLErrors?.[0]?.message ?? error.message}</span></div>` : nothing}\n      </div>\n      <ox-popup-actions>\n        <md-text-button slot=\"cancel\" @click=${() => this.dispatchEvent(new CustomEvent('close'))}>${t('button.cancel')}</md-text-button>\n        <md-filled-button slot=\"confirm\" ?disabled=${!this.audiences.length || this.assign.pending} @click=${() => this.submit()}>${t('button.learning-assign')}</md-filled-button>\n      </ox-popup-actions>\n    `\n  }\n\n  private async submit() {\n    const audiences = this.audiences.map(({ scope, targetId, targetName }) => ({ scope, targetId, targetName }))\n    const done = await this.assign.run({ courseId: this.course.id, audiences, dueOn: this.dueOn || null })\n    if (done) this.dispatchEvent(new CustomEvent('assigned', { detail: done.assignCourse.length }))\n  }\n}\n"]}

package/dist-client/components/learning-course-form.d.ts

@@ -0,0 +1,29 @@
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@operato/input/ox-input-select-buttons.js';
+import '@operato/popup/ox-popup-actions.js';
+import { LitElement } from 'lit';
+type CourseShape = {
+    id?: string;
+    name?: string;
+    category?: string | null;
+    description?: string | null;
+};
+/** Opens the course form - a new course, or what one says changed. Resolves with the course saved, or null. */
+export declare function openCourseForm(course?: CourseShape): Promise<{
+    id: string;
+} | null>;
+declare const LearningCourseForm_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+export declare class LearningCourseForm extends LearningCourseForm_base {
+    static styles: import("lit").CSSResult[];
+    course: CourseShape;
+    private name;
+    private category;
+    private description;
+    private save;
+    private change;
+    willUpdate(changed: Map<string, unknown>): void;
+    render(): import("lit-html").TemplateResult<1>;
+    private submit;
+}
+export {};

package/dist-client/components/learning-course-form.js

@@ -0,0 +1,104 @@
+import { __decorate, __metadata } from "tslib";
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@operato/input/ox-input-select-buttons.js';
+import '@operato/popup/ox-popup-actions.js';
+import gql from 'graphql-tag';
+import { css, html, LitElement, nothing } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { MutationController } from '@operato/graphql';
+import { i18next, localize } from '@operato/i18n';
+import { openPopup } from '@operato/layout';
+import { CommonPopupStyles, FormFieldStyles, PopupBodyStyles, PopupFieldStyles } from '@operato/styles';
+import { CATEGORIES, categoryWord, t } from '../utils/learning-words.js';
+/** Opens the course form - a new course, or what one says changed. Resolves with the course saved, or null. */
+export function openCourseForm(course = {}) {
+    const popup = openPopup(html `<learning-course-form .course=${course} @saved=${(e) => popup.close(e.detail)} @close=${() => popup.close()}></learning-course-form>`, { backdrop: true, size: 'medium', title: course.id ? t('title.learning-course-edit') : t('title.learning-course-new') });
+    return popup.result.then(value => (value ?? null));
+}
+/* 과정 (ADR-0194 decision 2) - its name, category and description. The house shape of a popup: only the body scrolls, labels above native inputs, one action row. */
+let LearningCourseForm = class LearningCourseForm extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.course = {};
+        this.name = '';
+        this.category = 'MANDATORY';
+        this.description = '';
+        this.save = new MutationController(this, gql `mutation ($course: NewCourse!) { createCourse(course: $course) { id } }`, { showsError: true });
+        this.change = new MutationController(this, gql `mutation ($id: String!, $patch: CoursePatch!) { updateCourse(id: $id, patch: $patch) { id } }`, { showsError: true });
+    }
+    static { this.styles = [
+        CommonPopupStyles,
+        PopupBodyStyles,
+        FormFieldStyles,
+        PopupFieldStyles,
+        css `
+      ox-input-select-buttons {
+        align-self: flex-start;
+      }
+      textarea {
+        min-height: 120px;
+        resize: vertical;
+      }
+    `
+    ]; }
+    willUpdate(changed) {
+        if (changed.has('course')) {
+            this.name = this.course.name ?? '';
+            this.category = this.course.category ?? 'MANDATORY';
+            this.description = this.course.description ?? '';
+        }
+    }
+    render() {
+        const pending = this.save.pending || this.change.pending;
+        const error = this.save.error || this.change.error;
+        return html `
+      <div class="body">
+        <label class="field">
+          <span>${t('field.learning-course-name')}</span>
+          <input .value=${this.name} maxlength="200" required @input=${(e) => (this.name = e.target.value)} />
+        </label>
+        <div class="field">
+          <span>${t('field.learning-course-category')}</span>
+          <ox-input-select-buttons .value=${this.category} .options=${CATEGORIES.map(code => ({ display: categoryWord(code), value: code }))} @change=${(e) => e.detail && (this.category = e.detail)}></ox-input-select-buttons>
+        </div>
+        <label class="field">
+          <span>${t('field.learning-course-description')}</span>
+          <textarea .value=${this.description} @input=${(e) => (this.description = e.target.value)}></textarea>
+        </label>
+        ${error ? html `<div class="field"><span invalid role="alert">${error.graphQLErrors?.[0]?.message ?? error.message}</span></div>` : nothing}
+      </div>
+      <ox-popup-actions>
+        <md-text-button slot="cancel" @click=${() => this.dispatchEvent(new CustomEvent('close'))}>${t('button.cancel')}</md-text-button>
+        <md-filled-button slot="confirm" ?disabled=${!this.name.trim() || pending} @click=${() => this.submit()}>${t('button.save')}</md-filled-button>
+      </ox-popup-actions>
+    `;
+    }
+    async submit() {
+        const fields = { name: this.name.trim(), category: this.category, description: this.description.trim() || null };
+        const done = this.course.id ? (await this.change.run({ id: this.course.id, patch: fields }))?.updateCourse : (await this.save.run({ course: fields }))?.createCourse;
+        if (done)
+            this.dispatchEvent(new CustomEvent('saved', { detail: done }));
+    }
+};
+__decorate([
+    property({ attribute: false }),
+    __metadata("design:type", Object)
+], LearningCourseForm.prototype, "course", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], LearningCourseForm.prototype, "name", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], LearningCourseForm.prototype, "category", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], LearningCourseForm.prototype, "description", void 0);
+LearningCourseForm = __decorate([
+    customElement('learning-course-form')
+], LearningCourseForm);
+export { LearningCourseForm };
+//# sourceMappingURL=learning-course-form.js.map

package/dist-client/components/learning-course-form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"learning-course-form.js","sourceRoot":"","sources":["../../client/components/learning-course-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/button/filled-button.js'\nimport '@material/web/button/text-button.js'\nimport '@operato/input/ox-input-select-buttons.js'\nimport '@operato/popup/ox-popup-actions.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { MutationController } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { openPopup } from '@operato/layout'\nimport { CommonPopupStyles, FormFieldStyles, PopupBodyStyles, PopupFieldStyles } from '@operato/styles'\n\nimport { CATEGORIES, categoryWord, t } from '../utils/learning-words.js'\n\ntype CourseShape = { id?: string; name?: string; category?: string | null; description?: string | null }\n\n/** Opens the course form - a new course, or what one says changed. Resolves with the course saved, or null. */\nexport function openCourseForm(course: CourseShape = {}): Promise<{ id: string } | null> {\n  const popup = openPopup(html`<learning-course-form .course=${course} @saved=${(e: CustomEvent) => popup.close(e.detail)} @close=${() => popup.close()}></learning-course-form>`, { backdrop: true, size: 'medium', title: course.id ? t('title.learning-course-edit') : t('title.learning-course-new') })\n  return popup.result.then(value => (value ?? null) as any)\n}\n\n/* 과정 (ADR-0194 decision 2) - its name, category and description. The house shape of a popup: only the body scrolls, labels above native inputs, one action row. */\n@customElement('learning-course-form')\nexport class LearningCourseForm extends localize(i18next)(LitElement) {\n  static styles = [\n    CommonPopupStyles,\n    PopupBodyStyles,\n    FormFieldStyles,\n    PopupFieldStyles,\n    css`\n      ox-input-select-buttons {\n        align-self: flex-start;\n      }\n      textarea {\n        min-height: 120px;\n        resize: vertical;\n      }\n    `\n  ]\n\n  @property({ attribute: false }) course: CourseShape = {}\n  @state() private name = ''\n  @state() private category = 'MANDATORY'\n  @state() private description = ''\n\n  private save = new MutationController(this, gql`mutation ($course: NewCourse!) { createCourse(course: $course) { id } }`, { showsError: true })\n  private change = new MutationController(this, gql`mutation ($id: String!, $patch: CoursePatch!) { updateCourse(id: $id, patch: $patch) { id } }`, { showsError: true })\n\n  willUpdate(changed: Map<string, unknown>) {\n    if (changed.has('course')) {\n      this.name = this.course.name ?? ''\n      this.category = this.course.category ?? 'MANDATORY'\n      this.description = this.course.description ?? ''\n    }\n  }\n\n  render() {\n    const pending = this.save.pending || this.change.pending\n    const error: any = this.save.error || this.change.error\n    return html`\n      <div class=\"body\">\n        <label class=\"field\">\n          <span>${t('field.learning-course-name')}</span>\n          <input .value=${this.name} maxlength=\"200\" required @input=${(e: any) => (this.name = e.target.value)} />\n        </label>\n        <div class=\"field\">\n          <span>${t('field.learning-course-category')}</span>\n          <ox-input-select-buttons .value=${this.category} .options=${CATEGORIES.map(code => ({ display: categoryWord(code), value: code }))} @change=${(e: CustomEvent) => e.detail && (this.category = e.detail)}></ox-input-select-buttons>\n        </div>\n        <label class=\"field\">\n          <span>${t('field.learning-course-description')}</span>\n          <textarea .value=${this.description} @input=${(e: any) => (this.description = e.target.value)}></textarea>\n        </label>\n        ${error ? html`<div class=\"field\"><span invalid role=\"alert\">${error.graphQLErrors?.[0]?.message ?? error.message}</span></div>` : nothing}\n      </div>\n      <ox-popup-actions>\n        <md-text-button slot=\"cancel\" @click=${() => this.dispatchEvent(new CustomEvent('close'))}>${t('button.cancel')}</md-text-button>\n        <md-filled-button slot=\"confirm\" ?disabled=${!this.name.trim() || pending} @click=${() => this.submit()}>${t('button.save')}</md-filled-button>\n      </ox-popup-actions>\n    `\n  }\n\n  private async submit() {\n    const fields = { name: this.name.trim(), category: this.category, description: this.description.trim() || null }\n    const done = this.course.id ? (await this.change.run({ id: this.course.id, patch: fields }))?.updateCourse : (await this.save.run({ course: fields }))?.createCourse\n    if (done) this.dispatchEvent(new CustomEvent('saved', { detail: done }))\n  }\n}\n"]}

package/dist-client/components/learning-question-form.d.ts

@@ -0,0 +1,33 @@
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@material/web/icon/icon.js';
+import '@operato/input/ox-input-select-buttons.js';
+import '@operato/popup/ox-popup-actions.js';
+import { LitElement } from 'lit';
+export type QuestionDraft = {
+    id?: string;
+    kind: string;
+    text: string;
+    explanation?: string | null;
+    drafted?: boolean;
+    choices: {
+        id?: string;
+        text: string;
+        correct: boolean;
+    }[];
+};
+/** Opens the question form. Resolves with the question as given, or null. */
+export declare function openQuestionForm(question: QuestionDraft): Promise<QuestionDraft | null>;
+declare const LearningQuestionForm_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+export declare class LearningQuestionForm extends LearningQuestionForm_base {
+    static styles: import("lit").CSSResult[];
+    question: QuestionDraft;
+    private draft;
+    willUpdate(changed: Map<string, unknown>): void;
+    render(): import("lit-html").TemplateResult<1>;
+    private kind;
+    private mark;
+    private write;
+    private removeChoice;
+}
+export {};

package/dist-client/components/learning-question-form.js

@@ -0,0 +1,142 @@
+import { __decorate, __metadata } from "tslib";
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@material/web/icon/icon.js';
+import '@operato/input/ox-input-select-buttons.js';
+import '@operato/popup/ox-popup-actions.js';
+import { css, html, LitElement } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { i18next, localize } from '@operato/i18n';
+import { openPopup } from '@operato/layout';
+import { CommonPopupStyles, FormFieldStyles, PopupBodyStyles, PopupFieldStyles } from '@operato/styles';
+import { QUESTION_KINDS, questionKindWord, t } from '../utils/learning-words.js';
+/** Opens the question form. Resolves with the question as given, or null. */
+export function openQuestionForm(question) {
+    const popup = openPopup(html `<learning-question-form .question=${question} @done=${(e) => popup.close(e.detail)} @close=${() => popup.close()}></learning-question-form>`, { backdrop: true, size: 'large', title: question.id ? t('title.learning-question-edit') : t('title.learning-question-new') });
+    return popup.result.then(value => (value ?? null));
+}
+/* 문항 (ADR-0194 decision 4) - how it is answered, what it asks, its choices with which are right, and why. */
+let LearningQuestionForm = class LearningQuestionForm extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.question = { kind: 'SINGLE', text: '', choices: [] };
+        this.draft = { kind: 'SINGLE', text: '', choices: [] };
+    }
+    static { this.styles = [
+        CommonPopupStyles,
+        PopupBodyStyles,
+        FormFieldStyles,
+        PopupFieldStyles,
+        css `
+      ox-input-select-buttons {
+        align-self: flex-start;
+      }
+      textarea {
+        min-height: 80px;
+        resize: vertical;
+      }
+      .choice {
+        display: flex;
+        align-items: center;
+        gap: var(--spacing-small, 4px);
+      }
+      .choice input[type='text'] {
+        flex: 1;
+      }
+      .field .choice input[type='checkbox'],
+      .field .choice input[type='radio'] {
+        width: auto;
+        margin: 0;
+      }
+      .choice button {
+        border: 0;
+        background: transparent;
+        cursor: pointer;
+        color: var(--ui-muted);
+        padding: 4px;
+      }
+    `
+    ]; }
+    willUpdate(changed) {
+        if (changed.has('question')) {
+            const choices = this.question.choices?.length ? this.question.choices.map(one => ({ ...one })) : [{ text: '', correct: true }, { text: '', correct: false }];
+            this.draft = { ...this.question, choices };
+        }
+    }
+    render() {
+        const multiple = this.draft.kind === 'MULTIPLE';
+        const right = this.draft.choices.filter(one => one.correct).length;
+        const ready = this.draft.text.trim() && this.draft.choices.length >= 2 && this.draft.choices.every(one => one.text.trim()) && right >= 1 && (multiple || right === 1);
+        return html `
+      <div class="body">
+        <div class="field">
+          <span>${t('field.learning-question-kind')}</span>
+          <ox-input-select-buttons .value=${this.draft.kind} .options=${QUESTION_KINDS.map(code => ({ display: questionKindWord(code), value: code }))} @change=${(e) => e.detail && this.kind(e.detail)}></ox-input-select-buttons>
+        </div>
+        <label class="field">
+          <span>${t('field.learning-question-text')}</span>
+          <textarea .value=${this.draft.text} @input=${(e) => (this.draft = { ...this.draft, text: e.target.value })}></textarea>
+        </label>
+        <fieldset class="field" style="border:0;padding:0;margin:0">
+          <legend><span>${t('field.learning-question-choices')}</span></legend>
+          ${this.draft.choices.map((choice, index) => html `<div class="choice">
+              <input
+                type=${multiple ? 'checkbox' : 'radio'}
+                name="correct"
+                aria-label=${t('label.learning-choice-correct', { number: index + 1 })}
+                .checked=${choice.correct}
+                @change=${(e) => this.mark(index, e.target.checked)}
+              />
+              <input type="text" aria-label=${t('label.learning-choice-text', { number: index + 1 })} .value=${choice.text} ?readonly=${this.draft.kind === 'TRUE_FALSE'} @input=${(e) => this.write(index, e.target.value)} />
+              ${this.draft.kind !== 'TRUE_FALSE' && this.draft.choices.length > 2
+            ? html `<button aria-label=${t('button.learning-choice-remove')} @click=${() => this.removeChoice(index)}><md-icon>close</md-icon></button>`
+            : ''}
+            </div>`)}
+          ${this.draft.kind !== 'TRUE_FALSE'
+            ? html `<md-text-button style="align-self:flex-start" @click=${() => (this.draft = { ...this.draft, choices: [...this.draft.choices, { text: '', correct: false }] })}>${t('button.learning-choice-add')}</md-text-button>`
+            : ''}
+          <span>${multiple ? t('text.learning-question-multiple-hint') : t('text.learning-question-single-hint')}</span>
+        </fieldset>
+        <label class="field">
+          <span>${t('field.learning-question-explanation')}</span>
+          <textarea .value=${this.draft.explanation ?? ''} @input=${(e) => (this.draft = { ...this.draft, explanation: e.target.value })}></textarea>
+        </label>
+      </div>
+      <ox-popup-actions>
+        <md-text-button slot="cancel" @click=${() => this.dispatchEvent(new CustomEvent('close'))}>${t('button.cancel')}</md-text-button>
+        <md-filled-button slot="confirm" ?disabled=${!ready} @click=${() => this.dispatchEvent(new CustomEvent('done', { detail: this.draft }))}>${t('button.confirm')}</md-filled-button>
+      </ox-popup-actions>
+    `;
+    }
+    kind(kind) {
+        if (kind === 'TRUE_FALSE')
+            this.draft = { ...this.draft, kind, choices: [{ text: t('text.quiz-true'), correct: true }, { text: t('text.quiz-false'), correct: false }] };
+        else if (kind === 'SINGLE' && this.draft.choices.filter(one => one.correct).length > 1)
+            this.draft = { ...this.draft, kind, choices: this.draft.choices.map((one, i) => ({ ...one, correct: i === this.draft.choices.findIndex(c => c.correct) })) };
+        else
+            this.draft = { ...this.draft, kind };
+    }
+    mark(index, checked) {
+        const multiple = this.draft.kind === 'MULTIPLE';
+        this.draft = { ...this.draft, choices: this.draft.choices.map((one, i) => ({ ...one, correct: i === index ? checked : multiple ? one.correct : false })) };
+    }
+    write(index, text) {
+        this.draft = { ...this.draft, choices: this.draft.choices.map((one, i) => (i === index ? { ...one, text } : one)) };
+    }
+    removeChoice(index) {
+        this.draft = { ...this.draft, choices: this.draft.choices.filter((_, i) => i !== index) };
+    }
+};
+__decorate([
+    property({ attribute: false }),
+    __metadata("design:type", Object)
+], LearningQuestionForm.prototype, "question", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], LearningQuestionForm.prototype, "draft", void 0);
+LearningQuestionForm = __decorate([
+    customElement('learning-question-form')
+], LearningQuestionForm);
+export { LearningQuestionForm };
+//# sourceMappingURL=learning-question-form.js.map

package/dist-client/components/learning-question-form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"learning-question-form.js","sourceRoot":"","sources":["../../client/components/learning-question-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/button/filled-button.js'\nimport '@material/web/button/text-button.js'\nimport '@material/web/icon/icon.js'\nimport '@operato/input/ox-input-select-buttons.js'\nimport '@operato/popup/ox-popup-actions.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { openPopup } from '@operato/layout'\nimport { CommonPopupStyles, FormFieldStyles, PopupBodyStyles, PopupFieldStyles } from '@operato/styles'\n\nimport { QUESTION_KINDS, questionKindWord, t } from '../utils/learning-words.js'\n\nexport type QuestionDraft = { id?: string; kind: string; text: string; explanation?: string | null; drafted?: boolean; choices: { id?: string; text: string; correct: boolean }[] }\n\n/** Opens the question form. Resolves with the question as given, or null. */\nexport function openQuestionForm(question: QuestionDraft): Promise<QuestionDraft | null> {\n  const popup = openPopup(html`<learning-question-form .question=${question} @done=${(e: CustomEvent) => popup.close(e.detail)} @close=${() => popup.close()}></learning-question-form>`, { backdrop: true, size: 'large', title: question.id ? t('title.learning-question-edit') : t('title.learning-question-new') })\n  return popup.result.then(value => (value ?? null) as any)\n}\n\n/* 문항 (ADR-0194 decision 4) - how it is answered, what it asks, its choices with which are right, and why. */\n@customElement('learning-question-form')\nexport class LearningQuestionForm extends localize(i18next)(LitElement) {\n  static styles = [\n    CommonPopupStyles,\n    PopupBodyStyles,\n    FormFieldStyles,\n    PopupFieldStyles,\n    css`\n      ox-input-select-buttons {\n        align-self: flex-start;\n      }\n      textarea {\n        min-height: 80px;\n        resize: vertical;\n      }\n      .choice {\n        display: flex;\n        align-items: center;\n        gap: var(--spacing-small, 4px);\n      }\n      .choice input[type='text'] {\n        flex: 1;\n      }\n      .field .choice input[type='checkbox'],\n      .field .choice input[type='radio'] {\n        width: auto;\n        margin: 0;\n      }\n      .choice button {\n        border: 0;\n        background: transparent;\n        cursor: pointer;\n        color: var(--ui-muted);\n        padding: 4px;\n      }\n    `\n  ]\n\n  @property({ attribute: false }) question: QuestionDraft = { kind: 'SINGLE', text: '', choices: [] }\n  @state() private draft: QuestionDraft = { kind: 'SINGLE', text: '', choices: [] }\n\n  willUpdate(changed: Map<string, unknown>) {\n    if (changed.has('question')) {\n      const choices = this.question.choices?.length ? this.question.choices.map(one => ({ ...one })) : [{ text: '', correct: true }, { text: '', correct: false }]\n      this.draft = { ...this.question, choices }\n    }\n  }\n\n  render() {\n    const multiple = this.draft.kind === 'MULTIPLE'\n    const right = this.draft.choices.filter(one => one.correct).length\n    const ready = this.draft.text.trim() && this.draft.choices.length >= 2 && this.draft.choices.every(one => one.text.trim()) && right >= 1 && (multiple || right === 1)\n    return html`\n      <div class=\"body\">\n        <div class=\"field\">\n          <span>${t('field.learning-question-kind')}</span>\n          <ox-input-select-buttons .value=${this.draft.kind} .options=${QUESTION_KINDS.map(code => ({ display: questionKindWord(code), value: code }))} @change=${(e: CustomEvent) => e.detail && this.kind(e.detail)}></ox-input-select-buttons>\n        </div>\n        <label class=\"field\">\n          <span>${t('field.learning-question-text')}</span>\n          <textarea .value=${this.draft.text} @input=${(e: any) => (this.draft = { ...this.draft, text: e.target.value })}></textarea>\n        </label>\n        <fieldset class=\"field\" style=\"border:0;padding:0;margin:0\">\n          <legend><span>${t('field.learning-question-choices')}</span></legend>\n          ${this.draft.choices.map(\n            (choice, index) => html`<div class=\"choice\">\n              <input\n                type=${multiple ? 'checkbox' : 'radio'}\n                name=\"correct\"\n                aria-label=${t('label.learning-choice-correct', { number: index + 1 })}\n                .checked=${choice.correct}\n                @change=${(e: any) => this.mark(index, e.target.checked)}\n              />\n              <input type=\"text\" aria-label=${t('label.learning-choice-text', { number: index + 1 })} .value=${choice.text} ?readonly=${this.draft.kind === 'TRUE_FALSE'} @input=${(e: any) => this.write(index, e.target.value)} />\n              ${this.draft.kind !== 'TRUE_FALSE' && this.draft.choices.length > 2\n                ? html`<button aria-label=${t('button.learning-choice-remove')} @click=${() => this.removeChoice(index)}><md-icon>close</md-icon></button>`\n                : ''}\n            </div>`\n          )}\n          ${this.draft.kind !== 'TRUE_FALSE'\n            ? html`<md-text-button style=\"align-self:flex-start\" @click=${() => (this.draft = { ...this.draft, choices: [...this.draft.choices, { text: '', correct: false }] })}>${t('button.learning-choice-add')}</md-text-button>`\n            : ''}\n          <span>${multiple ? t('text.learning-question-multiple-hint') : t('text.learning-question-single-hint')}</span>\n        </fieldset>\n        <label class=\"field\">\n          <span>${t('field.learning-question-explanation')}</span>\n          <textarea .value=${this.draft.explanation ?? ''} @input=${(e: any) => (this.draft = { ...this.draft, explanation: e.target.value })}></textarea>\n        </label>\n      </div>\n      <ox-popup-actions>\n        <md-text-button slot=\"cancel\" @click=${() => this.dispatchEvent(new CustomEvent('close'))}>${t('button.cancel')}</md-text-button>\n        <md-filled-button slot=\"confirm\" ?disabled=${!ready} @click=${() => this.dispatchEvent(new CustomEvent('done', { detail: this.draft }))}>${t('button.confirm')}</md-filled-button>\n      </ox-popup-actions>\n    `\n  }\n\n  private kind(kind: string) {\n    if (kind === 'TRUE_FALSE')\n      this.draft = { ...this.draft, kind, choices: [{ text: t('text.quiz-true'), correct: true }, { text: t('text.quiz-false'), correct: false }] }\n    else if (kind === 'SINGLE' && this.draft.choices.filter(one => one.correct).length > 1)\n      this.draft = { ...this.draft, kind, choices: this.draft.choices.map((one, i) => ({ ...one, correct: i === this.draft.choices.findIndex(c => c.correct) })) }\n    else this.draft = { ...this.draft, kind }\n  }\n\n  private mark(index: number, checked: boolean) {\n    const multiple = this.draft.kind === 'MULTIPLE'\n    this.draft = { ...this.draft, choices: this.draft.choices.map((one, i) => ({ ...one, correct: i === index ? checked : multiple ? one.correct : false })) }\n  }\n\n  private write(index: number, text: string) {\n    this.draft = { ...this.draft, choices: this.draft.choices.map((one, i) => (i === index ? { ...one, text } : one)) }\n  }\n\n  private removeChoice(index: number) {\n    this.draft = { ...this.draft, choices: this.draft.choices.filter((_, i) => i !== index) }\n  }\n}\n"]}

package/dist-client/components/learning-todo.d.ts

@@ -0,0 +1,12 @@
+import '@material/web/button/filled-button.js';
+import { LitElement } from 'lit';
+declare const LearningTodo_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+export declare class LearningTodo extends LearningTodo_base {
+    static styles: import("lit").CSSResult;
+    input: {
+        headline?: string;
+        address?: string;
+    };
+    render(): import("lit-html").TemplateResult<1>;
+}
+export {};

package/dist-client/components/learning-todo.js

@@ -0,0 +1,43 @@
+import { __decorate, __metadata } from "tslib";
+import '@material/web/button/filled-button.js';
+import { css, html, LitElement } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { i18next, localize } from '@operato/i18n';
+import { navigate } from '@operato/shell';
+/*
+ * 수강 (ADR-0194 decision 5) - what the worklist to-do shows: the course, by when, and the way to it. Completing the
+ * course there ends the to-do; nothing is answered here.
+ */
+let LearningTodo = class LearningTodo extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.input = {};
+    }
+    static { this.styles = css `
+    :host {
+      display: block;
+      padding: var(--spacing-large, 12px);
+      font-size: var(--ui-t-body, 13px);
+      line-height: 1.6;
+      color: var(--ui-ink);
+    }
+
+    p {
+      margin: 0 0 var(--spacing-medium, 8px);
+    }
+  `; }
+    render() {
+        const { headline = '', address } = this.input ?? {};
+        return html `<p>${headline}</p>
+      ${address ? html `<md-filled-button @click=${() => navigate(address)}>${i18next.t('button.learning-open-course')}</md-filled-button>` : ''}`;
+    }
+};
+__decorate([
+    property({ attribute: false }),
+    __metadata("design:type", Object)
+], LearningTodo.prototype, "input", void 0);
+LearningTodo = __decorate([
+    customElement('learning-todo')
+], LearningTodo);
+export { LearningTodo };
+//# sourceMappingURL=learning-todo.js.map

package/dist-client/components/learning-todo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"learning-todo.js","sourceRoot":"","sources":["../../client/components/learning-todo.ts"],"names":[],"mappings":";AAAA,OAAO,uCAAuC,CAAA;AAE9C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAEzC;;;GAGG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAAxD;;QAe2B,UAAK,GAA4C,EAAE,CAAA;IAOrF,CAAC;aArBQ,WAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;GAYlB,AAZY,CAYZ;IAID,MAAM;QACJ,MAAM,EAAE,QAAQ,GAAG,EAAE,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE,CAAA;QACnD,OAAO,IAAI,CAAA,MAAM,QAAQ;QACrB,OAAO,CAAC,CAAC,CAAC,IAAI,CAAA,4BAA4B,GAAG,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,6BAA6B,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAA;IAC/I,CAAC;;AAN+B;IAA/B,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;;2CAAoD;AAfxE,YAAY;IADxB,aAAa,CAAC,eAAe,CAAC;GAClB,YAAY,CAsBxB","sourcesContent":["import '@material/web/button/filled-button.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { navigate } from '@operato/shell'\n\n/*\n * 수강 (ADR-0194 decision 5) - what the worklist to-do shows: the course, by when, and the way to it. Completing the\n * course there ends the to-do; nothing is answered here.\n */\n@customElement('learning-todo')\nexport class LearningTodo extends localize(i18next)(LitElement) {\n  static styles = css`\n    :host {\n      display: block;\n      padding: var(--spacing-large, 12px);\n      font-size: var(--ui-t-body, 13px);\n      line-height: 1.6;\n      color: var(--ui-ink);\n    }\n\n    p {\n      margin: 0 0 var(--spacing-medium, 8px);\n    }\n  `\n\n  @property({ attribute: false }) input: { headline?: string; address?: string } = {}\n\n  render() {\n    const { headline = '', address } = this.input ?? {}\n    return html`<p>${headline}</p>\n      ${address ? html`<md-filled-button @click=${() => navigate(address)}>${i18next.t('button.learning-open-course')}</md-filled-button>` : ''}`\n  }\n}\n"]}

package/dist-client/components/learning-unit-form.d.ts

@@ -0,0 +1,41 @@
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@operato/input/ox-input-file.js';
+import '@operato/input/ox-input-select-buttons.js';
+import '@operato/popup/ox-popup-actions.js';
+import { LitElement } from 'lit';
+export type UnitDraft = {
+    id?: string;
+    kind: string;
+    name: string;
+    body?: string | null;
+    url?: string | null;
+    minSeconds?: number | null;
+    durationSeconds?: number | null;
+    file?: {
+        name?: string;
+    } | null;
+};
+export type UnitEdit = {
+    unit: UnitDraft;
+    file?: File;
+    durationSeconds?: number;
+};
+/** Opens the unit form. Resolves with what was given - the unit and a file picked for it - or null. */
+export declare function openUnitForm(unit: UnitDraft): Promise<UnitEdit | null>;
+/** A video's length in seconds, read from the file in the browser - the server needs it to know when it was watched to the end. */
+export declare function videoDurationOf(file: File): Promise<number | undefined>;
+declare const LearningUnitForm_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+export declare class LearningUnitForm extends LearningUnitForm_base {
+    static styles: import("lit").CSSResult[];
+    unit: UnitDraft;
+    private draft;
+    private file?;
+    private duration?;
+    willUpdate(changed: Map<string, unknown>): void;
+    render(): import("lit-html").TemplateResult<1>;
+    private patch;
+    private pick;
+    private done;
+}
+export {};