From 56bba3c3f28979fb833cab2fac3cda5107a3a0dc Mon Sep 17 00:00:00 2001 From: dudleyneedham Date: Fri, 25 Aug 2023 10:52:46 +0200 Subject: [PATCH 1/8] feat: updating the official docs to include extension library --- .../01_sdk/04_integrate/03_distillery.md | 2 +- .../01_sdk/04_integrate/04_extension_api.md | 121 ++++++++++++++++++ 2 files changed, 122 insertions(+), 1 deletion(-) create mode 100644 docs/develop/01_sdk/04_integrate/04_extension_api.md diff --git a/docs/develop/01_sdk/04_integrate/03_distillery.md b/docs/develop/01_sdk/04_integrate/03_distillery.md index f61dd9fb2..216ae79bc 100644 --- a/docs/develop/01_sdk/04_integrate/03_distillery.md +++ b/docs/develop/01_sdk/04_integrate/03_distillery.md @@ -1,5 +1,5 @@ --- -id: howto-integrate-distillery +id: how-to-integrate-distillery title: KILT Distillery --- diff --git a/docs/develop/01_sdk/04_integrate/04_extension_api.md b/docs/develop/01_sdk/04_integrate/04_extension_api.md new file mode 100644 index 000000000..438f674ee --- /dev/null +++ b/docs/develop/01_sdk/04_integrate/04_extension_api.md @@ -0,0 +1,121 @@ +--- +id: kilt-extension-api +title: KILT Extension API +--- + +KILT Extension API is a JavaScript/TypeScript library that provides helper functions for interacting with KILT enabled extensions. +It facilitates seamless communication between your application and KILT extensions. + +## Getting Started + +Before you can communicate with KILT extensions, you must call the `initializeKiltExtensionAPI()` function to signal the API versions supported by your application. +This is crucial for the extension to inject the appropriate scripts into the website. + +```ts +import { initializeKiltExtensionAPI } from 'kilt-extension-api' + +initializeKiltExtensionAPI() +``` + +## Get Extensions + +The `getExtensions()` function returns a list of extensions currently injected into the website. + +```ts +import { getExtensions } from 'kilt-extension-api' + +const extensions = getExtensions() +``` + +## Watch Extensions + +Extensions may take longer to load than the website. +Therefore, the first call to `getExtensions()` might not return all available extensions. +To receive updates on additional extensions as they load, you can use `watchExtensions`. + +Here's an example of how you can use this function in a React application: + +```ts +import { watchExtensions, Types } from 'kilt-extension-api' + +export default function Home(): JSX.Element { + const [extensions, setExtensions] = useState< + Types.InjectedWindowProvider[] + >([]) + + useEffect(() => { + watchExtensions((extensions) => { + setExtensions(extensions) + }) + }, []) + + return ( + <> +

Extensions

+ + + ) +} +``` + +## Well-Known DID Configuration + +This library also aids in setting up the [Well-Known DID Configuration](https://identity.foundation/.well-known/resources/did-configuration/) as required by the [KILT Credential API specification](/~https://github.com/KILTprotocol/spec-ext-credential-api). + +### Using the CLI Tool + +A CLI tool is included in this library to create a [DID Configuration Resource](https://identity.foundation/.well-known/resources/did-configuration/#did-configuration-resource) as specified in the above documentation. This resource is necessary to establish a secure, end-to-end encrypted communication channel between a conforming browser extension and the application backend. + +To start using this tool, you can add this package to your application using `yarn add --dev kilt-extension-api` or install it globally if needed (`yarn global add kilt-extension-api`). + +You can run the CLI tool using Yarn as follows: + +```bash +yarn createDidConfig --did --origin --assertionMethod --seed +``` + +For additional commands and configuration options, refer to the CLI tool's helper: + +```bash +yarn createDidConfig --help +``` + +### Integration into Your App + +Similar functionality to the CLI tool is available for import into your Node.js scripts using the subpath `kilt-extension-api/wellKnownDidConfiguration`: + +```ts +import { createCredential, didConfigResourceFromCredential } from './wellKnownDidConfiguration/index.js' + +const credential = await createCredential( + ({ data }) => { + //...DID signing logic + }, + 'https://example.com', + 'did:kilt:4pnfkRn5UurBJTW92d9TaVLR2CqJdY4z5HPjrEbpGyBykare' +) + +const didConfigResource = didConfigResourceFromCredential(credential) +``` + +This module also assists in verifying a DID configuration resource within an extension context: + +```ts +import { verifyDidConfigResource } from './wellKnownDidConfiguration/index.js' + +// load didConfigResource from https://example.com/.well-known/did-configuration.json + +const didLinkedToOrigin = await verifyDidConfigResource(didConfigResource, 'https://example.com') + +// or, if a specific DID is expected: + +await verifyDidConfigResource( + didConfigResource, + 'https://example.com', + 'did:kilt:4pnfkRn5UurBJTW92d9TaVLR2CqJdY4z5HPjrEbpGyBykare' +) +``` From c2668d1224110bff90339dfb8224b8a1361ff739 Mon Sep 17 00:00:00 2001 From: Chris Chinchilla Date: Thu, 7 Dec 2023 11:10:40 +0100 Subject: [PATCH 2/8] Draft Signed-off-by: Chris Chinchilla --- .../01_sdk/04_integrate/04_extension_api.md | 215 +++++++++++++----- 1 file changed, 160 insertions(+), 55 deletions(-) diff --git a/docs/develop/01_sdk/04_integrate/04_extension_api.md b/docs/develop/01_sdk/04_integrate/04_extension_api.md index 438f674ee..756e84361 100644 --- a/docs/develop/01_sdk/04_integrate/04_extension_api.md +++ b/docs/develop/01_sdk/04_integrate/04_extension_api.md @@ -3,93 +3,198 @@ id: kilt-extension-api title: KILT Extension API --- -KILT Extension API is a JavaScript/TypeScript library that provides helper functions for interacting with KILT enabled extensions. -It facilitates seamless communication between your application and KILT extensions. +import TsJsBlock from '@site/src/components/TsJsBlock'; +import Tabs from '@theme/Tabs'; +import TabItem from '@theme/TabItem'; -## Getting Started +The KILT Extension API is a JavaScript and TypeScript library that provides helper functions for interacting with KILT extensions. +It facilitates communication between your application and KILT extensions. -Before you can communicate with KILT extensions, you must call the `initializeKiltExtensionAPI()` function to signal the API versions supported by your application. -This is crucial for the extension to inject the appropriate scripts into the website. + -```ts -import { initializeKiltExtensionAPI } from 'kilt-extension-api' +## Installation -initializeKiltExtensionAPI() -``` +Add the package: + + + + + ```bash + yarn add @kiltprotocol/kilt-extension-api + ``` + + + + + ```bash + npm install --save @kiltprotocol/kilt-extension-api + ``` + + + + +## Initialize Extension API + +Before your application can communicate with KILT extensions, call the `initializeKiltExtensionAPI()` method to signal the API versions supported by your application so the extension can inject the appropriate scripts. + + + + + ```ts + import { initializeKiltExtensionAPI } from 'kilt-extension-api' + + initializeKiltExtensionAPI() + ``` + + + + + ```js + import { initializeKiltExtensionAPI } from 'kilt-extension-api' + + initializeKiltExtensionAPI() + ``` + + + ## Get Extensions -The `getExtensions()` function returns a list of extensions currently injected into the website. +The `getExtensions()` method returns a list of extensions injected into the browser. -```ts -import { getExtensions } from 'kilt-extension-api' + + -const extensions = getExtensions() -``` + ```ts + import { getExtensions } from 'kilt-extension-api' -## Watch Extensions + const extensions = getExtensions() + console.log(extensions) + ``` -Extensions may take longer to load than the website. -Therefore, the first call to `getExtensions()` might not return all available extensions. -To receive updates on additional extensions as they load, you can use `watchExtensions`. + + -Here's an example of how you can use this function in a React application: + ```js + import { getExtensions } from 'kilt-extension-api' -```ts -import { watchExtensions, Types } from 'kilt-extension-api' - -export default function Home(): JSX.Element { - const [extensions, setExtensions] = useState< - Types.InjectedWindowProvider[] - >([]) - - useEffect(() => { - watchExtensions((extensions) => { - setExtensions(extensions) - }) - }, []) - - return ( - <> -

Extensions

-
    - {extensions.map((ext, i) => ( -
  • {ext.name}
  • - ))} -
- - ) -} -``` + const extensions = getExtensions() + console.log(extensions) + ``` + +
+
+ +## Watch Extensions + +Extensions can take longer to load than the host application, so the first call to `getExtensions()` might not return all available extensions. +To receive updates on extensions as they load, use the `watchExtensions` method. + +The following is an example of how you can use this method in a React application: + + + + + ```ts + import { watchExtensions, Types } from 'kilt-extension-api' + + export default function Home(): JSX.Element { + const [extensions, setExtensions] = useState< + Types.InjectedWindowProvider[] + >([]) + + useEffect(() => { + watchExtensions((extensions) => { + setExtensions(extensions) + }) + }, []) + + return ( + <> +

Extensions

+
    + {extensions.map((ext, i) => ( +
  • {ext.name}
  • + ))} +
+ + ) + } + ``` + +
+ + + ```js + import { watchExtensions } from "kilt-extension-api" + + function App() { + const [extensions, setExtensions] = useState([]) + + useEffect(() => { + watchExtensions(extensions => { + setExtensions(extensions) + }) + }, []) + + return ( + <> +

Extensions

+
    + {extensions.map((ext, i) => ( +
  • {ext.name}
  • + ))} +
+ + ) + } + ``` + +
+
+ + ## Well-Known DID Configuration -This library also aids in setting up the [Well-Known DID Configuration](https://identity.foundation/.well-known/resources/did-configuration/) as required by the [KILT Credential API specification](/~https://github.com/KILTprotocol/spec-ext-credential-api). +This library helps set up the [Well-Known DID Configuration](https://identity.foundation/.well-known/resources/did-configuration/) as required by the [KILT Credential API specification](/~https://github.com/KILTprotocol/spec-ext-credential-api). ### Using the CLI Tool -A CLI tool is included in this library to create a [DID Configuration Resource](https://identity.foundation/.well-known/resources/did-configuration/#did-configuration-resource) as specified in the above documentation. This resource is necessary to establish a secure, end-to-end encrypted communication channel between a conforming browser extension and the application backend. +This library includes a CLI tool to create a [DID Configuration Resource](https://identity.foundation/.well-known/resources/did-configuration/#did-configuration-resource). This resource is necessary to establish a secure, end-to-end encrypted communication channel between a conforming browser extension and the application backend. + +:::warning KILT Account -To start using this tool, you can add this package to your application using `yarn add --dev kilt-extension-api` or install it globally if needed (`yarn global add kilt-extension-api`). +The `createDidConfig` CLI tool **only** works if you installed the package with Yarn. -You can run the CLI tool using Yarn as follows: +::: + +Run the CLI tool using Yarn as follows: ```bash yarn createDidConfig --did --origin --assertionMethod --seed ``` -For additional commands and configuration options, refer to the CLI tool's helper: +:::info + +- `did`: DID of the issuer (and subject) of the Domain Linkage Credential. If omitted, the tool attempts to infer this from the `assertionMethod`. +- `seed`: Mnemonic or seed for the `assertionMethod` key used for issuing a new credential. +- `origin`: Domain of the application that will be using the DID Configuration Resource. +- `assertionMethod`: ID of the `assertionMethod` key used for issuing a new credential. +::: + +Use the tool's `--help` flag to see all available options: ```bash yarn createDidConfig --help ``` -### Integration into Your App +### Integration into an App -Similar functionality to the CLI tool is available for import into your Node.js scripts using the subpath `kilt-extension-api/wellKnownDidConfiguration`: +Similar functionality to the CLI tool is available for use in application code using the `@kiltprotocol/extension-api/wellKnownDidConfiguration` subpath: ```ts -import { createCredential, didConfigResourceFromCredential } from './wellKnownDidConfiguration/index.js' +import { createCredential, didConfigResourceFromCredential } from '@kiltprotocol/extension-api/wellKnownDidConfiguration' const credential = await createCredential( ({ data }) => { @@ -105,9 +210,9 @@ const didConfigResource = didConfigResourceFromCredential(credential) This module also assists in verifying a DID configuration resource within an extension context: ```ts -import { verifyDidConfigResource } from './wellKnownDidConfiguration/index.js' +import { verifyDidConfigResource } from '@kiltprotocol/extension-api/wellKnownDidConfiguration' -// load didConfigResource from https://example.com/.well-known/did-configuration.json +load didConfigResource from https://example.com/.well-known/did-configuration.json const didLinkedToOrigin = await verifyDidConfigResource(didConfigResource, 'https://example.com') From dce035b197ebe8be6d31e9c912e84a8c63bfea31 Mon Sep 17 00:00:00 2001 From: Chris Chinchilla Date: Thu, 7 Dec 2023 11:10:40 +0100 Subject: [PATCH 3/8] Draft Signed-off-by: Chris Chinchilla --- .../01_sdk/04_integrate/04_extension_api.md | 233 +++++++++++++----- 1 file changed, 173 insertions(+), 60 deletions(-) diff --git a/docs/develop/01_sdk/04_integrate/04_extension_api.md b/docs/develop/01_sdk/04_integrate/04_extension_api.md index 438f674ee..ea752b720 100644 --- a/docs/develop/01_sdk/04_integrate/04_extension_api.md +++ b/docs/develop/01_sdk/04_integrate/04_extension_api.md @@ -3,93 +3,202 @@ id: kilt-extension-api title: KILT Extension API --- -KILT Extension API is a JavaScript/TypeScript library that provides helper functions for interacting with KILT enabled extensions. -It facilitates seamless communication between your application and KILT extensions. +import TsJsBlock from '@site/src/components/TsJsBlock'; +import Tabs from '@theme/Tabs'; +import TabItem from '@theme/TabItem'; -## Getting Started +The KILT Extension API is a JavaScript and TypeScript library that provides helper functions for interacting with KILT extensions. +It facilitates communication between your application and KILT extensions. -Before you can communicate with KILT extensions, you must call the `initializeKiltExtensionAPI()` function to signal the API versions supported by your application. -This is crucial for the extension to inject the appropriate scripts into the website. + -```ts -import { initializeKiltExtensionAPI } from 'kilt-extension-api' +## Installation -initializeKiltExtensionAPI() -``` +Add the package: + + + + + ```bash + yarn add @kiltprotocol/kilt-extension-api + ``` + + + + + ```bash + npm install --save @kiltprotocol/kilt-extension-api + ``` + + + + +## Initialize Extension API + +Before your application can communicate with KILT extensions, call the `initializeKiltExtensionAPI()` method to signal the API versions supported by your application so the extension can inject the appropriate scripts. + + + + + ```ts + import { initializeKiltExtensionAPI } from 'kilt-extension-api' + + initializeKiltExtensionAPI() + ``` + + + + + ```js + import { initializeKiltExtensionAPI } from 'kilt-extension-api' + + initializeKiltExtensionAPI() + ``` + + + ## Get Extensions -The `getExtensions()` function returns a list of extensions currently injected into the website. +The `getExtensions()` method returns a list of extensions injected into the browser. -```ts -import { getExtensions } from 'kilt-extension-api' + + -const extensions = getExtensions() -``` + ```ts + import { getExtensions } from 'kilt-extension-api' -## Watch Extensions + const extensions = getExtensions() + console.log(extensions) + ``` -Extensions may take longer to load than the website. -Therefore, the first call to `getExtensions()` might not return all available extensions. -To receive updates on additional extensions as they load, you can use `watchExtensions`. + + -Here's an example of how you can use this function in a React application: + ```js + import { getExtensions } from 'kilt-extension-api' -```ts -import { watchExtensions, Types } from 'kilt-extension-api' - -export default function Home(): JSX.Element { - const [extensions, setExtensions] = useState< - Types.InjectedWindowProvider[] - >([]) - - useEffect(() => { - watchExtensions((extensions) => { - setExtensions(extensions) - }) - }, []) - - return ( - <> -

Extensions

-
    - {extensions.map((ext, i) => ( -
  • {ext.name}
  • - ))} -
- - ) -} -``` + const extensions = getExtensions() + console.log(extensions) + ``` + +
+
+ +## Watch Extensions + +Extensions can take longer to load than the host application, so the first call to `getExtensions()` might not return all available extensions. +To receive updates on extensions as they load, use the `watchExtensions` method. + +The following is an example of how you can use this method in a React application: + + + + + ```ts + import { watchExtensions, Types } from 'kilt-extension-api' + + export default function Home(): JSX.Element { + const [extensions, setExtensions] = useState< + Types.InjectedWindowProvider[] + >([]) + + useEffect(() => { + watchExtensions((extensions) => { + setExtensions(extensions) + }) + }, []) + + return ( + <> +

Extensions

+
    + {extensions.map((ext, i) => ( +
  • {ext.name}
  • + ))} +
+ + ) + } + ``` + +
+ + + ```js + import { watchExtensions } from "kilt-extension-api" + + function App() { + const [extensions, setExtensions] = useState([]) + + useEffect(() => { + watchExtensions(extensions => { + setExtensions(extensions) + }) + }, []) + + return ( + <> +

Extensions

+
    + {extensions.map((ext, i) => ( +
  • {ext.name}
  • + ))} +
+ + ) + } + ``` + +
+
+ + ## Well-Known DID Configuration -This library also aids in setting up the [Well-Known DID Configuration](https://identity.foundation/.well-known/resources/did-configuration/) as required by the [KILT Credential API specification](/~https://github.com/KILTprotocol/spec-ext-credential-api). +This library helps set up the [Well-Known DID Configuration](https://identity.foundation/.well-known/resources/did-configuration/) as required by the [KILT Credential API specification](/~https://github.com/KILTprotocol/spec-ext-credential-api). ### Using the CLI Tool -A CLI tool is included in this library to create a [DID Configuration Resource](https://identity.foundation/.well-known/resources/did-configuration/#did-configuration-resource) as specified in the above documentation. This resource is necessary to establish a secure, end-to-end encrypted communication channel between a conforming browser extension and the application backend. +This library includes a CLI tool to create a [DID Configuration Resource](https://identity.foundation/.well-known/resources/did-configuration/#did-configuration-resource). This resource is necessary to establish a secure, end-to-end encrypted communication channel between a conforming browser extension and the application backend. -To start using this tool, you can add this package to your application using `yarn add --dev kilt-extension-api` or install it globally if needed (`yarn global add kilt-extension-api`). +:::warning KILT Account -You can run the CLI tool using Yarn as follows: +The `createDidConfig` CLI tool **only** works if you installed the package with Yarn. + +::: + +Run the CLI tool using Yarn as follows: ```bash -yarn createDidConfig --did --origin --assertionMethod --seed +yarn createDidConfig --did \ + --origin \ + --assertionMethod \ + --seed ``` -For additional commands and configuration options, refer to the CLI tool's helper: +:::info + +- `did`: DID of the issuer (and subject) of the Domain Linkage Credential. If omitted, the tool attempts to infer this from the `assertionMethod`. +- `seed`: Mnemonic or seed for the `assertionMethod` key used for issuing a new credential. +- `origin`: The domain for which you are creating the credential. See [https://developer.mozilla.org/en-US/docs/Glossary/Origin] for details. +- `assertionMethod`: ID of the `assertionMethod` key used for issuing a new credential. +- +::: + +Use the tool's `--help` flag to see all available options: ```bash yarn createDidConfig --help ``` -### Integration into Your App +### Integration into an App -Similar functionality to the CLI tool is available for import into your Node.js scripts using the subpath `kilt-extension-api/wellKnownDidConfiguration`: +Similar functionality to the CLI tool is available for use in application code using the `@kiltprotocol/extension-api/wellKnownDidConfiguration` subpath: ```ts -import { createCredential, didConfigResourceFromCredential } from './wellKnownDidConfiguration/index.js' +import { createCredential, didConfigResourceFromCredential } from '@kiltprotocol/extension-api/wellKnownDidConfiguration' const credential = await createCredential( ({ data }) => { @@ -102,20 +211,24 @@ const credential = await createCredential( const didConfigResource = didConfigResourceFromCredential(credential) ``` -This module also assists in verifying a DID configuration resource within an extension context: +You can also verify a DID configuration resource within an extension context. From either a 3rd party DID resource: ```ts -import { verifyDidConfigResource } from './wellKnownDidConfiguration/index.js' +import { verifyDidConfigResource } from '@kiltprotocol/extension-api/wellKnownDidConfiguration' -// load didConfigResource from https://example.com/.well-known/did-configuration.json +let didConfigResource = … // Load from https://socialkyc.io/.well-known/did-configuration.json or some other source -const didLinkedToOrigin = await verifyDidConfigResource(didConfigResource, 'https://example.com') +const didLinkedToOrigin = await verifyDidConfigResource(didConfigResource, 'https://socialkyc.io') +``` + +Or, if you expect a specific DID: -// or, if a specific DID is expected: +```ts +import { verifyDidConfigResource } from '@kiltprotocol/extension-api/wellKnownDidConfiguration' await verifyDidConfigResource( didConfigResource, 'https://example.com', 'did:kilt:4pnfkRn5UurBJTW92d9TaVLR2CqJdY4z5HPjrEbpGyBykare' ) -``` +``` \ No newline at end of file From cd49713f1bf4699832438bf2372b044bc3d3bd4b Mon Sep 17 00:00:00 2001 From: Chris Chinchilla Date: Mon, 18 Dec 2023 11:04:18 +0100 Subject: [PATCH 4/8] Update docs/develop/01_sdk/04_integrate/04_extension_api.md Co-authored-by: Raphael Flechtner <39338561+rflechtner@users.noreply.github.com> --- docs/develop/01_sdk/04_integrate/04_extension_api.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/develop/01_sdk/04_integrate/04_extension_api.md b/docs/develop/01_sdk/04_integrate/04_extension_api.md index ebf8bd0ab..e1016bc38 100644 --- a/docs/develop/01_sdk/04_integrate/04_extension_api.md +++ b/docs/develop/01_sdk/04_integrate/04_extension_api.md @@ -178,7 +178,7 @@ yarn createDidConfig --did \ - `did`: DID of the issuer (and subject) of the Domain Linkage Credential. If omitted, the tool attempts to infer this from the `assertionMethod`. - `seed`: Mnemonic or seed for the `assertionMethod` key used for issuing a new credential. -- `origin`: The domain for which you are creating the credential. [Read MDN docs for more details](https://developer.mozilla.org/en-US/docs/Glossary/Origin]) for details. +- `origin`: The [HTTP origin](https://developer.mozilla.org/en-US/docs/Glossary/Origin) or URL of the web application for which you are creating the credential. Note that this must be an https:// URL with an empty path component. The resulting credential is valid for all paths under this origin. - `assertionMethod`: ID of the `assertionMethod` key used for issuing a new credential. ::: From 38aa4fd8a5dd97d18bfedd9c46fd6970b32d3023 Mon Sep 17 00:00:00 2001 From: Chris Chinchilla Date: Mon, 18 Dec 2023 11:05:59 +0100 Subject: [PATCH 5/8] Fix url Signed-off-by: Chris Chinchilla --- docs/develop/01_sdk/04_integrate/03_distillery.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/develop/01_sdk/04_integrate/03_distillery.md b/docs/develop/01_sdk/04_integrate/03_distillery.md index 216ae79bc..f61dd9fb2 100644 --- a/docs/develop/01_sdk/04_integrate/03_distillery.md +++ b/docs/develop/01_sdk/04_integrate/03_distillery.md @@ -1,5 +1,5 @@ --- -id: how-to-integrate-distillery +id: howto-integrate-distillery title: KILT Distillery --- From a8bbb9b9750633c94db54f94e65980221a410792 Mon Sep 17 00:00:00 2001 From: Chris Chinchilla Date: Tue, 19 Dec 2023 13:06:14 +0100 Subject: [PATCH 6/8] Updates Signed-off-by: Chris Chinchilla --- .../01_sdk/04_integrate/04_extension_api.md | 35 ++++++------------- 1 file changed, 11 insertions(+), 24 deletions(-) diff --git a/docs/develop/01_sdk/04_integrate/04_extension_api.md b/docs/develop/01_sdk/04_integrate/04_extension_api.md index e1016bc38..6032a3b89 100644 --- a/docs/develop/01_sdk/04_integrate/04_extension_api.md +++ b/docs/develop/01_sdk/04_integrate/04_extension_api.md @@ -10,30 +10,20 @@ import TabItem from '@theme/TabItem'; The KILT Extension API is a JavaScript and TypeScript library that provides helper functions for interacting with KILT extensions. It facilitates communication between your application and KILT extensions. -## Installation - -Add the package: - - - - ```bash - yarn add @kiltprotocol/kilt-extension-api - ``` - - +## Installation - ```bash - npm install --save @kiltprotocol/kilt-extension-api - ``` +Add the package: - - +```bash npm2yarn +npm install --save @kiltprotocol/kilt-extension-api +``` ## Initialize Extension API Before your application can communicate with KILT extensions, call the `initializeKiltExtensionAPI()` method to signal the API versions supported by your application so the extension can inject the appropriate scripts. +This should happen at the earliest point possible on page load, or it won't inject the scripts. @@ -151,19 +141,16 @@ The following is an example of how you can use this method in a React applicatio -## Well-Known DID Configuration +## DID Configuration + +You need [an existing DID configuration](../../01_sdk/02_cookbook/01_dids/00_generate_keys.md) setup for your application to communicate with KILT extensions. This library helps set up the [Well-Known DID Configuration](https://identity.foundation/.well-known/resources/did-configuration/) as required by the [KILT Credential API specification](/~https://github.com/KILTprotocol/spec-ext-credential-api). ### Using the CLI Tool -This library includes a CLI tool to create a [DID Configuration Resource](https://identity.foundation/.well-known/resources/did-configuration/#did-configuration-resource). This resource is necessary to establish a secure, end-to-end encrypted communication channel between a conforming browser extension and the application backend. - -:::warning KILT Account - -The `createDidConfig` CLI tool **only** works if you installed the package with Yarn. - -::: +This library includes a CLI tool to create a [DID Configuration Resource](https://identity.foundation/.well-known/resources/did-configuration/#did-configuration-resource). +This resource is necessary to establish a secure, end-to-end encrypted communication channel between a conforming browser extension and the application backend. Run the CLI tool using Yarn as follows: From bb2ce309e7513b2c591e0dadeb8adbae49d58c23 Mon Sep 17 00:00:00 2001 From: Chris Chinchilla Date: Tue, 19 Dec 2023 15:52:10 +0100 Subject: [PATCH 7/8] Add npm details Signed-off-by: Chris Chinchilla --- .../01_sdk/04_integrate/04_extension_api.md | 49 ++++++++++++++----- 1 file changed, 38 insertions(+), 11 deletions(-) diff --git a/docs/develop/01_sdk/04_integrate/04_extension_api.md b/docs/develop/01_sdk/04_integrate/04_extension_api.md index 6032a3b89..11835d41e 100644 --- a/docs/develop/01_sdk/04_integrate/04_extension_api.md +++ b/docs/develop/01_sdk/04_integrate/04_extension_api.md @@ -10,8 +10,6 @@ import TabItem from '@theme/TabItem'; The KILT Extension API is a JavaScript and TypeScript library that provides helper functions for interacting with KILT extensions. It facilitates communication between your application and KILT extensions. - - ## Installation Add the package: @@ -154,12 +152,28 @@ This resource is necessary to establish a secure, end-to-end encrypted communica Run the CLI tool using Yarn as follows: -```bash -yarn createDidConfig --did \ - --origin \ - --assertionMethod \ - --seed -``` + + + + ```bash + yarn createDidConfig --did \ + --origin \ + --assertionMethod \ + --seed + ``` + + + + + ```bash + npx @kiltprotocol/kilt-extension-api createDidConfig --did \ + --origin \ + --assertionMethod \ + --seed + ``` + + + :::info @@ -172,9 +186,22 @@ yarn createDidConfig --did \ Use the tool's `--help` flag to see all available options: -```bash -yarn createDidConfig --help -``` + + + + ```bash + yarn createDidConfig --help + ``` + + + + + ```bash + npx @kiltprotocol/kilt-extension-api createDidConfig --help + ``` + + + ### Integration into an App From 423efa0a29b8c83d2ef0c9efaecc90e85792c2a6 Mon Sep 17 00:00:00 2001 From: Chris Chinchilla Date: Thu, 21 Dec 2023 12:36:45 +0100 Subject: [PATCH 8/8] Changes from review Signed-off-by: Chris Chinchilla --- docs/develop/01_sdk/04_integrate/04_extension_api.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/develop/01_sdk/04_integrate/04_extension_api.md b/docs/develop/01_sdk/04_integrate/04_extension_api.md index 11835d41e..f1f173b9c 100644 --- a/docs/develop/01_sdk/04_integrate/04_extension_api.md +++ b/docs/develop/01_sdk/04_integrate/04_extension_api.md @@ -7,7 +7,7 @@ import TsJsBlock from '@site/src/components/TsJsBlock'; import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; -The KILT Extension API is a JavaScript and TypeScript library that provides helper functions for interacting with KILT extensions. +The KILT Extension API is a JavaScript and TypeScript library that provides helper functions for backend, frontend, and browser-based applications interacting with KILT extensions. It facilitates communication between your application and KILT extensions. ## Installation @@ -141,7 +141,7 @@ The following is an example of how you can use this method in a React applicatio ## DID Configuration -You need [an existing DID configuration](../../01_sdk/02_cookbook/01_dids/00_generate_keys.md) setup for your application to communicate with KILT extensions. +You need [an active DID](../../01_sdk/02_cookbook/01_dids/00_generate_keys.md) with a signed DID configuration resource for your application to communicate with KILT extensions. This library helps set up the [Well-Known DID Configuration](https://identity.foundation/.well-known/resources/did-configuration/) as required by the [KILT Credential API specification](/~https://github.com/KILTprotocol/spec-ext-credential-api). @@ -150,11 +150,11 @@ This library helps set up the [Well-Known DID Configuration](https://identity.fo This library includes a CLI tool to create a [DID Configuration Resource](https://identity.foundation/.well-known/resources/did-configuration/#did-configuration-resource). This resource is necessary to establish a secure, end-to-end encrypted communication channel between a conforming browser extension and the application backend. -Run the CLI tool using Yarn as follows: - + After adding the dependency to your project, run the CLI tool using Yarn as follows: + ```bash yarn createDidConfig --did \ --origin \