[WALLET-224] Add scope attribute to proof-verify-id

README.md

@@ -36,7 +36,7 @@ To request a Verifiable Presentation, drop the `<proof-verify-id />` HTML tag an
 />
 ```
 
-You can also provide a `login-hint`, `state`, or `response-mode` (`fragment` (default) | `direct_post`):
+You can also provide a `login-hint`, `state`, `scope`, or `response-mode` (`fragment` (default) | `direct_post`):
 
 ```html
 <proof-verify-id
@@ -50,10 +50,23 @@ You can also provide a `login-hint`, `state`, or `response-mode` (`fragment` (de
 />
 ```
 
+`scope` selects which credential to request. It defaults to
+`urn:proof:params:scope:verifiable-credentials:basic`:
+
+```html
+<proof-verify-id
+  environment="sandbox"
+  client-id="<CLIENT_ID>"
+  callback-uri="<CALLBACK_URI>"
+  nonce="3e8e4918-e9fb-453a-a538-81152be15c1b"
+  scope="urn:proof:params:scope:verifiable-credentials:nationality:us"
+/>
+```
+
 ### Custom authorization URL
 
 You can pass a `resolveAuthorizationUrl` property to create your own authorization request URL (e.g. a Pushed Authorization Request server-side).
-When set, the element ignores the `environment` / `client-id` / `callback-uri` / `response-mode` / `nonce` / `state` / `login-hint` attributes.
+When set, the element ignores the `environment` / `client-id` / `callback-uri` / `response-mode` / `nonce` / `state` / `login-hint` / `scope` attributes.
 
 ```javascript
 import { buildAuthorizationUrl } from "@proof.com/proof-vc-web";

package.json

@@ -50,7 +50,7 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@proof.com/proof-vc-common": "^0.4.3"
+    "@proof.com/proof-vc-common": "^0.4.4"
   },
   "devDependencies": {
     "@types/react": "^19.2.15",

src/index.ts

@@ -13,4 +13,5 @@ export {
   parseAuthorizationResponse,
   type Environment,
   type ResponseMode,
+  type Scope,
 } from "@proof.com/proof-vc-common";

src/proof_verify_id.ts

@@ -2,6 +2,7 @@ import {
   buildAuthorizationUrl,
   type Environment,
   type ResponseMode,
+  type Scope,
 } from "@proof.com/proof-vc-common";
 import { css } from "./styles.ts";
 
@@ -23,6 +24,9 @@ const Base: typeof HTMLElement =
 
 const LABEL = "Continue with Proof";
 
+const DEFAULT_SCOPE: Scope =
+  "urn:proof:params:scope:verifiable-credentials:basic";
+
 export type AuthorizationUrlResolver = () =>
   string | null | undefined | Promise<string | null | undefined>;
 
@@ -132,13 +136,14 @@ export class ProofVerifyId extends Base {
     const state = this.getAttribute("state");
     const login_hint = this.getAttribute("login-hint");
     const response_mode = this.getAttribute("response-mode");
+    const scope = this.getAttribute("scope");
 
     return buildAuthorizationUrl({
       environment: environment as Environment,
       clientId: clientId!,
       callbackUri: callbackUri!,
       nonce: nonce!,
-      scope: "urn:proof:params:scope:verifiable-credentials:basic",
+      scope: (scope as Scope | null) ?? DEFAULT_SCOPE,
       ...(response_mode !== null && {
         responseMode: response_mode as ResponseMode,
       }),

src/react.ts

@@ -3,13 +3,18 @@ import type {
   AuthorizationUrlResolver,
   ProofVerifyId,
 } from "./proof_verify_id.ts";
-import type { Environment, ResponseMode } from "@proof.com/proof-vc-common";
+import type {
+  Environment,
+  ResponseMode,
+  Scope,
+} from "@proof.com/proof-vc-common";
 
 export interface ProofVerifyIdJSXAttributes extends HTMLAttributes<ProofVerifyId> {
   environment?: Environment;
   "client-id"?: string;
   "callback-uri"?: string;
   "response-mode"?: ResponseMode;
+  scope?: Scope;
   nonce?: string;
   state?: string;
   theme?: "dark" | "gray" | "outline" | "primary";

yarn.lock

@@ -110,18 +110,18 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@proof.com/proof-vc-common@npm:^0.4.3":
-  version: 0.4.3
-  resolution: "@proof.com/proof-vc-common@npm:0.4.3"
-  checksum: 10c0/7882e9b85e0a7c7e8e518a3a73d3fde965d7e4ff79a24b1d308ff815b408620946b68d35c66edbb77b094235cbc423d4af09739c99e27d686d3fcc53b71a3eb7
+"@proof.com/proof-vc-common@npm:^0.4.4":
+  version: 0.4.4
+  resolution: "@proof.com/proof-vc-common@npm:0.4.4"
+  checksum: 10c0/5104d24f678259fb32431521842b057b10f7a4978d3acc4cc0df07652d0e34c677ad86f53593edf0a58b560a7a6f46f659596c489972fbae6344a771608b7bb2
   languageName: node
   linkType: hard
 
 "@proof.com/proof-vc-web@workspace:.":
   version: 0.0.0-use.local
   resolution: "@proof.com/proof-vc-web@workspace:."
   dependencies:
-    "@proof.com/proof-vc-common": "npm:^0.4.3"
+    "@proof.com/proof-vc-common": "npm:^0.4.4"
     "@types/react": "npm:^19.2.15"
     eslint: "npm:^10.4.0"
     eslint-plugin-unused-imports: "npm:^4.4.1"