"text": "# Verifiable Credentials for ReSpec\n\nThis ReSpec extension enhances the\n[Verifiable Credential](https://www.w3.org/TR/vc-data-model/)\nexamples in your specification.\n\nThe [Verifiable Credentials](https://www.w3.org/TR/vc-data-model/)\nextension to the [ReSpec](https://respec.org/docs/#abstract)\ndocument authoring environment enables authors to express simple\nexamples of [credentials](https://www.w3.org/TR/vc-data-model/#abstract)\nin their specification which are then enhanced by this extension to\nshow the digitally signed forms of the credential. An example of the\noutput of this extension is provided below (this extension adds the\ntabs seen in the image below):\n\n\n\nThis extension can also be used to generate human-readable cryptographic hashes\nof files that are retrievable by a browser environment.\n\n# Usage\n\nTo use this extension, include the following line in your ReSpec file:\n\n```html\n<script class=\"remove\" src=\"https://cdn.jsdelivr.net/gh/w3c/
[email protected]/dist/main.js\"></script>\n```\n\nNote that there might be releases later than the one listed above.\nCheck this repository's [tags](https://github.com/digitalbazaar/respec-vc/tags)\nfor all known releases.\n\n# Generate Verifiable Credential Examples\n\nTo use this extension, you must add the `vc` class to your examples.\n\n## Options\n\n### Set Specific Tabs to Display\n\nThe `data-vc-tabs` property can be set to a space-delimited list containing any\nof the following values to customize the tabs displayed:\n\nOn by default:\n* `ecdsa-rdfc-2019` - https://www.w3.org/TR/vc-di-ecdsa/\n* `eddsa-rdfc-2022` - https://www.w3.org/TR/vc-di-eddsa/\n* `ecdsa-sd-2023` - https://www.w3.org/TR/vc-di-ecdsa/\n* `bbs-2023` - https://www.w3.org/TR/vc-di-bbs/\n* `jose` - https://w3c.github.io/vc-jose-cose/#with-jose\n\nOptional:\n* `cbor-ld` - https://json-ld.github.io/cbor-ld-spec/\n* `qr` - https://w3c-ccg.github.io/vc-barcodes/\n* `Ed25519Signature2020` - https://www.w3.org/TR/vc-di-eddsa/#the-ed25519signature2020-suite\n* `sd-jwt` - https://www.w3.org/TR/vc-jose-cose/#with-sd-jwt\n* `cose` - https://www.w3.org/TR/vc-jose-cose/#securing-with-cose\n\n```html\n<pre class=\"example nohighlight vc\" title=\"Usage of the id property\"\n data-vc-tabs=\"bbs-2023 vc-jwt\">\n{\n \"@context\": [\n \"https://www.w3.org/2018/credentials/v1\",\n \"https://www.w3.org/2018/credentials/examples/v1\"\n ],\n <span class=\"highlight\">\"id\": \"http://example.edu/credentials/3732\"</span>,\n \"type\": [\"VerifiableCredential\", \"UniversityDegreeCredential\"],\n \"issuer\": \"https://example.edu/issuers/565049\",\n \"issuanceDate\": \"2010-01-01T00:00:00Z\",\n \"credentialSubject\": {\n <span class=\"highlight\">\"id\": \"did:example:ebfeb1f712ebc6f1c276e12ec21\"</span>,\n \"degree\": {\n \"type\": \"BachelorDegree\",\n \"name\": \"Bachelor of Science and Arts\"\n }\n }\n}\n</pre>\n```\n\n### Set Verification Method\n\nThe `data-vc-vm` option can be used to provide a digital proof verification\nmethod (e.g., a URL to a public key):\n\n```html\n<pre class=\"example nohighlight vc\" title=\"Usage of the id property\"\n data-vc-vm=\"https://example.edu/issuers/565049#key-1\">\n{\n \"@context\": [\n \"https://www.w3.org/2018/credentials/v1\",\n \"https://www.w3.org/2018/credentials/examples/v1\"\n ],\n <span class=\"highlight\">\"id\": \"http://example.edu/credentials/3732\"</span>,\n \"type\": [\"VerifiableCredential\", \"UniversityDegreeCredential\"],\n \"issuer\": \"https://example.edu/issuers/565049\",\n \"issuanceDate\": \"2010-01-01T00:00:00Z\",\n \"credentialSubject\": {\n <span class=\"highlight\">\"id\": \"did:example:ebfeb1f712ebc6f1c276e12ec21\"</span>,\n \"degree\": {\n \"type\": \"BachelorDegree\",\n \"name\": \"Bachelor of Science and Arts\"\n }\n }\n}\n</pre>\n```\n\n# Generate Binary VCs and QR Codes\n\nIt is possible to use semantic compression to highly compress VCs to \ncompact binary representations as small as 185 bytes. You can do \nso by using the `cbor-ld` option in `data-vc-tabs`. The output\nwill look like the following:\n\n\n\nIt is also possible to represent these binary representations using QR Codes.\nYou can show a QR Code encoding of a VC by using the `qr` option in \n`data-vc-tabs`:\n\n\n\n# Generate Cryptographic Hashes\n\nTo use this extension, you must add the `vc-hash` class to an HTML element\nsuch as a SPAN or DIV tag.\n\n```html\n<p>\nThis section demonstrates the hashing of remote files. Hashes for\n`https://www.w3.org/ns/credentials/v2` are provided below:\n</p>\n\n<ul>\n <li>\nraw (`openssl dgst -sha256`):\n<span class=\"vc-hash\" data-hash-url=\"https://www.w3.org/ns/credentials/v2\"\n data-hash-format=\"openssl dgst -sha256\" />\n </li>\n <li>\ndigestSRI (sha2-256 base64pad):\n<span class=\"vc-hash\" data-hash-url=\"https://www.w3.org/ns/credentials/v2\"\n data-hash-format=\"sri sha2-256\" />\n </li>\n <li>\ndigestSRI (sha2-384 base64pad):\n<span class=\"vc-hash\" data-hash-url=\"https://www.w3.org/ns/credentials/v2\"\n data-hash-format=\"sri sha2-384\" />\n </li>\n <li>\ndigestMultibase (sha2-256 base16):\n<span class=\"vc-hash\" data-hash-url=\"https://www.w3.org/ns/credentials/v2\"\n data-hash-format=\"multihash sha2-256 base16\" />\n </li>\n <li>\ndigestMultibase (sha2-256 base58btc):\n<span class=\"vc-hash\" data-hash-url=\"https://www.w3.org/ns/credentials/v2\"\n data-hash-format=\"multihash sha2-256 base58btc\" />\n </li>\n <li>\ndigestMultibase (sha2-256 base64-url-nopad):\n<span class=\"vc-hash\" data-hash-url=\"https://www.w3.org/ns/credentials/v2\"\n data-hash-format=\"multihash sha2-256\" />\n </li>\n <li>\ndigestMultibase (sha2-384 base64-url-nopad):\n<span class=\"vc-hash\" data-hash-url=\"https://www.w3.org/ns/credentials/v2\"\n data-hash-format=\"multihash sha2-384\" />\n </li>\n <li>\ndigestMultibase (sha3-256 base64-url-nopad):\n<span class=\"vc-hash\" data-hash-url=\"https://www.w3.org/ns/credentials/v2\"\n data-hash-format=\"multihash sha3-256\" />\n </li>\n <li>\ndigestMultibase (sha3-384 base64-url-nopad):\n<span class=\"vc-hash\" data-hash-url=\"https://www.w3.org/ns/credentials/v2\"\n data-hash-format=\"multihash sha3-384\" />\n </li>\n</ul>\n```\n\n## Options\n\nThe `data-hash-url` option is used to provide the URL for which a\ncryptographic digest should be generated.\n\nThe `data-hash-format` specifies various ways in which the cryptographic digest\ncan be expressed. The supported hash expression formats are: `openssl`, `sri`, and `multihash`. The supported digest algorithms are `sha2-256` (default), `sha2-384`, `sha3-256`, and `sha3-384`. The supported base encodings are `base64url` (default), `base64pad`, `base16`, and `base58btc`.\n\n# Development\n\n```sh\n$ npm i\n$ npm run build # build and watch index.js changes\n$ npm run start # serve this directory\n```\n\n## Creating a Release\n\nNOTE: This release process is not ideal and is planned to be changed/imporved in future.\n\nTo create a new release:\n\n1. Clear out `node_modules/` and `dist/`\n2. `git pull origin main`\n3. `git checkout -b VERSION` (where `VERSION` is something like `3.3.2`)\n4. `npm i`\n5. `npm run build`\n6. Test by running `npm run start` and ensure `index.html` loads without errors.\n7. `git add -f dist/main.js && git commit -a`\n6. `git tag VERSION`\n7. `git push --tags`\n\n**DO NOT merge the branch down to main.** All tagged releases are\n\"headless\" because they contain massive 7MB files.\n"
0 commit comments