@amityco/ulta-ui-kit 1.0.0-beta.3 → 1.0.0-beta.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/readme.md +17 -2
package/package.json
CHANGED
package/readme.md
CHANGED
|
@@ -41,7 +41,7 @@ export default function App() {
|
|
|
41
41
|
|
|
42
42
|
>
|
|
43
43
|
<AmityUiKitSocial />
|
|
44
|
-
</AmityUiKitProvider>
|
|
44
|
+
</AmityUiKitProvider>
|
|
45
45
|
</div>
|
|
46
46
|
);
|
|
47
47
|
}
|
|
@@ -51,7 +51,7 @@ export default function App() {
|
|
|
51
51
|
|
|
52
52
|
In React, the component’s state dictates the behavior and rendering of the component. When the state changes, React automatically triggers a re-render of the component, updating the DOM where necessary. In your application, the userId is stored in the component’s state using the useState hook. This state determines the URL of the iframe where the Amity UIKit is loaded. When the userId state changes, React recognizes this change and re-renders the component, including the iframe, with the updated URL.
|
|
53
53
|
|
|
54
|
-
When an anonymous user
|
|
54
|
+
When an anonymous user click on any buttons to interact within community, the UIKit will emit a ‘anonymousNeedsLogin’ postMessage event. Below is a code example demonstrating how to receive this postMessage event from the UIKit Iframe:
|
|
55
55
|
|
|
56
56
|
```sh
|
|
57
57
|
import React, { useState, useEffect } from 'react';
|
|
@@ -67,6 +67,21 @@ export default function App() {
|
|
|
67
67
|
// Prompt user to log in
|
|
68
68
|
// Logic to display login dialog should be implemented here
|
|
69
69
|
}
|
|
70
|
+
|
|
71
|
+
if (event.data ==== 'uikitRendered') {
|
|
72
|
+
// Logic to handle after uikit has been rendered
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
if (event.data ==== 'explorePageLoaded') {
|
|
76
|
+
// Logic to handle after Explore page has been loaded
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
|
|
80
|
+
if (event.data ==== 'parentNeedsScrollToTop') {
|
|
81
|
+
// `parentNeedsScrollToTop` will be posted from iFrame when the Nickname dialog is opened
|
|
82
|
+
window.scrollTo(0,0);
|
|
83
|
+
}
|
|
84
|
+
|
|
70
85
|
};
|
|
71
86
|
|
|
72
87
|
// Listen for messages from the iframe
|