generated from AdobeDocs/dev-site-documentation-template
-
Notifications
You must be signed in to change notification settings - Fork 12
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Removed message about early access. Added contacts section.
- Loading branch information
1 parent
e982f6c
commit e2d701d
Showing
2 changed files
with
87 additions
and
4 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -13,10 +13,6 @@ UI Extensibility allows 3rd party developers to customize and add their own logi | |
|
||
UI extensions are JavaScript applications built with [Adobe App Builder](https://developer.adobe.com/app-builder/docs/overview/) that may be embedded in UI Applications running under [Adobe Experience Cloud](https://experience.adobe.com/) unified shell. Adobe UI Services and UI Extensions implement a two-way communication protocol that allows to exchange of data, invoking actions, and rendering additional visual blocks. | ||
|
||
<InlineAlert slots="text" /> | ||
|
||
UI Extensibility is currently available for early preview as a beta release. In case of any issues or to request new extension point please contact us at [email protected]. | ||
|
||
<DiscoverBlock slots="heading, link, text"/> | ||
|
||
## Get to Know | ||
|
@@ -87,6 +83,12 @@ Learn extensibility possibilities in AEM Content Fragments Console. | |
|
||
Know how to deploy and publish UI Extensions for your organization. | ||
|
||
## Feedback and Collaboration | ||
|
||
We are open to genuine feedback and would gladly expand UI Extensibility capability to solve your needs. | ||
|
||
Please get in touch with us through email at [email protected] for feature requests, use-case validation, assistance with extension implementation, or bug reports. | ||
|
||
## Contribute | ||
|
||
We encourage you to participate in our open documentation initiative, if you have suggestions, corrections, additions or deletions for this documentation, check out the source from [this github repo](https://github.com/AdobeDocs/uix), and submit a pull request with your contribution. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,81 @@ | ||
--- | ||
title: Extension Points - AEM Content Fragments Editor Extensibility | ||
description: Learn what is possible to extend and customize in AEM Content Fragments Editor | ||
contributors: | ||
- https://github.com/AdobeDocs/uix | ||
--- | ||
|
||
# AEM Content Fragments Editor Extension Points | ||
|
||
Content Fragment Editor extensibility API allows extension access and update information about active application context. | ||
|
||
### Shared Context | ||
|
||
In order to empower UI Extensions perform useful actions Content Fragments Editor provides access to data that simplifies user authentication and usage of AEM API. Such data may be accessed through `sharedContext` property of `host`. | ||
|
||
```js | ||
import { attach } from "@adobe/uix-guest"; | ||
|
||
const guestConnection = await attach({ | ||
id: "my-id" | ||
} | ||
const context = guestConnection.sharedContext; | ||
const aemHost = context.get("aemHost"); | ||
``` | ||
Available shared context data: | ||
```js | ||
{ | ||
aemHost: string, // hostname of connected AEM environment | ||
locale: string, // locale of current user | ||
theme: "light" | "dark", // color schema selected by current user | ||
auth: { | ||
imsOrg: string, // current IMS organization | ||
imsToken: string, // user token | ||
apiKey: string, // API key to use for requests to Adobe services | ||
imsOrgName: string, // Human readable organization name | ||
authScheme: "Bearer" // Auth schema that should be used during communication with Adobe services | ||
} | ||
} | ||
``` | ||
### Get Content Fragment | ||
You can access data about the Content Fragment that is currently being edited by using the `host.contentFragment.getContentFragment()` method in an extension: | ||
```js | ||
import { register } from "@adobe/uix-guest"; | ||
// ... | ||
const init = async () => { | ||
const registrationConfig = { | ||
id: extensionId, | ||
methods: { | ||
headerMenu: { | ||
async getButtons() { | ||
return [ | ||
{ | ||
id: "get-active-cf", | ||
label: "Get Active CF / Canvas", | ||
onClick: async () => { | ||
// Get Content Fragment | ||
const contentFragment = await guestConnection.host.contentFragment.getContentFragment(); | ||
}, | ||
}, | ||
]; | ||
}, | ||
}, | ||
}, | ||
}; | ||
const guestConnection = await register(registrationConfig); | ||
} | ||
init().catch(console.error) | ||
``` | ||
#### Result object | ||
This `contentFragment` object holds the last received state from AEM instance. It does not contain recent changes from the Editor (no edits from the canvas, sidebar or changes to variations) **until they are successfully saved** in AEM. | ||
<InlineAlert variant="warning" slots="text" /> | ||
The API is experimental and might change or disappear at any time. The result object structure is part of a low level API that could be changed in the future. |