@blinkk/editor/dist/src/editor/parts/menu/users.js

Structured content editor with live previews.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.UsersPart = void 0;
const selective_edit_1 = require("@blinkk/selective-edit");
const index_1 = require("./index");
const selective_edit_2 = require("@blinkk/selective-edit");
const template_1 = require("../../template");
class UsersPart extends index_1.MenuSectionPart {
    classesForPart() {
        const classes = super.classesForPart();
        classes.le__part__menu__users = true;
        return classes;
    }
    loadProject() {
        this.users = this.config.state.getProject((project) => {
            // Default to array so it does not try to keep reloading the project data.
            this.users = project.users || [];
            this.render();
        })?.users;
    }
    templateContent(editor) {
        // Lazy load the users information.
        if (this.users === undefined) {
            this.loadProject();
            return template_1.templateLoading(editor, {
                pad: true,
            });
        }
        if (!this.users.length) {
            return selective_edit_1.html `<div class="le__part__menu__section__content">
        <div class="le__list">
          <div class="le__list__item">
            <div class="le__list__item__label">No users configured.</div>
          </div>
        </div>
      </div>`;
        }
        return selective_edit_1.html `<div class="le__part__menu__section__content">
      <div class="le__list le__list--constrained le__list--indent">
        ${selective_edit_2.repeat(this.users || [], user => user.name, user => user.isGroup ? this.templateGroup(user) : this.templateUser(user))}
      </div>
    </div>`;
    }
    templateGroup(user) {
        return selective_edit_1.html `<div class="le__list__item">
      <div class="le__list__item__icon">
        <span class="material-icons">group</span>
      </div>
      <div class="le__list__item__label">${user.name}</div>
      <div class="le__list__item__aside">${user.email}</div>
    </div>`;
    }
    templateTitle(editor) {
        return selective_edit_1.html `<div class="le__part__menu__section__title">
      ${editor.config.labels?.menuUsers || this.title}
    </div>`;
    }
    templateUser(user) {
        return selective_edit_1.html `<div class="le__list__item">
      <div class="le__list__item__icon">
        <span class="material-icons">person</span>
      </div>
      <div class="le__list__item__label">
        <a href="mailto:${user.email}">${user.name}</a>
      </div>
    </div>`;
    }
    get title() {
        return 'Users';
    }
}
exports.UsersPart = UsersPart;
//# sourceMappingURL=users.js.map