@things-factory/auth-ui 10.1.256 → 10.1.258

package/dist-client/entries/oauth2/oauth2-decision-page.js

@@ -4,7 +4,7 @@ import '../../components/role-selector.js';
 import gql from 'graphql-tag';
 import { css, html, LitElement } from 'lit';
 import { customElement, property, query } from 'lit/decorators.js';
-import { client } from '@operato/graphql';
+import { QueryController } from '@operato/graphql';
 import { i18next } from '@operato/i18n';
 import { OxPrompt } from '@operato/popup/ox-prompt.js';
 import { ButtonContainerStyles } from '@operato/styles';
@@ -19,7 +19,15 @@ let OAuth2DecisionPage = class OAuth2DecisionPage extends LitElement {
         this.req = {};
         this.redirectURI = '';
         this.transactionID = '';
-        this.roles = [];
+        this.myRoles = new QueryController(this, gql `
+      query myRoles {
+        myRoles {
+          id
+          name
+          description
+        }
+      }
+    `);
     }
     static { this.styles = [
         EntryControlSizeStyles,
@@ -75,6 +83,9 @@ let OAuth2DecisionPage = class OAuth2DecisionPage extends LitElement {
       }
     `
     ]; }
+    get roles() {
+        return this.myRoles.data?.myRoles ?? [];
+    }
     render() {
         return html `
       <h2>Application Binding</h2>
@@ -116,9 +127,6 @@ let OAuth2DecisionPage = class OAuth2DecisionPage extends LitElement {
       </div>
     `;
     }
-    async firstUpdated() {
-        this.fetchMyRoles();
-    }
     updated(changedProps) {
         if (changedProps.has('data')) {
             this.user = this.data?.oauth2?.user || this.user;
@@ -129,22 +137,6 @@ let OAuth2DecisionPage = class OAuth2DecisionPage extends LitElement {
             this.transactionID = this.data?.oauth2?.transactionID || this.transactionID;
         }
     }
-    async fetchMyRoles() {
-        const response = await client.query({
-            query: gql `
-        query myRoles {
-          myRoles {
-            id
-            name
-            description
-          }
-        }
-      `
-        });
-        if (!response.errors?.length) {
-            this.roles = response.data.myRoles;
-        }
-    }
     async decision(allowOrCancel) {
         const selectedRoles = this.selectedRoles();
         if (allowOrCancel && !selectedRoles?.length) {
@@ -212,10 +204,6 @@ __decorate([
     property({ type: String }),
     __metadata("design:type", String)
 ], OAuth2DecisionPage.prototype, "transactionID", void 0);
-__decorate([
-    property({ type: Array }),
-    __metadata("design:type", Array)
-], OAuth2DecisionPage.prototype, "roles", void 0);
 __decorate([
     query('role-selector'),
     __metadata("design:type", Object)

package/dist-client/entries/oauth2/oauth2-decision-page.js.map

@@ -1 +1 @@
-{"version":3,"file":"oauth2-decision-page.js","sourceRoot":"","sources":["../../../client/entries/oauth2/oauth2-decision-page.ts"],"names":[],"mappings":";AAAA,OAAO,yCAAyC,CAAA;AAChD,OAAO,mCAAmC,CAAA;AAE1C,OAAO,GAAG,MAAM,aAAa,CAAA;AAC7B,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,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAA;AACvD,OAAO,EAAE,sBAAsB,EAAE,MAAM,oCAAoC,CAAA;AAG3E,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,UAAU;IAA3C;;QAwD8B,SAAI,GAAQ,EAAE,CAAA;QACd,SAAI,GAAQ,EAAE,CAAA;QACd,WAAM,GAAQ,EAAE,CAAA;QAChB,WAAM,GAAQ,EAAE,CAAA;QAChB,QAAG,GAAQ,EAAE,CAAA;QACb,gBAAW,GAAW,EAAE,CAAA;QACxB,kBAAa,GAAW,EAAE,CAAA;QAC3B,UAAK,GAAU,EAAE,CAAA;IA0H9C,CAAC;aAxLQ,WAAM,GAAG;QACd,sBAAsB;QACtB,qBAAqB;QACrB,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAiDF;KACF,AArDY,CAqDZ;IAaD,MAAM;QACJ,OAAO,IAAI,CAAA;;cAED,IAAI,CAAC,IAAI,CAAC,IAAI;eACb,IAAI,CAAC,MAAM,CAAC,IAAI;;;;;;eAMhB,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC;qCACJ,IAAI,CAAC,MAAM,CAAC,SAAS;;;;eAI3C,OAAO,CAAC,CAAC,CAAC,iBAAiB,CAAC;qCACN,IAAI,CAAC,GAAG,CAAC,QAAQ;;;;;;eAMvC,OAAO,CAAC,CAAC,CAAC,oBAAoB,CAAC;qCACT,IAAI,CAAC,WAAW;;;;eAItC,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC;qCACF,IAAI,CAAC,GAAG,CAAC,KAAK;;;;;sCAKb,IAAI,CAAC,MAAM,CAAC,IAAI,aAAa,IAAI,CAAC,KAAK;;;sCAGvC,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;sCACzB,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;;KAE3D,CAAA;IACH,CAAC;IAED,KAAK,CAAC,YAAY;QAChB,IAAI,CAAC,YAAY,EAAE,CAAA;IACrB,CAAC;IAED,OAAO,CAAC,YAAY;QAClB,IAAI,YAAY,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;YAC7B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,IAAI,IAAI,CAAC,IAAI,CAAA;YAChD,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,IAAI,IAAI,CAAC,MAAM,CAAA;YACtD,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,IAAI,EAAE,MAAM,IAAI,IAAI,CAAC,MAAM,CAAA;YAC9C,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,IAAI,IAAI,CAAC,GAAG,CAAA;YAC7C,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,WAAW,IAAI,IAAI,CAAC,WAAW,CAAA;YACrE,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,aAAa,IAAI,IAAI,CAAC,aAAa,CAAA;QAC7E,CAAC;IACH,CAAC;IAED,KAAK,CAAC,YAAY;QAChB,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;YAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;OAQT;SACF,CAAC,CAAA;QAEF,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC;YAC7B,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAA;QACpC,CAAC;IACH,CAAC;IAED,KAAK,CAAC,QAAQ,CAAC,aAAa;QAC1B,MAAM,aAAa,GAAG,IAAI,CAAC,aAAa,EAAE,CAAA;QAC1C,IAAI,aAAa,IAAI,CAAC,aAAa,EAAE,MAAM,EAAE,CAAC;YAC5C,MAAM,QAAQ,CAAC,IAAI,CAAC;gBAClB,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,wBAAwB,CAAC;gBAC1C,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,sCAAsC,EAAE,EAAE,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,CAAC;gBACvF,aAAa,EAAE,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC,EAAE;aACrD,CAAC,CAAA;YAEF,OAAM;QACR,CAAC;QAED,IAAI,IAAI,GAAQ;YACd,cAAc,EAAE,IAAI,CAAC,aAAa;YAClC,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,SAAS;YAChC,MAAM,EAAE,IAAI,CAAC,GAAG,CAAC,QAAQ;YACzB,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,KAAK;YACrB,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,KAAK;YACtB,MAAM,EAAE,aAAa;SACtB,CAAA;QACD,IAAI,CAAC,aAAa,EAAE,CAAC;YACnB,IAAI,CAAC,MAAM,GAAG,MAAM,CAAA;QACtB,CAAC;QAED,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,iBAAiB,EAAE;YAC9C,MAAM,EAAE,MAAM;YACd,IAAI,EAAE,MAAM;YACZ,WAAW,EAAE,SAAS;YACtB,OAAO,EAAE;gBACP,cAAc,EAAE,kBAAkB;aACnC;YACD,QAAQ,EAAE,QAAQ;YAClB,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;SAC3B,CAAC,CAAA;QAEF,IAAI,QAAQ,CAAC,UAAU,EAAE,CAAC;YACxB,QAAQ,CAAC,IAAI,GAAG,QAAQ,CAAC,GAAG,CAAA;QAC9B,CAAC;IACH,CAAC;IAED,aAAa;QACX,OAAO,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,CAAA;IAC1C,CAAC;;AAhI2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;gDAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;gDAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;kDAAiB;AAChB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;kDAAiB;AAChB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;+CAAc;AACb;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;uDAAyB;AACxB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;yDAA2B;AAC3B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;;iDAAkB;AAEpB;IAAvB,KAAK,CAAC,eAAe,CAAC;;wDAA4D;AAjE/E,kBAAkB;IADvB,aAAa,CAAC,iBAAiB,CAAC;GAC3B,kBAAkB,CAyLvB","sourcesContent":["import '@material/web/button/elevated-button.js'\nimport '../../components/role-selector.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next } from '@operato/i18n'\nimport { OxPrompt } from '@operato/popup/ox-prompt.js'\nimport { ButtonContainerStyles } from '@operato/styles'\nimport { EntryControlSizeStyles } from '../../entry-control-size-styles.js'\n\n@customElement('oauth2-decision')\nclass OAuth2DecisionPage extends LitElement {\n  static styles = [\n    EntryControlSizeStyles,\n    ButtonContainerStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n\n        border: 1px solid var(--md-sys-color-primary);\n        margin: var(--spacing-medium);\n        padding: var(--spacing-medium);\n        font: normal 15px var(--theme-font);\n        color: var(--md-sys-color-secondary);\n      }\n\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\n      [field] {\n        display: flex;\n        flex-direction: column;\n        padding-bottom: var(--spacing-medium);\n      }\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\n      label {\n        display: flex;\n        flex-direction: column;\n        font: var(--label-font);\n        color: var(--label-color, var(--md-sys-color-on-surface));\n        text-transform: var(--label-text-transform);\n      }\n\n      md-elevated-button {\n        margin-right: var(--spacing-small);\n      }\n    `\n  ]\n\n  @property({ type: Object }) data: any = {}\n  @property({ type: Object }) user: any = {}\n  @property({ type: Object }) client: any = {}\n  @property({ type: Object }) domain: any = {}\n  @property({ type: Object }) req: any = {}\n  @property({ type: String }) redirectURI: string = ''\n  @property({ type: String }) transactionID: string = ''\n  @property({ type: Array }) roles: any[] = []\n\n  @query('role-selector') roleSelector!: HTMLElement & { selectedRoles: () => any[] }\n\n  render() {\n    return html`\n      <h2>Application Binding</h2>\n      <p>Hi ${this.user.name}!</p>\n      <p><b> ${this.client.name} </b> is requesting access to your account.</p>\n      <p>Do you approve?</p>\n\n      <form field-2column>\n        <div field>\n          <label\n            >${i18next.t('label.company')}\n            <input readonly value=\"${this.domain.subdomain}\" />\n          </label>\n\n          <label\n            >${i18next.t('label.client-id')}\n            <input readonly value=\"${this.req.clientID}\" />\n          </label>\n        </div>\n\n        <div field>\n          <label\n            >${i18next.t('label.redirect_uri')}\n            <input readonly value=\"${this.redirectURI}\" />\n          </label>\n\n          <label\n            >${i18next.t('label.state')}\n            <input readonly value=\"${this.req.state}\" />\n          </label>\n        </div>\n      </form>\n\n      <role-selector .roleCategory=\"${this.domain.name}\" .roles=\"${this.roles}\"></role-selector>\n\n      <div class=\"button-container\">\n        <md-elevated-button @click=\"${() => this.decision(true)}\" raised label=\"Allow\"></md-elevated-button>\n        <md-elevated-button @click=\"${() => this.decision(false)}\" raised danger label=\"Deny\"></md-elevated-button>\n      </div>\n    `\n  }\n\n  async firstUpdated() {\n    this.fetchMyRoles()\n  }\n\n  updated(changedProps) {\n    if (changedProps.has('data')) {\n      this.user = this.data?.oauth2?.user || this.user\n      this.client = this.data?.oauth2?.client || this.client\n      this.domain = this.data?.domain || this.domain\n      this.req = this.data?.oauth2?.req || this.req\n      this.redirectURI = this.data?.oauth2?.redirectURI || this.redirectURI\n      this.transactionID = this.data?.oauth2?.transactionID || this.transactionID\n    }\n  }\n\n  async fetchMyRoles() {\n    const response = await client.query({\n      query: gql`\n        query myRoles {\n          myRoles {\n            id\n            name\n            description\n          }\n        }\n      `\n    })\n\n    if (!response.errors?.length) {\n      this.roles = response.data.myRoles\n    }\n  }\n\n  async decision(allowOrCancel) {\n    const selectedRoles = this.selectedRoles()\n    if (allowOrCancel && !selectedRoles?.length) {\n      await OxPrompt.open({\n        title: i18next.t('title.nothing selected'),\n        text: i18next.t('text.should select at least one of x', { x: i18next.t('label.role') }),\n        confirmButton: { text: i18next.t('button.confirm') }\n      })\n\n      return\n    }\n\n    let data: any = {\n      transaction_id: this.transactionID,\n      subdomain: this.domain.subdomain,\n      appKey: this.req.clientID,\n      state: this.req.state,\n      email: this.user.email,\n      scopes: selectedRoles\n    }\n    if (!allowOrCancel) {\n      data.cancel = 'Deny'\n    }\n\n    const response = await fetch('/oauth/decision', {\n      method: 'POST',\n      mode: 'cors',\n      credentials: 'include',\n      headers: {\n        'Content-Type': 'application/json'\n      },\n      redirect: 'follow',\n      body: JSON.stringify(data)\n    })\n\n    if (response.redirected) {\n      location.href = response.url\n    }\n  }\n\n  selectedRoles() {\n    return this.roleSelector.selectedRoles()\n  }\n}\n"]}
+{"version":3,"file":"oauth2-decision-page.js","sourceRoot":"","sources":["../../../client/entries/oauth2/oauth2-decision-page.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/button/elevated-button.js'\nimport '../../components/role-selector.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { QueryController } from '@operato/graphql'\nimport { i18next } from '@operato/i18n'\nimport { OxPrompt } from '@operato/popup/ox-prompt.js'\nimport { ButtonContainerStyles } from '@operato/styles'\nimport { EntryControlSizeStyles } from '../../entry-control-size-styles.js'\n\n@customElement('oauth2-decision')\nclass OAuth2DecisionPage extends LitElement {\n  static styles = [\n    EntryControlSizeStyles,\n    ButtonContainerStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n\n        border: 1px solid var(--md-sys-color-primary);\n        margin: var(--spacing-medium);\n        padding: var(--spacing-medium);\n        font: normal 15px var(--theme-font);\n        color: var(--md-sys-color-secondary);\n      }\n\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\n      [field] {\n        display: flex;\n        flex-direction: column;\n        padding-bottom: var(--spacing-medium);\n      }\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\n      label {\n        display: flex;\n        flex-direction: column;\n        font: var(--label-font);\n        color: var(--label-color, var(--md-sys-color-on-surface));\n        text-transform: var(--label-text-transform);\n      }\n\n      md-elevated-button {\n        margin-right: var(--spacing-small);\n      }\n    `\n  ]\n\n  @property({ type: Object }) data: any = {}\n  @property({ type: Object }) user: any = {}\n  @property({ type: Object }) client: any = {}\n  @property({ type: Object }) domain: any = {}\n  @property({ type: Object }) req: any = {}\n  @property({ type: String }) redirectURI: string = ''\n  @property({ type: String }) transactionID: string = ''\n\n  private myRoles = new QueryController(\n    this,\n    gql`\n      query myRoles {\n        myRoles {\n          id\n          name\n          description\n        }\n      }\n    `\n  )\n\n  get roles(): any[] {\n    return this.myRoles.data?.myRoles ?? []\n  }\n\n  @query('role-selector') roleSelector!: HTMLElement & { selectedRoles: () => any[] }\n\n  render() {\n    return html`\n      <h2>Application Binding</h2>\n      <p>Hi ${this.user.name}!</p>\n      <p><b> ${this.client.name} </b> is requesting access to your account.</p>\n      <p>Do you approve?</p>\n\n      <form field-2column>\n        <div field>\n          <label\n            >${i18next.t('label.company')}\n            <input readonly value=\"${this.domain.subdomain}\" />\n          </label>\n\n          <label\n            >${i18next.t('label.client-id')}\n            <input readonly value=\"${this.req.clientID}\" />\n          </label>\n        </div>\n\n        <div field>\n          <label\n            >${i18next.t('label.redirect_uri')}\n            <input readonly value=\"${this.redirectURI}\" />\n          </label>\n\n          <label\n            >${i18next.t('label.state')}\n            <input readonly value=\"${this.req.state}\" />\n          </label>\n        </div>\n      </form>\n\n      <role-selector .roleCategory=\"${this.domain.name}\" .roles=\"${this.roles}\"></role-selector>\n\n      <div class=\"button-container\">\n        <md-elevated-button @click=\"${() => this.decision(true)}\" raised label=\"Allow\"></md-elevated-button>\n        <md-elevated-button @click=\"${() => this.decision(false)}\" raised danger label=\"Deny\"></md-elevated-button>\n      </div>\n    `\n  }\n\n  updated(changedProps) {\n    if (changedProps.has('data')) {\n      this.user = this.data?.oauth2?.user || this.user\n      this.client = this.data?.oauth2?.client || this.client\n      this.domain = this.data?.domain || this.domain\n      this.req = this.data?.oauth2?.req || this.req\n      this.redirectURI = this.data?.oauth2?.redirectURI || this.redirectURI\n      this.transactionID = this.data?.oauth2?.transactionID || this.transactionID\n    }\n  }\n\n  async decision(allowOrCancel) {\n    const selectedRoles = this.selectedRoles()\n    if (allowOrCancel && !selectedRoles?.length) {\n      await OxPrompt.open({\n        title: i18next.t('title.nothing selected'),\n        text: i18next.t('text.should select at least one of x', { x: i18next.t('label.role') }),\n        confirmButton: { text: i18next.t('button.confirm') }\n      })\n\n      return\n    }\n\n    let data: any = {\n      transaction_id: this.transactionID,\n      subdomain: this.domain.subdomain,\n      appKey: this.req.clientID,\n      state: this.req.state,\n      email: this.user.email,\n      scopes: selectedRoles\n    }\n    if (!allowOrCancel) {\n      data.cancel = 'Deny'\n    }\n\n    const response = await fetch('/oauth/decision', {\n      method: 'POST',\n      mode: 'cors',\n      credentials: 'include',\n      headers: {\n        'Content-Type': 'application/json'\n      },\n      redirect: 'follow',\n      body: JSON.stringify(data)\n    })\n\n    if (response.redirected) {\n      location.href = response.url\n    }\n  }\n\n  selectedRoles() {\n    return this.roleSelector.selectedRoles()\n  }\n}\n"]}

package/dist-client/identity-confirmation/identity-confirmation.d.ts

@@ -8,15 +8,8 @@ export declare const IDENTITY_CONFIRMATION_REFUSAL = "identity-confirmation-requ
 export declare const CONFIRMED_IDENTITY_CONTEXT: {
     handledRefusals: string[];
 };
-/** Whether `error` - an Apollo error, or a response with `errors` - is that refusal. */
-export declare function needsIdentityConfirmation(error: any): boolean;
 /** Ask the person to confirm it is them - true once the server took it. Two screens asking at once share one popup. */
 export declare function confirmIdentity(): Promise<boolean>;
-/**
- * Run `read`; when the door refuses for want of a recent confirmation, ask for it and read once more. Undefined when
- * the person did not confirm - the screen then says so (`identity-confirmation-notice`) rather than an error.
- */
-export declare function withConfirmedIdentity<T>(read: () => Promise<T>): Promise<T | undefined>;
 /** Until when the confirmation in this browser holds - null when there is none (ADR-0168 decision 3). */
 export declare function confirmedUntil(): Promise<Date | null>;
 declare const IdentityConfirmationNotice_base: (new (...args: any[]) => LitElement) & typeof LitElement;
@@ -32,21 +25,27 @@ export declare class IdentityConfirmationNotice extends IdentityConfirmationNoti
     private ask;
 }
 /**
- * A screen's hold on what a confirmation opened: it reads through `read`, which asks when the door does, and puts
- * what it read away (`onPutAway` drops the screen's data) the moment the confirmation ends - the screen does not
- * keep showing it past ten minutes. `unconfirmed` says why nothing is shown - declined, or ran out - and `notice`
- * draws that, with the way to ask again. A screen that goes away drops its data by calling `putAway()` itself.
+ * A screen's hold on what a confirmation opened. `ask()` finds whether a confirmation holds and, when none does, asks
+ * for it; `confirmed` is true while one holds and the screen reads only then (its query's variables are undefined
+ * otherwise). The moment the confirmation ends, `confirmed` turns false and `onPutAway` runs - the screen does not keep
+ * showing what it read past ten minutes. `unconfirmed` says why nothing is shown - declined, or ran out - and `notice`
+ * draws that, with the way to ask again. A screen that goes away drops what it shows by calling `putAway()` itself.
  */
 export declare class ConfirmedIdentityController implements ReactiveController {
     private host;
     private onPutAway;
+    confirmed: boolean;
     unconfirmed: 'declined' | 'expired' | null;
     private timer?;
-    constructor(host: ReactiveControllerHost, onPutAway: () => void);
-    read<T>(run: () => Promise<T>): Promise<T | undefined>;
+    constructor(host: ReactiveControllerHost, onPutAway?: () => void);
+    /** Confirmed when a confirmation holds; otherwise the person is asked, and declining is said in its place. */
+    ask(): Promise<void>;
     /** Drop what the screen shows; `reason` is said in its place, none when the screen only went away. */
     putAway(reason?: 'declined' | 'expired' | null): void;
-    notice(again: () => void): TemplateResult;
+    notice(): TemplateResult;
     hostDisconnected(): void;
+    private confirmedByNotice;
+    /** Confirmed until the confirmation in this browser ends - false when none holds. */
+    private hold;
 }
 export {};

package/dist-client/identity-confirmation/identity-confirmation.js

@@ -8,19 +8,14 @@ import { openPopup } from '@operato/layout';
 /*
  * ── Screens of a door that asks for a recent confirmation (ADR-0168) ─────────────────────
  * The server refuses such a door until the person confirmed it is them in this browser, within the last ten minutes.
- * A screen reads through `ConfirmedIdentityController`, which asks once and reads again, and puts away what it shows
- * the moment the confirmation ends - a screen kept open past ten minutes asks again (the user, 2026-10-28). One way
- * for every app - none draws its own password box.
+ * A screen reads only while its `ConfirmedIdentityController` says `confirmed` - the controller asks for the
+ * confirmation when none holds - and what it shows is put away the moment the confirmation ends: a screen kept open
+ * past ten minutes asks again (the user, 2026-10-28). One way for every app - none draws its own password box.
  */
 /** The server's refusal code for a door that asks for a recent confirmation. */
 export const IDENTITY_CONFIRMATION_REFUSAL = 'identity-confirmation-required';
 /** The query context for such a door: the screen asks for the confirmation itself, so no error snackbar. */
 export const CONFIRMED_IDENTITY_CONTEXT = { handledRefusals: [IDENTITY_CONFIRMATION_REFUSAL] };
-/** Whether `error` - an Apollo error, or a response with `errors` - is that refusal. */
-export function needsIdentityConfirmation(error) {
-    const errors = error?.graphQLErrors?.length ? error.graphQLErrors : (error?.errors ?? []);
-    return errors.some((one) => one?.extensions?.refusal?.code === IDENTITY_CONFIRMATION_REFUSAL);
-}
 let asking = null;
 /** Ask the person to confirm it is them - true once the server took it. Two screens asking at once share one popup. */
 export function confirmIdentity() {
@@ -35,22 +30,6 @@ export function confirmIdentity() {
     }
     return asking;
 }
-/**
- * Run `read`; when the door refuses for want of a recent confirmation, ask for it and read once more. Undefined when
- * the person did not confirm - the screen then says so (`identity-confirmation-notice`) rather than an error.
- */
-export async function withConfirmedIdentity(read) {
-    try {
-        return await read();
-    }
-    catch (error) {
-        if (!needsIdentityConfirmation(error))
-            throw error;
-        if (!(await confirmIdentity()))
-            return undefined;
-        return await read();
-    }
-}
 /** Until when the confirmation in this browser holds - null when there is none (ADR-0168 decision 3). */
 export async function confirmedUntil() {
     try {
@@ -102,47 +81,62 @@ IdentityConfirmationNotice = __decorate([
 ], IdentityConfirmationNotice);
 export { IdentityConfirmationNotice };
 /**
- * A screen's hold on what a confirmation opened: it reads through `read`, which asks when the door does, and puts
- * what it read away (`onPutAway` drops the screen's data) the moment the confirmation ends - the screen does not
- * keep showing it past ten minutes. `unconfirmed` says why nothing is shown - declined, or ran out - and `notice`
- * draws that, with the way to ask again. A screen that goes away drops its data by calling `putAway()` itself.
+ * A screen's hold on what a confirmation opened. `ask()` finds whether a confirmation holds and, when none does, asks
+ * for it; `confirmed` is true while one holds and the screen reads only then (its query's variables are undefined
+ * otherwise). The moment the confirmation ends, `confirmed` turns false and `onPutAway` runs - the screen does not keep
+ * showing what it read past ten minutes. `unconfirmed` says why nothing is shown - declined, or ran out - and `notice`
+ * draws that, with the way to ask again. A screen that goes away drops what it shows by calling `putAway()` itself.
  */
 export class ConfirmedIdentityController {
-    constructor(host, onPutAway) {
+    constructor(host, onPutAway = () => { }) {
         this.host = host;
         this.onPutAway = onPutAway;
+        this.confirmed = false;
         this.unconfirmed = null;
         host.addController(this);
     }
-    async read(run) {
-        const answer = await withConfirmedIdentity(run);
-        if (answer === undefined) {
-            this.putAway('declined');
-            return undefined;
-        }
-        this.unconfirmed = null;
-        clearTimeout(this.timer);
-        const until = await confirmedUntil();
-        /* The read just passed the door, so a confirmation is there; not knowing until when, the screen does not keep it. */
-        const left = until ? until.getTime() - Date.now() : 0;
-        this.timer = setTimeout(() => this.putAway('expired'), Math.max(left, 0));
-        this.host.requestUpdate();
-        return answer;
+    /** Confirmed when a confirmation holds; otherwise the person is asked, and declining is said in its place. */
+    async ask() {
+        if (await this.hold())
+            return;
+        if (!(await confirmIdentity()))
+            return this.putAway('declined');
+        /* Just confirmed; not knowing until when, the screen does not keep it. */
+        if (!(await this.hold()))
+            this.putAway('expired');
     }
     /** Drop what the screen shows; `reason` is said in its place, none when the screen only went away. */
     putAway(reason = null) {
         clearTimeout(this.timer);
         this.timer = undefined;
+        this.confirmed = false;
         this.unconfirmed = reason;
         this.onPutAway();
         this.host.requestUpdate();
     }
-    notice(again) {
-        return html `<identity-confirmation-notice ?expired=${this.unconfirmed === 'expired'} @confirmed=${again}></identity-confirmation-notice>`;
+    notice() {
+        return html `<identity-confirmation-notice ?expired=${this.unconfirmed === 'expired'} @confirmed=${() => this.confirmedByNotice()}></identity-confirmation-notice>`;
     }
     hostDisconnected() {
         clearTimeout(this.timer);
         this.timer = undefined;
     }
+    async confirmedByNotice() {
+        if (!(await this.hold()))
+            this.putAway('expired');
+    }
+    /** Confirmed until the confirmation in this browser ends - false when none holds. */
+    async hold() {
+        const until = await confirmedUntil();
+        const left = until ? until.getTime() - Date.now() : 0;
+        if (left <= 0)
+            return false;
+        clearTimeout(this.timer);
+        this.timer = setTimeout(() => this.putAway('expired'), left);
+        this.confirmed = true;
+        this.unconfirmed = null;
+        this.host.requestUpdate();
+        return true;
+    }
 }
 //# sourceMappingURL=identity-confirmation.js.map

package/dist-client/identity-confirmation/identity-confirmation.js.map

@@ -1 +1 @@
-{"version":3,"file":"identity-confirmation.js","sourceRoot":"","sources":["../../client/identity-confirmation/identity-confirmation.ts"],"names":[],"mappings":";AAAA,OAAO,6BAA6B,CAAA;AACpC,OAAO,yCAAyC,CAAA;AAEhD,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAE3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAE3C;;;;;;GAMG;AAEH,gFAAgF;AAChF,MAAM,CAAC,MAAM,6BAA6B,GAAG,gCAAgC,CAAA;AAE7E,4GAA4G;AAC5G,MAAM,CAAC,MAAM,0BAA0B,GAAG,EAAE,eAAe,EAAE,CAAC,6BAA6B,CAAC,EAAE,CAAA;AAE9F,wFAAwF;AACxF,MAAM,UAAU,yBAAyB,CAAC,KAAU;IAClD,MAAM,MAAM,GAAG,KAAK,EAAE,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,MAAM,IAAI,EAAE,CAAC,CAAA;IACzF,OAAO,MAAM,CAAC,IAAI,CAAC,CAAC,GAAQ,EAAE,EAAE,CAAC,GAAG,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,KAAK,6BAA6B,CAAC,CAAA;AACpG,CAAC;AAED,IAAI,MAAM,GAA4B,IAAI,CAAA;AAE1C,uHAAuH;AACvH,MAAM,UAAU,eAAe;IAC7B,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,KAAK,GAAG,SAAS,CAAU,IAAI,CAAA,mDAAmD,EAAE;YACxF,QAAQ,EAAE,IAAI;YACd,sHAAsH;YACtH,IAAI,EAAE,KAAK;YACX,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,yBAAyB,CAAC;SAC5C,CAAC,CAAA;QACF,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,KAAK,IAAI,CAAC,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC,CAAA;IACtF,CAAC;IACD,OAAO,MAAM,CAAA;AACf,CAAC;AAED;;;GAGG;AACH,MAAM,CAAC,KAAK,UAAU,qBAAqB,CAAI,IAAsB;IACnE,IAAI,CAAC;QACH,OAAO,MAAM,IAAI,EAAE,CAAA;IACrB,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACf,IAAI,CAAC,yBAAyB,CAAC,KAAK,CAAC;YAAE,MAAM,KAAK,CAAA;QAClD,IAAI,CAAC,CAAC,MAAM,eAAe,EAAE,CAAC;YAAE,OAAO,SAAS,CAAA;QAChD,OAAO,MAAM,IAAI,EAAE,CAAA;IACrB,CAAC;AACH,CAAC;AAED,yGAAyG;AACzG,MAAM,CAAC,KAAK,UAAU,cAAc;IAClC,IAAI,CAAC;QACH,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,wBAAwB,EAAE,EAAE,OAAO,EAAE,EAAE,MAAM,EAAE,kBAAkB,EAAE,EAAE,CAAC,CAAA;QACnG,MAAM,EAAE,cAAc,EAAE,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,cAAc,EAAE,IAAI,EAAE,CAAA;QACzF,OAAO,cAAc,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,IAAI,CAAA;IACzD,CAAC;IAAC,MAAM,CAAC;QACP,OAAO,IAAI,CAAA;IACb,CAAC;AACH,CAAC;AAED;;;GAGG;AAEI,IAAM,0BAA0B,GAAhC,MAAM,0BAA2B,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAAtE;;QAYL,mHAAmH;QACtF,YAAO,GAAG,KAAK,CAAA;IAY9C,CAAC;aAxBQ,WAAM,GAAG,GAAG,CAAA;;;;;;;;;GASlB,AATY,CASZ;IAKD,MAAM;QACJ,OAAO,IAAI,CAAA;cACD,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,oCAAoC,CAAC,CAAC,CAAC,mCAAmC,CAAC;mCAC/E,GAAG,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,OAAO,CAAC,CAAC,CAAC,0BAA0B,CAAC;KACvF,CAAA;IACH,CAAC;IAEO,KAAK,CAAC,GAAG;QACf,IAAI,MAAM,eAAe,EAAE;YAAE,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,WAAW,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;IAClH,CAAC;;AAX4B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;;2DAAgB;AAbjC,0BAA0B;IADtC,aAAa,CAAC,8BAA8B,CAAC;GACjC,0BAA0B,CAyBtC;;AAED;;;;;GAKG;AACH,MAAM,OAAO,2BAA2B;IAKtC,YACU,IAA4B,EAC5B,SAAqB;QADrB,SAAI,GAAJ,IAAI,CAAwB;QAC5B,cAAS,GAAT,SAAS,CAAY;QAN/B,gBAAW,GAAkC,IAAI,CAAA;QAQ/C,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAA;IAC1B,CAAC;IAED,KAAK,CAAC,IAAI,CAAI,GAAqB;QACjC,MAAM,MAAM,GAAG,MAAM,qBAAqB,CAAC,GAAG,CAAC,CAAA;QAC/C,IAAI,MAAM,KAAK,SAAS,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,CAAA;YACxB,OAAO,SAAS,CAAA;QAClB,CAAC;QAED,IAAI,CAAC,WAAW,GAAG,IAAI,CAAA;QACvB,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxB,MAAM,KAAK,GAAG,MAAM,cAAc,EAAE,CAAA;QACpC,qHAAqH;QACrH,MAAM,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;QACrD,IAAI,CAAC,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAA;QACzE,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAA;QACzB,OAAO,MAAM,CAAA;IACf,CAAC;IAED,sGAAsG;IACtG,OAAO,CAAC,SAAwC,IAAI;QAClD,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxB,IAAI,CAAC,KAAK,GAAG,SAAS,CAAA;QACtB,IAAI,CAAC,WAAW,GAAG,MAAM,CAAA;QACzB,IAAI,CAAC,SAAS,EAAE,CAAA;QAChB,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAA;IAC3B,CAAC;IAED,MAAM,CAAC,KAAiB;QACtB,OAAO,IAAI,CAAA,0CAA0C,IAAI,CAAC,WAAW,KAAK,SAAS,eAAe,KAAK,kCAAkC,CAAA;IAC3I,CAAC;IAED,gBAAgB;QACd,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxB,IAAI,CAAC,KAAK,GAAG,SAAS,CAAA;IACxB,CAAC;CACF","sourcesContent":["import './identity-confirm-popup.js'\nimport '@material/web/button/outlined-button.js'\n\nimport { css, html, LitElement } from 'lit'\nimport type { ReactiveController, ReactiveControllerHost, TemplateResult } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { openPopup } from '@operato/layout'\n\n/*\n * ── Screens of a door that asks for a recent confirmation (ADR-0168) ─────────────────────\n * The server refuses such a door until the person confirmed it is them in this browser, within the last ten minutes.\n * A screen reads through `ConfirmedIdentityController`, which asks once and reads again, and puts away what it shows\n * the moment the confirmation ends - a screen kept open past ten minutes asks again (the user, 2026-10-28). One way\n * for every app - none draws its own password box.\n */\n\n/** The server's refusal code for a door that asks for a recent confirmation. */\nexport const IDENTITY_CONFIRMATION_REFUSAL = 'identity-confirmation-required'\n\n/** The query context for such a door: the screen asks for the confirmation itself, so no error snackbar. */\nexport const CONFIRMED_IDENTITY_CONTEXT = { handledRefusals: [IDENTITY_CONFIRMATION_REFUSAL] }\n\n/** Whether `error` - an Apollo error, or a response with `errors` - is that refusal. */\nexport function needsIdentityConfirmation(error: any): boolean {\n  const errors = error?.graphQLErrors?.length ? error.graphQLErrors : (error?.errors ?? [])\n  return errors.some((one: any) => one?.extensions?.refusal?.code === IDENTITY_CONFIRMATION_REFUSAL)\n}\n\nlet asking: Promise<boolean> | null = null\n\n/** Ask the person to confirm it is them - true once the server took it. Two screens asking at once share one popup. */\nexport function confirmIdentity(): Promise<boolean> {\n  if (!asking) {\n    const popup = openPopup<boolean>(html`<identity-confirm-popup></identity-confirm-popup>`, {\n      backdrop: true,\n      /* A form of one field stands at its own height - a fraction of the screen clipped it and left half the card empty. */\n      size: 'fit',\n      title: i18next.t('title.confirm it is you')\n    })\n    asking = popup.result.then(result => result === true).finally(() => (asking = null))\n  }\n  return asking\n}\n\n/**\n * Run `read`; when the door refuses for want of a recent confirmation, ask for it and read once more. Undefined when\n * the person did not confirm - the screen then says so (`identity-confirmation-notice`) rather than an error.\n */\nexport async function withConfirmedIdentity<T>(read: () => Promise<T>): Promise<T | undefined> {\n  try {\n    return await read()\n  } catch (error) {\n    if (!needsIdentityConfirmation(error)) throw error\n    if (!(await confirmIdentity())) return undefined\n    return await read()\n  }\n}\n\n/** Until when the confirmation in this browser holds - null when there is none (ADR-0168 decision 3). */\nexport async function confirmedUntil(): Promise<Date | null> {\n  try {\n    const response = await fetch('/auth/confirm-identity', { headers: { Accept: 'application/json' } })\n    const { confirmedUntil } = response.ok ? await response.json() : { confirmedUntil: null }\n    return confirmedUntil ? new Date(confirmedUntil) : null\n  } catch {\n    return null\n  }\n}\n\n/**\n * What a screen shows in place of what it would not read: the confirmation was declined, or it ran out and what the\n * screen showed was put away. Its button asks again and fires `confirmed` once the person did.\n */\n@customElement('identity-confirmation-notice')\nexport class IdentityConfirmationNotice extends localize(i18next)(LitElement) {\n  static styles = css`\n    :host {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-start;\n      gap: var(--spacing-medium, 8px);\n      padding: var(--spacing-large, 12px) 0;\n      color: var(--ui-muted);\n    }\n  `\n\n  /** The confirmation ran out and what the screen showed was put away - rather than a confirmation not yet given. */\n  @property({ type: Boolean }) expired = false\n\n  render() {\n    return html`\n      <span>${i18next.t(this.expired ? 'text.identity confirmation expired' : 'text.identity confirmation needed')}</span>\n      <md-outlined-button @click=${() => this.ask()}>${i18next.t('button.confirm it is you')}</md-outlined-button>\n    `\n  }\n\n  private async ask() {\n    if (await confirmIdentity()) this.dispatchEvent(new CustomEvent('confirmed', { bubbles: true, composed: true }))\n  }\n}\n\n/**\n * A screen's hold on what a confirmation opened: it reads through `read`, which asks when the door does, and puts\n * what it read away (`onPutAway` drops the screen's data) the moment the confirmation ends - the screen does not\n * keep showing it past ten minutes. `unconfirmed` says why nothing is shown - declined, or ran out - and `notice`\n * draws that, with the way to ask again. A screen that goes away drops its data by calling `putAway()` itself.\n */\nexport class ConfirmedIdentityController implements ReactiveController {\n  unconfirmed: 'declined' | 'expired' | null = null\n\n  private timer?: ReturnType<typeof setTimeout>\n\n  constructor(\n    private host: ReactiveControllerHost,\n    private onPutAway: () => void\n  ) {\n    host.addController(this)\n  }\n\n  async read<T>(run: () => Promise<T>): Promise<T | undefined> {\n    const answer = await withConfirmedIdentity(run)\n    if (answer === undefined) {\n      this.putAway('declined')\n      return undefined\n    }\n\n    this.unconfirmed = null\n    clearTimeout(this.timer)\n    const until = await confirmedUntil()\n    /* The read just passed the door, so a confirmation is there; not knowing until when, the screen does not keep it. */\n    const left = until ? until.getTime() - Date.now() : 0\n    this.timer = setTimeout(() => this.putAway('expired'), Math.max(left, 0))\n    this.host.requestUpdate()\n    return answer\n  }\n\n  /** Drop what the screen shows; `reason` is said in its place, none when the screen only went away. */\n  putAway(reason: 'declined' | 'expired' | null = null) {\n    clearTimeout(this.timer)\n    this.timer = undefined\n    this.unconfirmed = reason\n    this.onPutAway()\n    this.host.requestUpdate()\n  }\n\n  notice(again: () => void): TemplateResult {\n    return html`<identity-confirmation-notice ?expired=${this.unconfirmed === 'expired'} @confirmed=${again}></identity-confirmation-notice>`\n  }\n\n  hostDisconnected() {\n    clearTimeout(this.timer)\n    this.timer = undefined\n  }\n}\n"]}
+{"version":3,"file":"identity-confirmation.js","sourceRoot":"","sources":["../../client/identity-confirmation/identity-confirmation.ts"],"names":[],"mappings":"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","sourcesContent":["import './identity-confirm-popup.js'\nimport '@material/web/button/outlined-button.js'\n\nimport { css, html, LitElement } from 'lit'\nimport type { ReactiveController, ReactiveControllerHost, TemplateResult } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { openPopup } from '@operato/layout'\n\n/*\n * ── Screens of a door that asks for a recent confirmation (ADR-0168) ─────────────────────\n * The server refuses such a door until the person confirmed it is them in this browser, within the last ten minutes.\n * A screen reads only while its `ConfirmedIdentityController` says `confirmed` - the controller asks for the\n * confirmation when none holds - and what it shows is put away the moment the confirmation ends: a screen kept open\n * past ten minutes asks again (the user, 2026-10-28). One way for every app - none draws its own password box.\n */\n\n/** The server's refusal code for a door that asks for a recent confirmation. */\nexport const IDENTITY_CONFIRMATION_REFUSAL = 'identity-confirmation-required'\n\n/** The query context for such a door: the screen asks for the confirmation itself, so no error snackbar. */\nexport const CONFIRMED_IDENTITY_CONTEXT = { handledRefusals: [IDENTITY_CONFIRMATION_REFUSAL] }\n\nlet asking: Promise<boolean> | null = null\n\n/** Ask the person to confirm it is them - true once the server took it. Two screens asking at once share one popup. */\nexport function confirmIdentity(): Promise<boolean> {\n  if (!asking) {\n    const popup = openPopup<boolean>(html`<identity-confirm-popup></identity-confirm-popup>`, {\n      backdrop: true,\n      /* A form of one field stands at its own height - a fraction of the screen clipped it and left half the card empty. */\n      size: 'fit',\n      title: i18next.t('title.confirm it is you')\n    })\n    asking = popup.result.then(result => result === true).finally(() => (asking = null))\n  }\n  return asking\n}\n\n/** Until when the confirmation in this browser holds - null when there is none (ADR-0168 decision 3). */\nexport async function confirmedUntil(): Promise<Date | null> {\n  try {\n    const response = await fetch('/auth/confirm-identity', { headers: { Accept: 'application/json' } })\n    const { confirmedUntil } = response.ok ? await response.json() : { confirmedUntil: null }\n    return confirmedUntil ? new Date(confirmedUntil) : null\n  } catch {\n    return null\n  }\n}\n\n/**\n * What a screen shows in place of what it would not read: the confirmation was declined, or it ran out and what the\n * screen showed was put away. Its button asks again and fires `confirmed` once the person did.\n */\n@customElement('identity-confirmation-notice')\nexport class IdentityConfirmationNotice extends localize(i18next)(LitElement) {\n  static styles = css`\n    :host {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-start;\n      gap: var(--spacing-medium, 8px);\n      padding: var(--spacing-large, 12px) 0;\n      color: var(--ui-muted);\n    }\n  `\n\n  /** The confirmation ran out and what the screen showed was put away - rather than a confirmation not yet given. */\n  @property({ type: Boolean }) expired = false\n\n  render() {\n    return html`\n      <span>${i18next.t(this.expired ? 'text.identity confirmation expired' : 'text.identity confirmation needed')}</span>\n      <md-outlined-button @click=${() => this.ask()}>${i18next.t('button.confirm it is you')}</md-outlined-button>\n    `\n  }\n\n  private async ask() {\n    if (await confirmIdentity()) this.dispatchEvent(new CustomEvent('confirmed', { bubbles: true, composed: true }))\n  }\n}\n\n/**\n * A screen's hold on what a confirmation opened. `ask()` finds whether a confirmation holds and, when none does, asks\n * for it; `confirmed` is true while one holds and the screen reads only then (its query's variables are undefined\n * otherwise). The moment the confirmation ends, `confirmed` turns false and `onPutAway` runs - the screen does not keep\n * showing what it read past ten minutes. `unconfirmed` says why nothing is shown - declined, or ran out - and `notice`\n * draws that, with the way to ask again. A screen that goes away drops what it shows by calling `putAway()` itself.\n */\nexport class ConfirmedIdentityController implements ReactiveController {\n  confirmed = false\n  unconfirmed: 'declined' | 'expired' | null = null\n\n  private timer?: ReturnType<typeof setTimeout>\n\n  constructor(\n    private host: ReactiveControllerHost,\n    private onPutAway: () => void = () => {}\n  ) {\n    host.addController(this)\n  }\n\n  /** Confirmed when a confirmation holds; otherwise the person is asked, and declining is said in its place. */\n  async ask(): Promise<void> {\n    if (await this.hold()) return\n    if (!(await confirmIdentity())) return this.putAway('declined')\n    /* Just confirmed; not knowing until when, the screen does not keep it. */\n    if (!(await this.hold())) this.putAway('expired')\n  }\n\n  /** Drop what the screen shows; `reason` is said in its place, none when the screen only went away. */\n  putAway(reason: 'declined' | 'expired' | null = null) {\n    clearTimeout(this.timer)\n    this.timer = undefined\n    this.confirmed = false\n    this.unconfirmed = reason\n    this.onPutAway()\n    this.host.requestUpdate()\n  }\n\n  notice(): TemplateResult {\n    return html`<identity-confirmation-notice ?expired=${this.unconfirmed === 'expired'} @confirmed=${() => this.confirmedByNotice()}></identity-confirmation-notice>`\n  }\n\n  hostDisconnected() {\n    clearTimeout(this.timer)\n    this.timer = undefined\n  }\n\n  private async confirmedByNotice() {\n    if (!(await this.hold())) this.putAway('expired')\n  }\n\n  /** Confirmed until the confirmation in this browser ends - false when none holds. */\n  private async hold(): Promise<boolean> {\n    const until = await confirmedUntil()\n    const left = until ? until.getTime() - Date.now() : 0\n    if (left <= 0) return false\n    clearTimeout(this.timer)\n    this.timer = setTimeout(() => this.putAway('expired'), left)\n    this.confirmed = true\n    this.unconfirmed = null\n    this.host.requestUpdate()\n    return true\n  }\n}\n"]}

package/dist-client/pages/audit/audit-page.d.ts

@@ -21,8 +21,10 @@ export declare class AuditPage extends AuditPageBase {
     private door?;
     private outcome;
     /** How many records each outcome chip would show under the other conditions, counted by the records' own door. */
-    private outcomeCounts;
-    private health?;
+    private outcomes;
+    private auditHealth;
+    private get outcomeCounts();
+    private get health();
     private grist;
     get context(): {
         title: string;
@@ -37,10 +39,8 @@ export declare class AuditPage extends AuditPageBase {
     private show;
     private lastDays;
     private pick;
-    private countOutcomes;
     private narrow;
     pageUpdated(_changes: any, _lifecycle: any): Promise<void>;
-    private readHealth;
     private configOf;
     fetchHandler({ page, limit }: FetchOption): Promise<{
         total: any;

package/dist-client/pages/audit/audit-page.js

@@ -6,7 +6,7 @@ import gql from 'graphql-tag';
 import { css, html, nothing } from 'lit';
 import { customElement, property, query, state } from 'lit/decorators.js';
 import { keyed } from 'lit/directives/keyed.js';
-import { client } from '@operato/graphql';
+import { client, QueryController } from '@operato/graphql';
 import { i18next, localize } from '@operato/i18n';
 import { formatWhen } from '@operato/utils/when.js';
 import { p13n } from '@operato/p13n';
@@ -33,7 +33,24 @@ let AuditPage = class AuditPage extends AuditPageBase {
         this.to = new Date();
         this.outcome = '';
         /** How many records each outcome chip would show under the other conditions, counted by the records' own door. */
-        this.outcomeCounts = new Map();
+        /*
+         * The outcome chips' numbers - the records' own door asked for its total once per outcome, under the period, the
+         * person and the privilege narrowed to, in one request. The chips keep their numbers while new ones are read.
+         */
+        this.outcomes = new QueryController(this, gql `
+      query (${OUTCOMES.map((_, at) => `$f${at}: AuditRecordFilter!`).join(', ')}) {
+        ${OUTCOMES.map((_, at) => `c${at}: auditRecords(filter: $f${at}) { total }`).join('\n')}
+      }
+    `, {
+            variables: () => {
+                if (this.view !== 'records')
+                    return undefined;
+                const filter = { from: this.from.toISOString(), to: this.to.toISOString(), actorId: this.actor?.id, door: this.door };
+                return Object.fromEntries(OUTCOMES.map((outcome, at) => [`f${at}`, { ...filter, outcome: outcome || undefined, page: 1, limit: 1 }]));
+            },
+            keepPrevious: true
+        });
+        this.auditHealth = new QueryController(this, gql `{ auditHealth { failures since } }`);
     }
     static { this.styles = [
         WorkSurfacePageStyles,
@@ -79,6 +96,15 @@ let AuditPage = class AuditPage extends AuditPageBase {
       }
     `
     ]; }
+    get outcomeCounts() {
+        const data = this.outcomes.data;
+        return new Map(OUTCOMES.map((outcome, at) => [outcome || 'all', data?.[`c${at}`]?.total ?? 0]));
+    }
+    get health() {
+        if (this.auditHealth.data?.auditHealth)
+            return this.auditHealth.data.auditHealth;
+        return this.auditHealth.error || this.auditHealth.data ? 'unknown' : undefined;
+    }
     get context() {
         return {
             title: i18next.t('audit.title'),
@@ -170,24 +196,6 @@ let AuditPage = class AuditPage extends AuditPageBase {
         this.days = null;
         this.grist?.fetch();
     }
-    /*
-     * The outcome chips' numbers - the records' own door asked for its total once per outcome, under the period, the
-     * person and the privilege narrowed to, in one request.
-     */
-    async countOutcomes(filter) {
-        const response = await client.query({
-            query: gql `
-        query (${OUTCOMES.map((_, at) => `$f${at}: AuditRecordFilter!`).join(', ')}) {
-          ${OUTCOMES.map((_, at) => `c${at}: auditRecords(filter: $f${at}) { total }`).join('\n')}
-        }
-      `,
-            variables: Object.fromEntries(OUTCOMES.map((outcome, at) => [`f${at}`, { ...filter, outcome: outcome || undefined, page: 1, limit: 1 }])),
-            fetchPolicy: 'no-cache'
-        });
-        if (response.errors?.length)
-            return console.error(response.errors);
-        this.outcomeCounts = new Map(OUTCOMES.map((outcome, at) => [outcome || 'all', response.data?.[`c${at}`]?.total ?? 0]));
-    }
     narrow(change) {
         Object.assign(this, change);
         if (this.view !== 'records')
@@ -199,16 +207,6 @@ let AuditPage = class AuditPage extends AuditPageBase {
         if (this.active) {
             await this.updateComplete;
             this.grist?.fetch();
-            this.readHealth();
-        }
-    }
-    async readHealth() {
-        try {
-            const response = await client.query({ query: gql `{ auditHealth { failures since } }`, fetchPolicy: 'no-cache' });
-            this.health = response.errors?.length || !response.data?.auditHealth ? 'unknown' : response.data.auditHealth;
-        }
-        catch {
-            this.health = 'unknown';
         }
     }
     configOf(view) {
@@ -342,7 +340,6 @@ let AuditPage = class AuditPage extends AuditPageBase {
                 .sort((a, b) => used(b) - used(a));
             return { total: records.length, records };
         }
-        this.countOutcomes({ ...period, actorId: this.actor?.id, door: this.door });
         const response = await client.query({
             query: gql `
         query ($filter: AuditRecordFilter!) {
@@ -438,14 +435,6 @@ __decorate([
     state(),
     __metadata("design:type", String)
 ], AuditPage.prototype, "outcome", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], AuditPage.prototype, "outcomeCounts", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], AuditPage.prototype, "health", void 0);
 __decorate([
     query('ox-grist'),
     __metadata("design:type", Function)