@things-factory/auth-ui 10.1.4 → 10.1.7

package/dist-client/components/create-role.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"create-role.js","sourceRoot":"","sources":["../../client/components/create-role.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/textfield/filled-text-field.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, query } from 'lit/decorators.js'\n\nimport { client, gqlContext } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { OxPrompt } from '@operato/popup/ox-prompt.js'\n\n@customElement('create-role')\nclass CreateRole extends localize(i18next)(LitElement) {\n  static styles = css`\n    :host {\n      --md-text-field-fill-color: var(--md-sys-color-on-primary);\n      background-color: var(--md-sys-color-surface);\n      margin: var(--spacing-large) 0;\n      padding: var(--spacing-large);\n      border-radius: var(--border-radius);\n      box-shadow: var(--box-shadow);\n\n      display: grid;\n      grid-template-columns: 1fr 2fr auto;\n      gap: 5px 15px;\n      clear: both;\n      max-width: var(--input-container-max-width);\n\n      align-items: center;\n    }\n\n    md-outlined-button {\n      margin: var(--input-margin);\n      text-transform: capitalize;\n    }\n\n    @media screen and (max-width: 480px) {\n      :host {\n        grid-template-columns: 1fr 1fr;\n      }\n\n      md-outlined-button {\n        grid-column: span 2;\n\n        margin: var(--input-margin);\n      }\n    }\n  `\n\n  @query('[name=name]') nameInput!: HTMLInputElement\n  @query('[name=description]') descriptionInput!: HTMLInputElement\n\n  render() {\n    return html`\n      <md-filled-text-field\n        type=\"text\"\n        name=\"name\"\n        label=${String(i18next.t('label.x name', { x: i18next.t('label.role') }))}\n      ></md-filled-text-field>\n      <md-filled-text-field\n        type=\"text\"\n        name=\"description\"\n        label=${String(i18next.t('label.x description', { x: i18next.t('label.role') }))}\n      ></md-filled-text-field>\n\n      <md-outlined-button @click=${this.onCreateRole.bind(this)}\n        >${String(i18next.t('button.create'))}</md-outlined-button\n      >\n    `\n  }\n\n  async onCreateRole() {\n    let role: { name?: string; description?: string } = {}\n\n    const name = this.nameInput.value.trim()\n    const description = this.descriptionInput.value\n\n    if (!name) {\n      return this.showToast(i18next.t('error.value is empty', { value: i18next.t('field.name') }))\n    }\n\n    role.name = name\n    role.description = description\n\n    if (\n      await OxPrompt.open({\n        title: i18next.t('text.are_you_sure'),\n        text: i18next.t('text.do_you_want_to_create_x', { x: i18next.t('label.role') }),\n        confirmButton: { text: i18next.t('button.confirm') },\n        cancelButton: { text: i18next.t('button.cancel') }\n      })\n    ) {\n      const response = await client.mutate({\n        mutation: gql`\n          mutation createRole($role: NewRole!) {\n            createRole(role: $role) {\n              name\n            }\n          }\n        `,\n        variables: { role },\n        context: gqlContext()\n      })\n\n      if (!response.errors) {\n        await this.dispatchEvent(new CustomEvent('fetch-roles'))\n\n        await OxPrompt.open({\n          type: 'success',\n          title: i18next.t('text.completed'),\n          text: i18next.t('text.data_uploaded_successfully'),\n          confirmButton: { text: i18next.t('button.confirm') }\n        })\n\n        this.nameInput.value = ''\n        this.descriptionInput.value = ''\n      }\n    }\n  }\n\n  showToast(message) {\n    document.dispatchEvent(new CustomEvent('notify', { detail: { message, option: { timer: 1000 } } }))\n  }\n}\n"]}

package/dist-client/components/credential-manager.d.ts

@@ -1,11 +0,0 @@
-import { LitElement } from 'lit';
-export declare class CredentialManager extends LitElement {
-    credentials: {
-        credentialId: string;
-    }[];
-    static styles: import("lit").CSSResult;
-    connectedCallback(): void;
-    fetchCredentials(): Promise<void>;
-    deleteCredential(credentialId: string): Promise<void>;
-    render(): import("lit-html").TemplateResult<1>;
-}

package/dist-client/components/credential-manager.js

@@ -1,64 +0,0 @@
-import { __decorate, __metadata } from "tslib";
-import { LitElement, html, css } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-let CredentialManager = class CredentialManager extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.credentials = [];
-    }
-    static { this.styles = css `
-    div {
-      margin: 20px;
-    }
-    button {
-      margin: 5px;
-    }
-  `; }
-    connectedCallback() {
-        super.connectedCallback();
-        this.fetchCredentials();
-    }
-    async fetchCredentials() {
-        const response = await fetch('/auth/credentials', {
-            method: 'GET',
-            credentials: 'include'
-        });
-        this.credentials = await response.json();
-    }
-    async deleteCredential(credentialId) {
-        const response = await fetch(`/credentials/${credentialId}`, {
-            method: 'DELETE',
-            credentials: 'include'
-        });
-        if (response.ok) {
-            this.fetchCredentials();
-        }
-        else {
-            console.error('Failed to delete credential');
-        }
-    }
-    render() {
-        return html `
-      <div>
-        <h2>Manage Your WebAuthn Credentials</h2>
-        <ul>
-          ${this.credentials.map(credential => html `
-              <li>
-                ${credential.credentialId}
-                <button @click=${() => this.deleteCredential(credential.credentialId)}>Delete</button>
-              </li>
-            `)}
-        </ul>
-      </div>
-    `;
-    }
-};
-__decorate([
-    property({ type: Array }),
-    __metadata("design:type", Array)
-], CredentialManager.prototype, "credentials", void 0);
-CredentialManager = __decorate([
-    customElement('credential-manager')
-], CredentialManager);
-export { CredentialManager };
-//# sourceMappingURL=credential-manager.js.map

package/dist-client/components/credential-manager.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"credential-manager.js","sourceRoot":"","sources":["../../client/components/credential-manager.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAKpD,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,UAAU;IAA1C;;QACsB,gBAAW,GAEhC,EAAE,CAAA;IAqDV,CAAC;aAnDQ,WAAM,GAAG,GAAG,CAAA;;;;;;;GAOlB,AAPY,CAOZ;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAA;QACzB,IAAI,CAAC,gBAAgB,EAAE,CAAA;IACzB,CAAC;IAED,KAAK,CAAC,gBAAgB;QACpB,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,mBAAmB,EAAE;YAChD,MAAM,EAAE,KAAK;YACb,WAAW,EAAE,SAAS;SACvB,CAAC,CAAA;QACF,IAAI,CAAC,WAAW,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAA;IAC1C,CAAC;IAED,KAAK,CAAC,gBAAgB,CAAC,YAAoB;QACzC,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,gBAAgB,YAAY,EAAE,EAAE;YAC3D,MAAM,EAAE,QAAQ;YAChB,WAAW,EAAE,SAAS;SACvB,CAAC,CAAA;QACF,IAAI,QAAQ,CAAC,EAAE,EAAE,CAAC;YAChB,IAAI,CAAC,gBAAgB,EAAE,CAAA;QACzB,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,KAAK,CAAC,6BAA6B,CAAC,CAAA;QAC9C,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;;YAIH,IAAI,CAAC,WAAW,CAAC,GAAG,CACpB,UAAU,CAAC,EAAE,CAAC,IAAI,CAAA;;kBAEZ,UAAU,CAAC,YAAY;iCACR,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,YAAY,CAAC;;aAExE,CACF;;;KAGN,CAAA;IACH,CAAC;;AAtD0B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;;sDAElB;AAHG,iBAAiB;IAD7B,aAAa,CAAC,oBAAoB,CAAC;GACvB,iBAAiB,CAwD7B","sourcesContent":["import gql from 'graphql-tag'\nimport { LitElement, html, css } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\n\n@customElement('credential-manager')\nexport class CredentialManager extends LitElement {\n  @property({ type: Array }) credentials: {\n    credentialId: string\n  }[] = []\n\n  static styles = css`\n    div {\n      margin: 20px;\n    }\n    button {\n      margin: 5px;\n    }\n  `\n\n  connectedCallback() {\n    super.connectedCallback()\n    this.fetchCredentials()\n  }\n\n  async fetchCredentials() {\n    const response = await fetch('/auth/credentials', {\n      method: 'GET',\n      credentials: 'include'\n    })\n    this.credentials = await response.json()\n  }\n\n  async deleteCredential(credentialId: string) {\n    const response = await fetch(`/credentials/${credentialId}`, {\n      method: 'DELETE',\n      credentials: 'include'\n    })\n    if (response.ok) {\n      this.fetchCredentials()\n    } else {\n      console.error('Failed to delete credential')\n    }\n  }\n\n  render() {\n    return html`\n      <div>\n        <h2>Manage Your WebAuthn Credentials</h2>\n        <ul>\n          ${this.credentials.map(\n            credential => html`\n              <li>\n                ${credential.credentialId}\n                <button @click=${() => this.deleteCredential(credential.credentialId)}>Delete</button>\n              </li>\n            `\n          )}\n        </ul>\n      </div>\n    `\n  }\n}\n"]}

package/dist-client/components/role-edit-form.d.ts

@@ -1 +0,0 @@
-export {};

package/dist-client/components/role-edit-form.js

@@ -1,95 +0,0 @@
-import { __decorate, __metadata } from "tslib";
-import { css, html, LitElement } from 'lit';
-import { customElement, property, query } from 'lit/decorators.js';
-import { i18next, localize } from '@operato/i18n';
-let RoleEditForm = class RoleEditForm extends localize(i18next)(LitElement) {
-    static { this.styles = css `
-    [field-2column] {
-      border-radius: var(--border-radius);
-      display: grid;
-      grid-template-columns: 1fr 1fr;
-      gap: 5px 15px;
-      clear: both;
-      max-width: var(--input-container-max-width);
-    }
-    [field] {
-      display: flex;
-      flex-direction: column;
-      padding-bottom: var(--spacing-medium);
-    }
-    input {
-      background-color: var(--input-field-background, var(--md-sys-color-surface-container-highest));
-      color: var(--input-field-color, var(--md-sys-color-on-surface));
-      border: var(--border-dim-color);
-      border-radius: var(--border-radius);
-      margin: var(--input-margin);
-      padding: var(--input-padding);
-      min-width: 250px;
-      font: var(--input-font);
-    }
-    label {
-      display: flex;
-      flex-direction: column;
-      font: var(--label-font);
-      color: var(--md-sys-color-on-primary);
-      text-transform: var(--label-text-transform);
-    }
-    @media screen and (max-width: 480px) {
-      [field] {
-        grid-column: span 2;
-      }
-    }
-  `; }
-    render() {
-        const role = this.role || { name: '', description: '' };
-        return html `
-      <form field-2column @input="${this.dispatchRoleChanged.bind(this)}">
-        <div field>
-          <label
-            >role name
-            <input name="name" value="${role.name}" @click="${e => e.stopPropagation()}" />
-          </label>
-        </div>
-
-        <div field>
-          <label
-            >role description
-            <input name="description" .value="${role.description}" @click="${e => e.stopPropagation()}" />
-          </label>
-        </div>
-      </form>
-    `;
-    }
-    getRole() {
-        const name = this.nameInput.value;
-        const description = this.descriptionInput.value;
-        if (!name) {
-            return this.showToast(i18next.t('error.value is empty', { value: i18next.t('field.name') }));
-        }
-        return { name, description };
-    }
-    dispatchRoleChanged() {
-        this.dispatchEvent(new CustomEvent('roleChanged', {
-            detail: this.getRole()
-        }));
-    }
-    showToast(message) {
-        document.dispatchEvent(new CustomEvent('notify', { detail: { message, option: { timer: 1000 } } }));
-    }
-};
-__decorate([
-    property({ type: Object }),
-    __metadata("design:type", Object)
-], RoleEditForm.prototype, "role", void 0);
-__decorate([
-    query('input[name=name]'),
-    __metadata("design:type", HTMLInputElement)
-], RoleEditForm.prototype, "nameInput", void 0);
-__decorate([
-    query('input[name=description]'),
-    __metadata("design:type", HTMLInputElement)
-], RoleEditForm.prototype, "descriptionInput", void 0);
-RoleEditForm = __decorate([
-    customElement('role-edit-form')
-], RoleEditForm);
-//# sourceMappingURL=role-edit-form.js.map

package/dist-client/components/role-edit-form.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"role-edit-form.js","sourceRoot":"","sources":["../../client/components/role-edit-form.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAGjD,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;aAC/C,WAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoClB,AApCY,CAoCZ;IAGD,MAAM;QACJ,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE,CAAA;QAEvD,OAAO,IAAI,CAAA;oCACqB,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC;;;;wCAI/B,IAAI,CAAC,IAAI,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE;;;;;;;gDAOtC,IAAI,CAAC,WAAW,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE;;;;KAIhG,CAAA;IACH,CAAC;IAKD,OAAO;QACL,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QACjC,MAAM,WAAW,GAAG,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAA;QAE/C,IAAI,CAAC,IAAI,EAAE,CAAC;YACV,OAAO,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,sBAAsB,EAAE,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC,CAAA;QAC9F,CAAC;QAED,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,CAAA;IAC9B,CAAC;IAED,mBAAmB;QACjB,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,aAAa,EAAE;YAC7B,MAAM,EAAE,IAAI,CAAC,OAAO,EAAE;SACvB,CAAC,CACH,CAAA;IACH,CAAC;IAED,SAAS,CAAC,OAAO;QACf,QAAQ,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC,CAAA;IACrG,CAAC;;AAhD2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;0CAAU;AAwBV;IAA1B,KAAK,CAAC,kBAAkB,CAAC;8BAAa,gBAAgB;+CAAA;AACrB;IAAjC,KAAK,CAAC,yBAAyB,CAAC;8BAAoB,gBAAgB;sDAAA;AA/DjE,YAAY;IADjB,aAAa,CAAC,gBAAgB,CAAC;GAC1B,YAAY,CAuFjB","sourcesContent":["import { css, html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\n\n@customElement('role-edit-form')\nclass RoleEditForm extends localize(i18next)(LitElement) {\n  static styles = css`\n    [field-2column] {\n      border-radius: var(--border-radius);\n      display: grid;\n      grid-template-columns: 1fr 1fr;\n      gap: 5px 15px;\n      clear: both;\n      max-width: var(--input-container-max-width);\n    }\n    [field] {\n      display: flex;\n      flex-direction: column;\n      padding-bottom: var(--spacing-medium);\n    }\n    input {\n      background-color: var(--input-field-background, var(--md-sys-color-surface-container-highest));\n      color: var(--input-field-color, var(--md-sys-color-on-surface));\n      border: var(--border-dim-color);\n      border-radius: var(--border-radius);\n      margin: var(--input-margin);\n      padding: var(--input-padding);\n      min-width: 250px;\n      font: var(--input-font);\n    }\n    label {\n      display: flex;\n      flex-direction: column;\n      font: var(--label-font);\n      color: var(--md-sys-color-on-primary);\n      text-transform: var(--label-text-transform);\n    }\n    @media screen and (max-width: 480px) {\n      [field] {\n        grid-column: span 2;\n      }\n    }\n  `\n  @property({ type: Object }) role: any\n\n  render() {\n    const role = this.role || { name: '', description: '' }\n\n    return html`\n      <form field-2column @input=\"${this.dispatchRoleChanged.bind(this)}\">\n        <div field>\n          <label\n            >role name\n            <input name=\"name\" value=\"${role.name}\" @click=\"${e => e.stopPropagation()}\" />\n          </label>\n        </div>\n\n        <div field>\n          <label\n            >role description\n            <input name=\"description\" .value=\"${role.description}\" @click=\"${e => e.stopPropagation()}\" />\n          </label>\n        </div>\n      </form>\n    `\n  }\n\n  @query('input[name=name]') nameInput!: HTMLInputElement\n  @query('input[name=description]') descriptionInput!: HTMLInputElement\n\n  getRole() {\n    const name = this.nameInput.value\n    const description = this.descriptionInput.value\n\n    if (!name) {\n      return this.showToast(i18next.t('error.value is empty', { value: i18next.t('field.name') }))\n    }\n\n    return { name, description }\n  }\n\n  dispatchRoleChanged() {\n    this.dispatchEvent(\n      new CustomEvent('roleChanged', {\n        detail: this.getRole()\n      })\n    )\n  }\n\n  showToast(message) {\n    document.dispatchEvent(new CustomEvent('notify', { detail: { message, option: { timer: 1000 } } }))\n  }\n}\n"]}

package/dist-client/components/role-privilege-editor.d.ts

@@ -1 +0,0 @@
-export {};

package/dist-client/components/role-privilege-editor.js

@@ -1,368 +0,0 @@
-import { __decorate, __metadata } from "tslib";
-import gql from 'graphql-tag';
-import { css, html, LitElement } from 'lit';
-import { customElement, property, state } from 'lit/decorators.js';
-import { client, gqlContext } from '@operato/graphql';
-import { i18next, localize } from '@operato/i18n';
-import { OxPrompt } from '@operato/popup/ox-prompt.js';
-import { ButtonContainerStyles } from '@operato/styles';
-let RolePrivilegeEditor = class RolePrivilegeEditor extends localize(i18next)(LitElement) {
-    constructor() {
-        super(...arguments);
-        this.allPrivileges = [];
-        this.privileges = [];
-        this.users = [];
-    }
-    static { this.styles = [
-        ButtonContainerStyles,
-        css `
-      :host {
-        display: flex;
-        flex-direction: column;
-
-        border: 1px solid var(--md-sys-color-primary);
-        font: normal 15px var(--theme-font);
-      }
-
-      div {
-        margin: var(--spacing-medium);
-      }
-
-      div[users] {
-        margin: 0;
-        background-color: var(--md-sys-color-surface-variant);
-      }
-
-      div[titler] {
-        color: var(--md-sys-color-secondary);
-        font: bold 1.2em var(--theme-font);
-        text-transform: capitalize;
-      }
-
-      ul {
-        flex: 1;
-        color: var(--md-sys-color-secondary);
-        background-color: var(--md-sys-color-surface-variant);
-        overflow: auto;
-        display: grid;
-        grid-template-columns: 1fr 1fr;
-        margin-block-start: 0;
-        margin-block-end: 0;
-        padding: var(--spacing-medium);
-        list-style: none;
-        border: 1px dashed rgba(0, 0, 0, 0.1);
-        border-width: 1px 0;
-      }
-
-      .category-group {
-        display: contents;
-      }
-
-      .category-title {
-        font-weight: bold;
-        font-size: 0.9em;
-        color: var(--md-sys-color-primary);
-        text-transform: uppercase;
-        opacity: 0.7;
-        align-self: stretch;
-        position: sticky;
-        top: 0;
-        display: flex;
-        align-items: center;
-        justify-content: flex-end;
-        text-align: right;
-      }
-
-      .category-privileges {
-        display: contents;
-      }
-
-      @media screen and (min-width: 640px) {
-        ul {
-          grid-template-columns: minmax(200px, auto) 1fr 1fr;
-          gap: 0;
-        }
-
-        .category-title {
-          grid-column: 1;
-          padding-right: var(--spacing-medium);
-        }
-
-        li {
-          grid-column: auto;
-        }
-      }
-
-      input[type='checkbox'] {
-        display: inline;
-      }
-
-      li {
-        padding: var(--spacing-small);
-        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
-      }
-
-      /* 코드가 더 이상 요구하지 않는 권한 — 부여해도 아무 일이 없으므로 눈에 구별되어야 한다.
-         감추지는 않는다. 이미 역할에 붙어 있을 수 있고, 그것을 보고 떼는 것이 관리자의 일이다. */
-      li[deprecated] label {
-        opacity: 0.55;
-        text-decoration: line-through;
-      }
-
-      li[deprecated] small {
-        display: block;
-        margin-left: 1.6em;
-        color: var(--md-sys-color-error);
-        font-size: 0.8em;
-        text-decoration: none;
-        opacity: 0.9;
-      }
-
-      #checkAll,
-      [for='checkAll'] {
-        margin-bottom: var(--spacing-medium);
-        padding-bottom: var(--spacing-small);
-        font-weight: bold;
-      }
-
-      md-elevated-button {
-        margin: 5px;
-        background-color: var(--md-sys-color-surface-variant);
-      }
-
-      md-outlined-button {
-        background-color: var(--md-sys-color-surface-variant);
-      }
-
-      @media screen and (max-width: 639px) {
-        ul {
-          grid-template-columns: 1fr;
-        }
-
-        .category-group {
-          display: block;
-          margin-top: var(--spacing-medium);
-        }
-
-        .category-group:first-child {
-          margin-top: 0;
-        }
-
-        .category-title {
-          position: static;
-          margin-bottom: var(--spacing-small);
-        }
-
-        .category-privileges {
-          display: grid;
-          grid-template-columns: 1fr;
-        }
-      }
-    `
-    ]; }
-    render() {
-        const allPrivileges = this.allPrivileges || [];
-        const privileges = this.privileges || [];
-        const users = this.users || [];
-        // Group privileges by category
-        const groupedPrivileges = allPrivileges.reduce((acc, privilege) => {
-            const category = privilege.category || 'Other';
-            if (!acc[category]) {
-                acc[category] = [];
-            }
-            acc[category].push(privilege);
-            return acc;
-        }, {});
-        // Sort categories alphabetically
-        const sortedCategories = Object.keys(groupedPrivileges).sort();
-        // Sort privileges within each category by name (descending)
-        sortedCategories.forEach(category => {
-            groupedPrivileges[category].sort((a, b) => b.name.localeCompare(a.name));
-        });
-        return html `
-      <div titler>${String(i18next.t('label.user'))}</div>
-
-      <div users>${users.map(user => html `<div>${user.name} (${user.email})</div>`)}</div>
-
-      <div titler>${String(i18next.t('field.privileges'))}</div>
-
-      <div>
-        <input id="checkAll" type="checkbox" @change=${e => this.oncheckAll(e)} />
-        <label for="checkAll">Check all</label>
-      </div>
-
-      <ul privileges>
-        ${sortedCategories.map(category => html `
-            <div class="category-group">
-              <div class="category-title">${category}</div>
-              <div class="category-privileges">
-                ${groupedPrivileges[category].map(
-        /* privilege : {id, name, category, description} */
-        privilege => html `
-                    <li ?deprecated=${privilege.deprecated}>
-                      <input
-                        type="checkbox"
-                        id="${privilege.id}"
-                        .checked=${privileges.map(p => p.id).indexOf(privilege.id) > -1}
-                        .data-privilege=${privilege}
-                      />
-                      <label for="${privilege.id}">${privilege.description}</label>
-                      ${privilege.deprecated
-            ? html `<small>${String(i18next.t('text.privilege no longer declared'))}</small>`
-            : ''}
-                    </li>
-                  `)}
-              </div>
-            </div>
-          `)}
-      </ul>
-
-      <div class="button-container">
-        <md-elevated-button @click=${e => this.onSave()}>${String(i18next.t('button.save'))}</md-elevated-button>
-        <md-elevated-button @click=${e => this.onDeleteRole()} danger
-          >${String(i18next.t('button.delete role'))}</md-elevated-button
-        >
-      </div>
-    `;
-    }
-    async firstUpdated() {
-        this.allPrivileges = await this.fetchPrivileges();
-    }
-    async updated(changes) {
-        if (changes.has('role')) {
-            await this.fetchPrivilegesOnRole(this.role.name);
-        }
-    }
-    checkAll(checked) {
-        Array.from(this.renderRoot.querySelectorAll('ul[privileges] input[type=checkbox]')).forEach(checkbox => (checkbox.checked = checked));
-    }
-    oncheckAll(e) {
-        this.checkAll(e.target.checked);
-    }
-    async onSave() {
-        const updateRoleObj = this.updateRoleObj;
-        const privileges = Array.from(this.renderRoot.querySelectorAll('ul[privileges] input[type=checkbox]:checked')).map(e => ({ id: e['data-privilege'].id }) // ObjectRef 타입에 맞게 id만 전송
-        );
-        const patch = { ...updateRoleObj, privileges: privileges };
-        if (this.role) {
-            const response = await client.mutate({
-                mutation: gql `
-          mutation ($id: String!, $patch: RolePatch!) {
-            updateRole(id: $id, patch: $patch) {
-              id
-              name
-              description
-              privileges {
-                id
-                description
-              }
-            }
-          }
-        `,
-                variables: { id: this.role.id, patch },
-                context: gqlContext()
-            });
-            if (!response.errors) {
-                await this.dispatchEvent(new CustomEvent('fetch-roles'));
-                this.showToast(i18next.t('text.data_updated_successfully'));
-            }
-        }
-    }
-    async onDeleteRole() {
-        if (await OxPrompt.open({
-            title: i18next.t('text.are_you_sure'),
-            text: i18next.t('text.are_you_sure_to_delete_x', { x: i18next.t('label.role') }),
-            confirmButton: { text: i18next.t('button.delete') },
-            cancelButton: { text: i18next.t('button.cancel') }
-        })) {
-            const response = await client.mutate({
-                mutation: gql `
-          mutation ($id: String!) {
-            deleteRole(id: $id)
-          }
-        `,
-                variables: { id: this.role.id },
-                context: gqlContext()
-            });
-            if (!response.errors) {
-                await this.dispatchEvent(new CustomEvent('fetch-roles'));
-                await OxPrompt.open({
-                    type: 'success',
-                    title: i18next.t('text.completed'),
-                    text: i18next.t('text.x_deleted_successfully', { x: i18next.t('label.role') }),
-                    confirmButton: { text: i18next.t('button.confirm') }
-                });
-            }
-        }
-    }
-    async fetchPrivileges() {
-        const response = await client.query({
-            query: gql `
-        query privileges {
-          privileges {
-            items {
-              id
-              name
-              category
-              description
-              deprecated
-            }
-            total
-          }
-        }
-      `
-        });
-        return response.data.privileges.items;
-    }
-    async fetchPrivilegesOnRole(name) {
-        const response = await client.query({
-            query: gql `
-        query ($name: String!) {
-          role(name: $name) {
-            id
-            name
-            privileges {
-              id
-              description
-            }
-            users {
-              name
-              email
-            }
-          }
-        }
-      `,
-            variables: { name },
-            context: gqlContext()
-        });
-        this.privileges = response.data.role?.privileges;
-        this.users = response.data.role?.users;
-    }
-    showToast(message) {
-        document.dispatchEvent(new CustomEvent('notify', { detail: { message, option: { timer: 1000 } } }));
-    }
-};
-__decorate([
-    property({ type: Object }),
-    __metadata("design:type", Object)
-], RolePrivilegeEditor.prototype, "role", void 0);
-__decorate([
-    property({ type: Array }),
-    __metadata("design:type", Array)
-], RolePrivilegeEditor.prototype, "allPrivileges", void 0);
-__decorate([
-    property({ type: Object }),
-    __metadata("design:type", Object)
-], RolePrivilegeEditor.prototype, "updateRoleObj", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Array)
-], RolePrivilegeEditor.prototype, "privileges", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Array)
-], RolePrivilegeEditor.prototype, "users", void 0);
-RolePrivilegeEditor = __decorate([
-    customElement('role-privilege-editor')
-], RolePrivilegeEditor);
-//# sourceMappingURL=role-privilege-editor.js.map

package/dist-client/components/role-privilege-editor.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"role-privilege-editor.js","sourceRoot":"","sources":["../../client/components/role-privilege-editor.ts"],"names":[],"mappings":"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","sourcesContent":["import gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { client, gqlContext } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { OxPrompt } from '@operato/popup/ox-prompt.js'\nimport { ButtonContainerStyles } from '@operato/styles'\n\n@customElement('role-privilege-editor')\nclass RolePrivilegeEditor extends localize(i18next)(LitElement) {\n  static styles = [\n    ButtonContainerStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n\n        border: 1px solid var(--md-sys-color-primary);\n        font: normal 15px var(--theme-font);\n      }\n\n      div {\n        margin: var(--spacing-medium);\n      }\n\n      div[users] {\n        margin: 0;\n        background-color: var(--md-sys-color-surface-variant);\n      }\n\n      div[titler] {\n        color: var(--md-sys-color-secondary);\n        font: bold 1.2em var(--theme-font);\n        text-transform: capitalize;\n      }\n\n      ul {\n        flex: 1;\n        color: var(--md-sys-color-secondary);\n        background-color: var(--md-sys-color-surface-variant);\n        overflow: auto;\n        display: grid;\n        grid-template-columns: 1fr 1fr;\n        margin-block-start: 0;\n        margin-block-end: 0;\n        padding: var(--spacing-medium);\n        list-style: none;\n        border: 1px dashed rgba(0, 0, 0, 0.1);\n        border-width: 1px 0;\n      }\n\n      .category-group {\n        display: contents;\n      }\n\n      .category-title {\n        font-weight: bold;\n        font-size: 0.9em;\n        color: var(--md-sys-color-primary);\n        text-transform: uppercase;\n        opacity: 0.7;\n        align-self: stretch;\n        position: sticky;\n        top: 0;\n        display: flex;\n        align-items: center;\n        justify-content: flex-end;\n        text-align: right;\n      }\n\n      .category-privileges {\n        display: contents;\n      }\n\n      @media screen and (min-width: 640px) {\n        ul {\n          grid-template-columns: minmax(200px, auto) 1fr 1fr;\n          gap: 0;\n        }\n\n        .category-title {\n          grid-column: 1;\n          padding-right: var(--spacing-medium);\n        }\n\n        li {\n          grid-column: auto;\n        }\n      }\n\n      input[type='checkbox'] {\n        display: inline;\n      }\n\n      li {\n        padding: var(--spacing-small);\n        border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n      }\n\n      /* 코드가 더 이상 요구하지 않는 권한 — 부여해도 아무 일이 없으므로 눈에 구별되어야 한다.\n         감추지는 않는다. 이미 역할에 붙어 있을 수 있고, 그것을 보고 떼는 것이 관리자의 일이다. */\n      li[deprecated] label {\n        opacity: 0.55;\n        text-decoration: line-through;\n      }\n\n      li[deprecated] small {\n        display: block;\n        margin-left: 1.6em;\n        color: var(--md-sys-color-error);\n        font-size: 0.8em;\n        text-decoration: none;\n        opacity: 0.9;\n      }\n\n      #checkAll,\n      [for='checkAll'] {\n        margin-bottom: var(--spacing-medium);\n        padding-bottom: var(--spacing-small);\n        font-weight: bold;\n      }\n\n      md-elevated-button {\n        margin: 5px;\n        background-color: var(--md-sys-color-surface-variant);\n      }\n\n      md-outlined-button {\n        background-color: var(--md-sys-color-surface-variant);\n      }\n\n      @media screen and (max-width: 639px) {\n        ul {\n          grid-template-columns: 1fr;\n        }\n\n        .category-group {\n          display: block;\n          margin-top: var(--spacing-medium);\n        }\n\n        .category-group:first-child {\n          margin-top: 0;\n        }\n\n        .category-title {\n          position: static;\n          margin-bottom: var(--spacing-small);\n        }\n\n        .category-privileges {\n          display: grid;\n          grid-template-columns: 1fr;\n        }\n      }\n    `\n  ]\n\n  @property({ type: Object }) role: any\n  @property({ type: Array }) allPrivileges: any[] = []\n  @property({ type: Object }) updateRoleObj: any\n\n  @state() privileges: { id: string; description: string }[] = []\n  @state() users: { /* id: string; username: string; */ name: string; email: string }[] = []\n\n  render() {\n    const allPrivileges = this.allPrivileges || []\n    const privileges = this.privileges || []\n    const users = this.users || []\n\n    // Group privileges by category\n    const groupedPrivileges = allPrivileges.reduce(\n      (acc, privilege) => {\n        const category = privilege.category || 'Other'\n        if (!acc[category]) {\n          acc[category] = []\n        }\n        acc[category].push(privilege)\n        return acc\n      },\n      {} as Record<string, any[]>\n    )\n\n    // Sort categories alphabetically\n    const sortedCategories = Object.keys(groupedPrivileges).sort()\n\n    // Sort privileges within each category by name (descending)\n    sortedCategories.forEach(category => {\n      groupedPrivileges[category].sort((a, b) => b.name.localeCompare(a.name))\n    })\n\n    return html`\n      <div titler>${String(i18next.t('label.user'))}</div>\n\n      <div users>${users.map(user => html`<div>${user.name} (${user.email})</div>`)}</div>\n\n      <div titler>${String(i18next.t('field.privileges'))}</div>\n\n      <div>\n        <input id=\"checkAll\" type=\"checkbox\" @change=${e => this.oncheckAll(e)} />\n        <label for=\"checkAll\">Check all</label>\n      </div>\n\n      <ul privileges>\n        ${sortedCategories.map(\n          category => html`\n            <div class=\"category-group\">\n              <div class=\"category-title\">${category}</div>\n              <div class=\"category-privileges\">\n                ${groupedPrivileges[category].map(\n                  /* privilege : {id, name, category, description} */\n                  privilege => html`\n                    <li ?deprecated=${privilege.deprecated}>\n                      <input\n                        type=\"checkbox\"\n                        id=\"${privilege.id}\"\n                        .checked=${privileges.map(p => p.id).indexOf(privilege.id) > -1}\n                        .data-privilege=${privilege}\n                      />\n                      <label for=\"${privilege.id}\">${privilege.description}</label>\n                      ${privilege.deprecated\n                        ? html`<small>${String(i18next.t('text.privilege no longer declared'))}</small>`\n                        : ''}\n                    </li>\n                  `\n                )}\n              </div>\n            </div>\n          `\n        )}\n      </ul>\n\n      <div class=\"button-container\">\n        <md-elevated-button @click=${e => this.onSave()}>${String(i18next.t('button.save'))}</md-elevated-button>\n        <md-elevated-button @click=${e => this.onDeleteRole()} danger\n          >${String(i18next.t('button.delete role'))}</md-elevated-button\n        >\n      </div>\n    `\n  }\n\n  async firstUpdated() {\n    this.allPrivileges = await this.fetchPrivileges()\n  }\n\n  async updated(changes) {\n    if (changes.has('role')) {\n      await this.fetchPrivilegesOnRole(this.role.name)\n    }\n  }\n\n  checkAll(checked) {\n    Array.from(this.renderRoot.querySelectorAll('ul[privileges] input[type=checkbox]')).forEach(\n      checkbox => ((checkbox as HTMLInputElement).checked = checked)\n    )\n  }\n\n  oncheckAll(e) {\n    this.checkAll(e.target.checked)\n  }\n\n  async onSave() {\n    const updateRoleObj = this.updateRoleObj\n    const privileges = Array.from(this.renderRoot.querySelectorAll('ul[privileges] input[type=checkbox]:checked')).map(\n      e => ({ id: e['data-privilege'].id }) // ObjectRef 타입에 맞게 id만 전송\n    )\n\n    const patch = { ...updateRoleObj, privileges: privileges }\n\n    if (this.role) {\n      const response = await client.mutate({\n        mutation: gql`\n          mutation ($id: String!, $patch: RolePatch!) {\n            updateRole(id: $id, patch: $patch) {\n              id\n              name\n              description\n              privileges {\n                id\n                description\n              }\n            }\n          }\n        `,\n        variables: { id: this.role.id, patch },\n        context: gqlContext()\n      })\n\n      if (!response.errors) {\n        await this.dispatchEvent(new CustomEvent('fetch-roles'))\n        this.showToast(i18next.t('text.data_updated_successfully'))\n      }\n    }\n  }\n\n  async onDeleteRole() {\n    if (\n      await OxPrompt.open({\n        title: i18next.t('text.are_you_sure'),\n        text: i18next.t('text.are_you_sure_to_delete_x', { x: i18next.t('label.role') }),\n        confirmButton: { text: i18next.t('button.delete') },\n        cancelButton: { text: i18next.t('button.cancel') }\n      })\n    ) {\n      const response = await client.mutate({\n        mutation: gql`\n          mutation ($id: String!) {\n            deleteRole(id: $id)\n          }\n        `,\n        variables: { id: this.role.id },\n        context: gqlContext()\n      })\n\n      if (!response.errors) {\n        await this.dispatchEvent(new CustomEvent('fetch-roles'))\n\n        await OxPrompt.open({\n          type: 'success',\n          title: i18next.t('text.completed'),\n          text: i18next.t('text.x_deleted_successfully', { x: i18next.t('label.role') }),\n          confirmButton: { text: i18next.t('button.confirm') }\n        })\n      }\n    }\n  }\n\n  async fetchPrivileges() {\n    const response = await client.query({\n      query: gql`\n        query privileges {\n          privileges {\n            items {\n              id\n              name\n              category\n              description\n              deprecated\n            }\n            total\n          }\n        }\n      `\n    })\n\n    return response.data.privileges.items\n  }\n\n  async fetchPrivilegesOnRole(name) {\n    const response = await client.query({\n      query: gql`\n        query ($name: String!) {\n          role(name: $name) {\n            id\n            name\n            privileges {\n              id\n              description\n            }\n            users {\n              name\n              email\n            }\n          }\n        }\n      `,\n      variables: { name },\n      context: gqlContext()\n    })\n\n    this.privileges = response.data.role?.privileges\n    this.users = response.data.role?.users\n  }\n\n  showToast(message) {\n    document.dispatchEvent(new CustomEvent('notify', { detail: { message, option: { timer: 1000 } } }))\n  }\n}\n"]}

package/dist-client/pages/role/role-management.d.ts

@@ -1,4 +0,0 @@
-import '@things-factory/component-ui';
-import '../../components/create-role.js';
-import '../../components/role-edit-form.js';
-import '../../components/role-privilege-editor.js';