@amityco/ulta-ui-kit 1.0.0-beta.1 → 1.0.0-beta.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@amityco/ulta-ui-kit",
-  "version": "1.0.0-beta.1",
+  "version": "1.0.0-beta.11",
   "engines": {
     "node": ">=18"
   },

package/readme.md

@@ -32,14 +32,16 @@ export default function App() {
   const apiRegion = "<your API region here>";
 
   return (
-    <div className="App">
-      <AmityUiKitProvider
-           apiKey={apiKey}
-           userId={userId}
-           apiRegion={apiRegion}
-       >
-        <AmityUiKitSocial />
-      </AmityUiKitProvider>
+    <div style={{ width: '100dvw', height: '100dvh' }}>
+          <AmityUiKitProvider
+            key={userId}
+            apiKey={apiKey}
+            userId={userId}
+            apiRegion={apiRegion}
+
+          >
+            <AmityUiKitSocial />
+          </AmityUiKitProvider>
     </div>
   );
 }
@@ -49,7 +51,7 @@ export default function App() {
 
 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.
 
-When an anonymous user exceeds three clicks, the UIKit will emit a ‘anonymousNeedsLogin’ postMessage event. Below is a code example demonstrating how to receive this postMessage event from the UIKit Iframe:
+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:
 
 ```sh
 import React, { useState, useEffect } from 'react';
@@ -65,6 +67,21 @@ export default function App() {
         // Prompt user to log in
         // Logic to display login dialog should be implemented here
       }
+
+      if (event.data ==== 'uikitRendered') {
+        // Logic to handle after uikit has been rendered
+      }
+
+      if (event.data ==== 'explorePageLoaded') {
+        // Logic to handle after Explore page has been loaded
+      }
+
+
+      if (event.data ==== 'parentNeedsScrollToTop') {
+        // `parentNeedsScrollToTop` will be posted from iFrame when the Nickname dialog is opened
+        window.scrollTo(0,0);
+      }
+
     };
 
     // Listen for messages from the iframe