@things-factory/auth-ui 10.1.254 → 10.1.257

package/dist-client/pages/role/role-privilege-page.js

@@ -6,7 +6,8 @@ import '@operato/input/ox-input-search.js';
 import gql from 'graphql-tag';
 import { css, html, nothing } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
-import { client, gqlContext } from '@operato/graphql';
+import { live } from 'lit/directives/live.js';
+import { client, gqlContext, MutationController, QueryController } from '@operato/graphql';
 import { i18next, localize } from '@operato/i18n';
 import { KNOWN_AXES, axisLabel } from '../../utils/privilege-axis.js';
 import { openPopup } from '@operato/layout';
@@ -72,7 +73,104 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
         this.showUnheldTasks = false;
         /** null until asked for; [] when this person may not read templates (`roleTemplates` asks user:mutation). */
         this.templates = null;
-        this.gap = null;
+        /**
+         * 한 번의 질의로 **전체 권한과 이 역할이 가진 것**을 함께 읽는다(`rolePrivileges(roleId:)`).
+         *
+         * 역할 이름과 가진 사람은 `roles(filters: id)` 로 같은 문서에서 받는다 — 옛 편집기는 역할을
+         * **이름**으로 다시 찾았고, 부모 도메인에 같은 이름이 있으면 남의 역할을 그렸다.
+         *
+         * A declared read (ADR-0190): another role reads again, and an answer for the role left never lands.
+         */
+        this.roleRead = new QueryController(this, gql `
+        query ($roleId: String!, $filters: [Filter!]) {
+          rolePrivileges(roleId: $roleId) {
+            id
+            name
+            category
+            description
+            assigned
+            deprecated
+          }
+          roles(filters: $filters) {
+            items {
+              id
+              name
+              description
+              templateId
+              domain {
+                id
+                name
+                subdomain
+              }
+              users {
+                id
+                name
+                email
+              }
+              taskCoverage {
+                tasks {
+                  taskId
+                  module
+                  status
+                  held { ${GRANT_FIELDS} }
+                  missing { ${GRANT_FIELDS} }
+                  undeclared { ${GRANT_FIELDS} }
+                }
+                unclassified { ${GRANT_FIELDS} }
+              }
+            }
+          }
+        }
+`, {
+            variables: () => {
+                const roleId = this.lifecycle?.resourceId;
+                return roleId ? { roleId, filters: [{ name: 'id', operator: 'eq', value: roleId }] } : undefined;
+            },
+            context: gqlContext()
+        });
+        /** The role against its base template, read while the comparison is open - again for another role or base. */
+        this.gapRead = new QueryController(this, gql `
+      query ($filters: [Filter!]) {
+        roles(filters: $filters) {
+          items {
+            id
+            templateGap {
+              templateId
+              templateName
+              missing { ${GRANT_FIELDS} }
+              missingCount
+              extra { ${GRANT_FIELDS} }
+              extraCount
+            }
+          }
+        }
+      }
+    `, {
+            variables: () => {
+                const roleId = this.shownRoleId;
+                return this.view === 'template' && roleId && this.subject.templateId
+                    ? { filters: [{ name: 'id', operator: 'eq', value: roleId }] }
+                    : undefined;
+            },
+            context: gqlContext()
+        });
+        /** The role's base, saved one change at a time: the choice is locked while one is out, then shows what was saved. */
+        this.baseSave = new MutationController(this, gql `
+      mutation ($id: String!, $patch: RolePatch!) {
+        updateRole(id: $id, patch: $patch) {
+          id
+          templateId
+        }
+      }
+    `, { context: gqlContext() });
+        /** What the role lacks against its base, added once at a time; the role and its comparison read again after. */
+        this.templateTopUp = new MutationController(this, gql `
+      mutation ($templateId: String!, $name: String) {
+        createRoleFromTemplate(templateId: $templateId, name: $name) {
+          id
+        }
+      }
+    `, { context: gqlContext(), refetch: () => [this.roleRead, this.gapRead] });
     }
     static { this.styles = [
         /* The frame owns the page shell; the two panes are the content it sizes (ADR-0060 decision 8). */
@@ -615,6 +713,18 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
       }
     `
     ]; }
+    /** The role shown, once its read is taken - what every action here acts on. */
+    get shownRoleId() {
+        return this.fetchState === 'loaded' && this.subject?.id === this.lifecycle?.resourceId ? this.subject.id : undefined;
+    }
+    /**
+     * The comparison against the base the role has now. Another role reads it again (the read's variables change, so the
+     * one before is gone); another base does not, so a comparison with the base before is none until it is read again.
+     */
+    get gap() {
+        const gap = this.gapRead.data?.roles?.items?.[0]?.templateGap;
+        return gap?.templateId === this.subject.templateId ? gap : null;
+    }
     /**
      * 부모 도메인의 역할은 여기서 못 고친다 — `updateRole` 의 범위가 `domain.id` 하나다.
      * 목록이 상속으로 보여 주므로 관리자가 여기까지 온다. 읽기 전용으로 두고 어디로 가야 하는지
@@ -628,8 +738,12 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
     ownerDomainName() {
         return this.subject?.domain?.name || this.subject?.domain?.subdomain || '';
     }
+    /**
+     * The privileges can be changed: the role is read, is this site's own, and no change of it is out - a save or a
+     * top-up from the template reads the role again when it is done, and that read would put back what was typed meanwhile.
+     */
     get savable() {
-        return this.fetchState === 'loaded' && !this.saving && !this.inherited;
+        return this.fetchState === 'loaded' && !this.saving && !this.inherited && !this.templateTopUp.pending;
     }
     get visibleModules() {
         return filterPrivilegeModules(this.modules, this.keyword, moduleLabel);
@@ -852,7 +966,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
     taskEditButton(task) {
         if (this.inherited || task.status === 'broken')
             return nothing;
-        const disabled = this.dirty || this.saving;
+        const disabled = this.dirty || !this.savable;
         const why = this.dirty ? i18next.t('text.save before editing by task') : '';
         return html `
       ${task.status !== 'all'
@@ -865,7 +979,9 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
     }
     /** Adds a task's missing privileges to the role, or takes its own off - after showing which - and saves. */
     async editTask(task, mode) {
-        if (this.dirty || this.saving || this.inherited)
+        const roleId = this.shownRoleId;
+        const coverage = this.coverage;
+        if (!roleId || this.dirty || !this.savable)
             return;
         const name = taskName(task.taskId);
         const { remove, kept } = mode === 'remove' ? pairsToRemove(task, this.coverage.tasks) : { remove: [], kept: [] };
@@ -888,7 +1004,8 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
             confirmButton: { text: i18next.t(mode === 'add' ? 'button.add task' : 'button.remove task') },
             cancelButton: { text: i18next.t('button.cancel') }
         });
-        if (!confirmed)
+        /* The task was read for one role: a screen that moved on, or read the role again, is not changed by it. */
+        if (!confirmed || this.shownRoleId !== roleId || this.coverage !== coverage || this.dirty || !this.savable)
             return;
         const idOf = new Map(this.modules.flatMap(module => module.cells.map(cell => [pairOf(module.category, cell.axis), cell.id])));
         const next = new Set(this.assigned);
@@ -930,7 +1047,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
      * words (경영지원, 인사급여) is given its base here, once, and the role list counts what it lacks from then on.
      * Picking saves the base at once and touches no privilege. The role is never renamed to make a pair: an approval line
      * holds the role. What the role holds beyond the template is shown as wider, not wrong — the site may have widened it
-     * on purpose — and nothing takes it away. What it lacks can be added; adding is the same top-up the template button
+     * on purpose. Extras can be removed after explicit confirmation. What it lacks can be added; adding is the same top-up the template button
      * on the role list runs (`createRoleFromTemplate` onto this role's name).
      */
     renderTemplate() {
@@ -945,7 +1062,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
         const gap = this.gap;
         return html `
       <div review>
-        <select ?disabled=${this.inherited || this.saving} @change=${(event) => this.setBaseTemplate(event.target.value)}>
+        <select .value=${live(baseId)} ?disabled=${this.inherited || this.saving || this.baseSave.pending} @change=${(event) => this.setBaseTemplate(event.target.value)}>
           <option value="" ?selected=${!baseId}>${i18next.t('text.no base template')}</option>
           ${this.templates.map(one => html `<option value=${one.id} ?selected=${one.id === baseId}>${one.name}</option>`)}
           ${baseId && !template ? html `<option value=${baseId} selected>${baseId}</option>` : nothing}
@@ -961,7 +1078,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
                   ${i18next.t('label.missing against the template')}
                   <span count>${gap.missingCount}</span>
                   ${gap.missingCount && !this.inherited
-                ? html `<button quiet ?disabled=${this.dirty || this.saving || Boolean(template?.definitionErrors.length)} @click=${() => this.addMissing()}>
+                ? html `<button quiet ?disabled=${this.dirty || !this.savable || Boolean(template?.definitionErrors.length)} @click=${() => this.addMissing()}>
                           ${i18next.t('button.add')}
                         </button>`
                 : nothing}
@@ -970,6 +1087,11 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
                 <h4>
                   ${i18next.t('label.wider than the template')}
                   <span count>${gap.extraCount}</span>
+                  ${gap.extraCount && !this.inherited ? html `
+                    <button quiet ?disabled=${this.dirty || !this.savable} @click=${() => this.removeExtra()}>
+                      ${i18next.t('button.remove extra privileges')}
+                    </button>
+                  ` : nothing}
                 </h4>
                 ${gap.extraCount ? this.renderSentences(gap.extra) : nothing}
               `
@@ -1003,70 +1125,58 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
         /* Reading templates asks the same door creating a role does; without it there is nothing to compare with. */
         const templates = response.errors?.length ? [] : response.data?.roleTemplates || [];
         this.templates = templates;
-        await this.readGap();
     }
     /** Saves the role's base template - `''` bases it on none. The privileges stay as they are. */
     async setBaseTemplate(templateId) {
-        if (this.inherited || this.saving)
+        const roleId = this.shownRoleId;
+        if (!roleId || this.inherited || this.saving || this.baseSave.pending)
             return;
-        const response = await client.mutate({
-            mutation: gql `
-        mutation ($id: String!, $patch: RolePatch!) {
-          updateRole(id: $id, patch: $patch) {
-            id
-            templateId
-          }
-        }
-      `,
-            variables: { id: this.subject.id, patch: { templateId: templateId || null } },
-            context: gqlContext()
-        });
-        if (response.errors?.length) {
-            document.dispatchEvent(new CustomEvent('notify', { detail: { level: 'error', message: response.errors[0]?.message } }));
-            this.requestUpdate();
+        const saved = await this.baseSave.run({ id: roleId, patch: { templateId: templateId || null } });
+        /* Saved for the role it was sent for: a screen that moved on to another role keeps that one's base. */
+        if (this.shownRoleId !== roleId)
             return;
-        }
-        this.subject = { ...this.subject, templateId: response.data?.updateRole?.templateId || null };
-        await this.readGap();
+        /* Refused (the link said why): the choice goes back to the base saved. */
+        if (!saved)
+            return this.requestUpdate();
+        this.subject = { ...this.subject, templateId: saved.updateRole?.templateId || null };
+        await this.gapRead.refetch();
     }
-    async readGap() {
-        this.gap = null;
-        const baseId = this.subject?.templateId;
-        if (!baseId)
+    /** Remove only the displayed extras, after explicit confirmation for this role and snapshot. */
+    async removeExtra() {
+        const gap = this.gap;
+        if (!gap?.extraCount || !this.active || !this.savable || this.dirty)
             return;
-        const response = await client.query({
-            query: gql `
-        query ($filters: [Filter!]) {
-          roles(filters: $filters) {
-            items {
-              id
-              templateGap {
-                templateId
-                templateName
-                missing { ${GRANT_FIELDS} }
-                missingCount
-                extra { ${GRANT_FIELDS} }
-                extraCount
-              }
-            }
-          }
-        }
-      `,
-            variables: { filters: [{ name: 'id', operator: 'eq', value: this.subject.id }] },
-            context: gqlContext()
+        const roleId = this.shownRoleId;
+        if (!roleId)
+            return;
+        const assigned = this.assigned;
+        const list = gap.extra.flatMap(grant => grant.axes.map(axis => this.sentenceOf(grant.category, axis))).join(', ');
+        const confirmed = await OxPrompt.open({
+            type: 'warning',
+            title: i18next.t('button.remove extra privileges'),
+            text: i18next.t('text.remove extra privileges', { role: this.subject.name, template: gap.templateName, count: gap.extraCount, list }),
+            confirmButton: { text: i18next.t('button.delete') },
+            cancelButton: { text: i18next.t('button.cancel') }
         });
-        if (response.errors?.length) {
-            document.dispatchEvent(new CustomEvent('notify', { detail: { level: 'error', message: response.errors[0]?.message } }));
+        // A confirmation for an earlier role, comparison or edit must never change the current screen.
+        if (!confirmed || this.shownRoleId !== roleId || this.gap !== gap || this.assigned !== assigned || !this.active || !this.savable || this.dirty)
             return;
-        }
-        if (this.subject?.templateId === baseId)
-            this.gap = response.data?.roles?.items?.[0]?.templateGap || null;
+        const extras = new Set(gap.extra.flatMap(grant => grant.axes.map(axis => pairOf(grant.category, axis))));
+        const removeIds = new Set(this.modules.flatMap(module => module.cells
+            .filter(cell => extras.has(pairOf(module.category, cell.axis)))
+            .map(cell => cell.id)));
+        this.assigned = new Set([...assigned].filter(id => !removeIds.has(id)));
+        this.dirty = true;
+        await this.onSave();
+        await this.gapRead.refetch();
     }
     /** Adds what the role lacks against the picked template — after showing what it adds. */
     async addMissing() {
         const gap = this.gap;
-        if (!gap?.missingCount || this.dirty || this.inherited)
+        const roleId = this.shownRoleId;
+        if (!gap?.missingCount || !roleId || this.dirty || !this.savable)
             return;
+        const roleName = this.subject.name;
         const list = gap.missing.flatMap(grant => grant.axes.map(axis => this.sentenceOf(grant.category, axis))).join(', ');
         const confirmed = await OxPrompt.open({
             type: 'info',
@@ -1075,26 +1185,12 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
             confirmButton: { text: i18next.t('button.add') },
             cancelButton: { text: i18next.t('button.cancel') }
         });
-        if (!confirmed)
-            return;
-        const response = await client.mutate({
-            mutation: gql `
-        mutation ($templateId: String!, $name: String) {
-          createRoleFromTemplate(templateId: $templateId, name: $name) {
-            id
-          }
-        }
-      `,
-            variables: { templateId: gap.templateId, name: this.subject.name },
-            context: gqlContext()
-        });
-        if (response.errors?.length) {
-            document.dispatchEvent(new CustomEvent('notify', { detail: { level: 'error', message: response.errors[0]?.message } }));
+        /* Added to the role the comparison was read for, by that comparison - never to a role the screen moved to. */
+        if (!confirmed || this.shownRoleId !== roleId || this.gap !== gap || this.dirty || !this.savable)
             return;
+        if (await this.templateTopUp.run({ templateId: gap.templateId, name: roleName })) {
+            document.dispatchEvent(new CustomEvent('notify', { detail: { message: i18next.t('text.data_updated_successfully') } }));
         }
-        document.dispatchEvent(new CustomEvent('notify', { detail: { message: i18next.t('text.data_updated_successfully') } }));
-        await this.fetch();
-        await this.readGap();
     }
     /**
      * 한 줄 — 문장과 [떼기].
@@ -1113,7 +1209,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
 
         ${this.inherited
             ? nothing
-            : html `<button drop title=${i18next.t('button.drop')} @click=${() => this.onToggle(cell.id, false)}>
+            : html `<button drop ?disabled=${!this.savable} title=${i18next.t('button.drop')} @click=${() => this.onToggle(cell.id, false)}>
                 <md-icon>close</md-icon>
               </button>`}
       </li>
@@ -1273,14 +1369,14 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
             return html `
             <li
               ?ghost=${cell.deprecated}
-              ?readonly=${this.inherited || (cell.deprecated && !on)}
+              ?readonly=${!this.savable || (cell.deprecated && !on)}
               @click=${(event) => this.toggleCellFromRow(event, cell, on)}
             >
               <input
                 type="checkbox"
                 id="cell-${cell.id}"
                 .checked=${on}
-                ?disabled=${this.inherited || (cell.deprecated && !on)}
+                ?disabled=${!this.savable || (cell.deprecated && !on)}
                 @change=${(e) => this.onToggle(cell.id, e.target.checked)}
               />
               <label for="cell-${cell.id}">${axisLabel(cell.axis)}</label>
@@ -1298,80 +1394,44 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
     cellCount() {
         return this.modules.reduce((sum, module) => sum + module.cells.length, 0);
     }
+    /* The shell sets `lifecycle`; the role read follows it. A late call for an earlier address never sets it back. */
     async pageUpdated(changes, lifecycle) {
         if (this.active) {
-            this.lifecycle = lifecycle;
-            await this.fetch();
+            this.mySubdomain = (await getDomain())?.subdomain || '';
+            if (this.active && this.lifecycle?.resourceId === lifecycle.resourceId && lifecycle.params?.view === 'template') {
+                await this.showView('template');
+            }
         }
     }
+    /** Reads the role's privileges again - the save just wrote them, or the read failed and the person asks again. */
+    async fetch() {
+        await this.roleRead.refetch();
+    }
     /**
-     * 한 번의 질의로 **전체 권한과 이 역할이 가진 것**을 함께 읽는다(`rolePrivileges(roleId:)`).
-     *
-     * 역할 이름과 가진 사람은 `roles(filters: id)` 로 같은 문서에서 받는다 — 옛 편집기는 역할을
-     * **이름**으로 다시 찾았고, 부모 도메인에 같은 이름이 있으면 남의 역할을 그렸다.
+     * What the role read says, taken into the page before it draws (ADR-0190): loading, failed - a thrown read too - or
+     * the role, whose privileges become the page's edits once per answer.
      */
-    async fetch() {
-        const roleId = this.lifecycle?.resourceId;
-        if (!roleId) {
+    willUpdate() {
+        const read = this.roleRead;
+        if (!this.lifecycle)
+            return;
+        if (!this.lifecycle.resourceId) {
             this.fetchState = 'failed';
             this.loadError = new Error(i18next.t('text.no role to show'));
             return;
         }
-        this.fetchState = 'loading';
-        this.loadError = null;
-        this.mySubdomain = (await getDomain())?.subdomain || '';
-        const response = await client.query({
-            query: gql `
-        query ($roleId: String!, $filters: [Filter!]) {
-          rolePrivileges(roleId: $roleId) {
-            id
-            name
-            category
-            description
-            assigned
-            deprecated
-          }
-          roles(filters: $filters) {
-            items {
-              id
-              name
-              description
-              templateId
-              domain {
-                id
-                name
-                subdomain
-              }
-              users {
-                id
-                name
-                email
-              }
-              taskCoverage {
-                tasks {
-                  taskId
-                  module
-                  status
-                  held { ${GRANT_FIELDS} }
-                  missing { ${GRANT_FIELDS} }
-                  undeclared { ${GRANT_FIELDS} }
-                }
-                unclassified { ${GRANT_FIELDS} }
-              }
-            }
-          }
-        }
-      `,
-            variables: { roleId, filters: [{ name: 'id', operator: 'eq', value: roleId }] },
-            context: gqlContext()
-        });
-        if (response.errors?.length) {
+        if (read.error) {
             /* 실패를 「권한이 하나도 없다」로 그리지 않는다 — 저장하면 실제로 그렇게 된다. */
             this.fetchState = 'failed';
-            this.loadError = response.errors;
+            this.loadError = read.error;
+            return;
+        }
+        if (read.loading || !read.data) {
+            this.fetchState = 'loading';
+            this.loadError = null;
             return;
         }
-        const role = response.data?.roles?.items?.[0];
+        const role = read.data.roles?.items?.[0];
         /*
          * A role id nobody has resolves with no error and no role, so the screen drew an empty
          * privilege list - a role that is gone looked exactly like a role that has been granted
@@ -1382,17 +1442,15 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
             this.loadError = new Error(i18next.t('text.this role no longer exists'));
             return;
         }
-        this.subject = role;
-        this.holders = this.subject.users || [];
-        this.coverage = role.taskCoverage || { tasks: [], unclassified: [] };
-        this.build(response.data?.rolePrivileges || []);
+        if (read.data !== this.taken) {
+            this.taken = read.data;
+            this.subject = role;
+            this.holders = role.users || [];
+            this.coverage = role.taskCoverage || { tasks: [], unclassified: [] };
+            this.build(read.data.rolePrivileges || []);
+        }
         this.fetchState = 'loaded';
-        /*
-         * The shell reads `context` once, when the page becomes active - before this fetch
-         * resolves. Without this call the header keeps the fallback, so the screen showed
-         * "권한" and never said which role was being edited.
-         */
-        this.updateContext();
+        this.loadError = null;
     }
     /** 평평한 목록을 모듈로 접는다. 축 순서는 아는 것 먼저, 나머지는 이름 순. */
     build(privileges) {
@@ -1422,7 +1480,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
         }
     }
     onToggle(id, checked) {
-        if (this.assigned.has(id) === checked) {
+        if (!this.savable || this.assigned.has(id) === checked) {
             return;
         }
         const next = new Set(this.assigned);
@@ -1435,7 +1493,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
     }
     /** 라벨·설명을 포함한 행 전체를 누를 수 있게 한다. checkbox와 키보드 Space는 native change가 맡는다. */
     toggleCellFromRow(event, cell, on) {
-        if (this.inherited || (cell.deprecated && !on) || event.target instanceof HTMLInputElement) {
+        if (!this.savable || (cell.deprecated && !on) || event.target instanceof HTMLInputElement) {
             return;
         }
         /* label의 기본 동작이 checkbox change를 한 번 더 보내지 않게 막는다. */
@@ -1462,7 +1520,8 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
      * `privileges` 만 보낸다 — 이름과 설명은 목록 격자가 소유한다.
      */
     async onSave() {
-        if (!this.savable) {
+        const roleId = this.shownRoleId;
+        if (!roleId || !this.savable) {
             return;
         }
         this.saving = true;
@@ -1477,7 +1536,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
           }
         `,
                 variables: {
-                    id: this.subject.id,
+                    id: roleId,
                     patch: { privileges: [...this.assigned].map(id => ({ id })) }
                 },
                 context: gqlContext()
@@ -1487,6 +1546,9 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
                 return;
             }
             document.dispatchEvent(new CustomEvent('notify', { detail: { message: i18next.t('text.data_updated_successfully') } }));
+            /* Saved while the screen moved on: what is edited there now is another role's, and stays. */
+            if (this.shownRoleId !== roleId)
+                return;
             /* 유령을 뗐으면 목록에서 사라져야 하고, 켠 것이 요약에 반영돼야 한다. */
             await this.fetch();
             this.dirty = false;
@@ -1561,10 +1623,6 @@ __decorate([
     state(),
     __metadata("design:type", Object)
 ], RolePrivilegePage.prototype, "templates", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], RolePrivilegePage.prototype, "gap", void 0);
 RolePrivilegePage = __decorate([
     customElement('role-privilege-page')
 ], RolePrivilegePage);