@amityco/ui-kit-open-source 4.0.0-beta.9 → 4.0.2

package/dist/index.d.ts

@@ -1,48 +1,340 @@
-import React, { ReactNode } from 'react';
-import { PostContentType } from '@amityco/ts-sdk';
-import * as styled_components from 'styled-components';
+import React, { ReactNode, RefObject } from 'react';
 import * as styled_components_dist_types from 'styled-components/dist/types';
+import * as styled_components from 'styled-components';
 
-type CustomComponentName = 'Avatar' | 'CategoryHeader' | 'CategorySelector' | 'Chat' | 'ChatDetails' | 'ChatHeader' | 'ChatItem' | 'Comment' | 'CommentComposerBar' | 'CommentLikeButton' | 'CommunityCreatedModel' | 'CommunityCreationModal' | 'CommunityForm' | 'CommunityItem' | 'CommunityMembers' | 'CommunityName' | 'CommunityPermissions' | 'EmptyFeed' | 'EngagementBar' | 'Feed' | 'FeedHeaderTabs' | 'File' | 'Image' | 'ImageGallery' | 'Images' | 'Layout' | 'MediaGallery' | 'MenuTab' | 'Message' | 'MessageComposerBar' | 'MessageList' | 'Post' | 'PostLikeButton' | 'PostTargetSelector' | 'ProfileSettings' | 'ProfileSettingsTabs' | 'RecentChat' | 'SideNavBar' | 'SocialSearch' | 'Tabs' | 'UICategoryCard' | 'UICommunityCard' | 'UICommunityHeader' | 'UICommunityInfo' | 'UIEngagementBar' | 'UIPostHeader' | 'UITextContent' | 'UITrendingItem' | 'UIUserInfo' | 'UserChip' | 'UserHeader' | 'UserSelector';
-type CustomComponentType = Partial<Record<CustomComponentName, <TProps>(props: TProps) => React.ReactElement<TProps>>>;
+type AmityReactionType = {
+    name: string;
+    image: string;
+};
 
-type PostRendererProps = {
-    childrenPosts?: Amity.Post[];
-    className?: string;
-    currentUserId?: string;
-    handleDeletePost?: (postId: string) => void;
-    handleReportPost?: () => void;
-    handleUnreportPost?: () => void;
-    handleApprovePost?: () => void;
-    handleDeclinePost?: () => void;
-    handleClosePoll?: () => void;
-    poll?: Amity.Poll | null;
-    isPollClosed?: boolean;
-    hidePostTarget?: boolean;
-    isFlaggedByMe?: boolean;
-    readonly?: boolean;
-    post?: Amity.Post;
-    user?: Amity.User | null;
-    userRoles?: string[];
-    loading?: boolean;
-    avatarFileUrl?: string;
+type ThemeValue = {
+    primary_color: string;
+    secondary_color: string;
+    secondary_shade1_color: string;
+    secondary_shade2_color: string;
+    secondary_shade3_color: string;
+    secondary_shade4_color: string;
+    base_color: string;
+    base_shade1_color: string;
+    base_shade2_color: string;
+    base_shade3_color: string;
+    base_shade4_color: string;
+    base_shade5_color: string;
+    alert_color: string;
+    background_color: string;
+    base_inverse_color: string;
+};
+type Theme = {
+    light: ThemeValue;
+    dark: ThemeValue;
+};
+type ThemeConfiguration = {
+    preferred_theme?: 'light' | 'dark' | 'default';
+    theme?: {
+        light?: Partial<Theme['light']>;
+        dark?: Partial<Theme['dark']>;
+    };
+};
+interface Config {
+    preferred_theme?: 'light' | 'dark' | 'default';
+    theme?: {
+        light?: Theme['light'];
+        dark?: Theme['dark'];
+    };
+    excludes?: string[];
+    message_reactions?: AmityReactionType[];
+    customizations?: {
+        [key: string]: IconConfiguration & TextConfiguration & ThemeConfiguration & CustomConfiguration;
+    };
+}
+type IconConfiguration = {
+    icon?: string;
+    image?: string;
+};
+type TextConfiguration = {
+    text?: string;
+};
+type CustomConfiguration = {
+    [key: string]: string | undefined | boolean | Array<string> | number | Record<string, unknown>;
 };
-type PostRendererConfigType = Record<ValueOf<typeof PostContentType> | string, (props: PostRendererProps) => ReactNode>;
 
-interface UiKitProviderProps {
+declare enum AmityPostContentComponentStyle {
+    FEED = "feed",
+    DETAIL = "detail"
+}
+declare enum AmityPostCategory {
+    GENERAL = "general",
+    ANNOUNCEMENT = "announcement",
+    PIN = "pin",
+    PIN_AND_ANNOUNCEMENT = "pin_and_announcement"
+}
+interface PostContentProps {
+    post: Amity.Post;
+    onClick?: () => void;
+    onPostDeleted?: (post: Amity.Post) => void;
+    style: AmityPostContentComponentStyle;
+    category: AmityPostCategory;
+    hideMenu?: boolean;
+    hideTarget?: boolean;
+    pageId?: string;
+    disabledContent?: boolean;
+    isGlobalFeaturePost?: boolean;
+}
+declare const PostContent: ({ pageId, post: initialPost, onClick, onPostDeleted, category, hideMenu, hideTarget, style, disabledContent, isGlobalFeaturePost, }: PostContentProps) => React.JSX.Element;
+
+type MemberCommunitySetup = {
+    userId: string;
+    displayName: string;
+};
+declare enum AmityCommunitySetupPageMode {
+    CREATE = "create",
+    EDIT = "edit"
+}
+
+declare enum Mode {
+    CREATE = "create",
+    EDIT = "edit"
+}
+interface AmityPostComposerEditOptions {
+    mode: Mode.EDIT;
+    post: Amity.Post;
+}
+interface AmityPostComposerCreateOptions {
+    mode: Mode.CREATE;
+    targetId: string | null;
+    targetType: 'community' | 'user';
+    community?: Amity.Community;
+}
+type PostComposerPageProps = AmityPostComposerCreateOptions | AmityPostComposerEditOptions;
+declare function PostComposerPage(props: PostComposerPageProps): React.JSX.Element;
+
+declare const enum UserRelationshipPageTabs {
+    FOLLOWING = "following",
+    FOLLOWER = "followers"
+}
+
+interface PageBehavior {
+    AmityStoryViewPageBehavior?: {
+        onCloseAction?(): void;
+        hyperLinkAction?(context: Record<string, unknown>): void;
+    };
+    AmityDraftStoryPageBehavior?: {
+        closeAction?(): void;
+    };
+    onClickHyperLink?(): void;
+    AmitySocialHomePageBehavior?: Record<string, unknown>;
+    AmityGlobalFeedComponentBehavior?: {
+        goToPostDetailPage?: (context: {
+            postId: string;
+            hideTarget?: boolean;
+            category?: AmityPostCategory;
+        }) => void;
+        goToViewStoryPage?: (context: {
+            targetId: string;
+            targetType: Amity.StoryTargetType;
+            storyType: 'communityFeed' | 'globalFeed';
+            targetIds?: string[];
+        }) => void;
+        goToCreateCommunityPage?(context: {
+            mode: AmityCommunitySetupPageMode;
+        }): void;
+    };
+    AmityPostDetailPageBehavior?: Record<string, unknown>;
+    AmityPostContentComponentBehavior?: {
+        goToCommunityProfilePage?: (context: {
+            communityId: string;
+        }) => void;
+        goToUserProfilePage?: (context: {
+            userId: string;
+        }) => void;
+        goToPostComposerPage?: (context: {
+            mode: Mode.EDIT;
+            post: Amity.Post;
+        }) => void;
+    };
+    AmitySocialGlobalSearchPageBehavior?: Record<string, unknown>;
+    AmityCommunitySearchResultComponentBehavior?: {
+        goToCommunityProfilePage?: (context: {
+            communityId: string;
+        }) => void;
+    };
+    AmityUserSearchResultComponentBehavior?: {
+        goToUserProfilePage?: (context: {
+            userId: string;
+        }) => void;
+    };
+    AmityCreatePostMenuComponentBehavior?: {
+        goToSelectPostTargetPage?(): void;
+        goToStoryTargetSelectionPage?(): void;
+        goToSelectPollPostTargetPage?(): void;
+    };
+    AmityPostTargetSelectionPage?: {
+        goToPostComposerPage?: (context: {
+            mode: Mode.CREATE;
+            targetId: string | null;
+            targetType: 'community' | 'user';
+            community?: Amity.Community;
+        }) => void;
+    };
+    AmityStoryTargetSelectionPage?: {
+        goToStoryCreationPage?(context: {
+            targetId: string | null;
+            targetType: Amity.StoryTargetType;
+            mediaType: {
+                type: 'image';
+                url: string;
+            } | {
+                type: 'video';
+                url: string;
+            };
+            storyType: 'communityFeed' | 'globalFeed';
+        }): void;
+    };
+    AmityPostComposerPageBehavior?: {
+        goToSocialHomePage?(): void;
+    };
+    AmityCommunityProfilePageBehavior?: {
+        goToPostComposerPage?(context: {
+            mode: Mode.CREATE | Mode.EDIT;
+            targetId: string | null;
+            targetType: 'community' | 'user';
+            community?: Amity.Community;
+            post?: Amity.Post;
+        }): void;
+        goToPostDetailPage?(context: {
+            postId: string;
+            hideTarget?: boolean;
+            category?: AmityPostCategory;
+        }): void;
+        goToStoryCreationPage?(context: {
+            targetId: string | null;
+            targetType: Amity.StoryTargetType;
+            mediaType: {
+                type: 'image';
+                url: string;
+            } | {
+                type: 'video';
+                url: string;
+            };
+            storyType: 'communityFeed' | 'globalFeed';
+        }): void;
+        goToCommunitySettingPage?(context: {
+            community: Amity.Community;
+        }): void;
+        goToEditCommunityPage?(context: {
+            mode: AmityCommunitySetupPageMode;
+            community: Amity.Community;
+        }): void;
+        goToPendingPostPage?(context: {
+            communityId: string;
+        }): void;
+        goToMembershipPage?(context: {
+            community: Amity.Community;
+        }): void;
+        goToPollPostComposerPage?(context: {
+            targetId: string | null;
+            targetType: 'community' | 'user';
+        }): void;
+    };
+    AmitySocialHomeTopNavigationComponentBehavior?: {
+        goToCreateCommunityPage?(context: {
+            mode: AmityCommunitySetupPageMode;
+        }): void;
+    };
+    AmityCommunitySetupPageBehavior?: {
+        goToAddCategoryPage?(context: {
+            categories?: Amity.Category[];
+        }): void;
+        goToAddMemberPage?(context: {
+            members?: MemberCommunitySetup[];
+            communityId?: string;
+            onAddedAction?: (userId: string[]) => void;
+        }): void;
+    };
+    AmityCommunitySettingPageBehavior?: {
+        goToEditCommunityPage?(context: {
+            mode: AmityCommunitySetupPageMode;
+            community: Amity.Community;
+        }): void;
+        goToMembershipPage?(context: {
+            community: Amity.Community;
+        }): void;
+        goToPostPermissionPage?(context: {
+            community: Amity.Community;
+        }): void;
+        goToStorySettingPage?(context: {
+            community: Amity.Community;
+        }): void;
+        goToSocialHomePage?(): void;
+    };
+    AmityCommunityMembershipPage?: {
+        goToAddMemberPage?(context: {
+            members?: MemberCommunitySetup[];
+            communityId?: string;
+            onAddedAction?: (userId: string[]) => void;
+        }): void;
+        goToUserProfilePage?: (context: {
+            userId: string;
+        }) => void;
+    };
+    AmityUserFeedComponentBehavior?: {
+        goToPostDetailPage?(context: {
+            postId: string;
+        }): void;
+    };
+    AmityUserProfilePageBehavior?: {
+        goToEditUserPage?(context: {
+            userId: string;
+        }): void;
+        goToBlockedUsersPage?(): void;
+        goToPostComposerPage?(context: {
+            userId: string;
+        }): void;
+    };
+    AmityUserProfileHeaderComponentBehavior: {
+        goToUserRelationshipPage?(context: {
+            userId: string;
+            selectedTab: UserRelationshipPageTabs;
+        }): void;
+        goToPendingFollowRequestPage?(): void;
+    };
+    AmityUserRelationshipPageBehavior: {
+        goToUserProfilePage?(context: {
+            userId: string;
+        }): void;
+    };
+    AmityUserPendingFollowRequestsPageBehavior: {
+        goToUserProfilePage?(context: {
+            userId: string;
+        }): void;
+    };
+    AmityBlockedUsersPageBehavior: {
+        goToUserProfilePage?(context: {
+            userId: string;
+        }): void;
+    };
+    AmityPollTargetSelectionPageBehavior?: {
+        goToPollPostComposerPage?(context: {
+            targetId: string | null;
+            targetType: 'community' | 'user';
+        }): void;
+    };
+}
+
+type AmityUIKitConfig = Config;
+interface AmityUIKitProviderProps {
     apiKey: string;
     apiRegion: string;
     apiEndpoint?: {
         http?: string;
         mqtt?: string;
     };
-    authToken?: string;
     userId: string;
-    displayName: string;
-    customComponents?: CustomComponentType;
-    postRendererConfig?: PostRendererConfigType;
+    displayName?: string;
+    postRendererConfig?: any;
     theme?: Record<string, unknown>;
     children?: React.ReactNode;
+    socialCommunityCreationButtonVisible?: boolean;
     actionHandlers?: {
         onChangePage?: (data: {
             type: string;
@@ -57,15 +349,15 @@ interface UiKitProviderProps {
         }) => void;
         onEditUser?: (userId: string) => void;
         onMessageUser?: (userId: string) => void;
-        onBack?: () => void;
     };
-    socialCommunityCreationButtonVisible?: boolean;
+    pageBehavior?: PageBehavior;
     onConnectionStatusChange?: (state: Amity.SessionStates) => void;
     onConnected?: () => void;
     onDisconnected?: () => void;
-    pageBehavior?: Record<string, unknown>;
+    getAuthToken?: () => Promise<string>;
+    configs?: AmityUIKitConfig;
 }
-declare const UiKitProvider: ({ apiKey, apiRegion, apiEndpoint, authToken, userId, displayName, customComponents, postRendererConfig, theme, children, socialCommunityCreationButtonVisible, actionHandlers, onConnectionStatusChange, onDisconnected, }: UiKitProviderProps) => React.JSX.Element;
+declare const AmityUIKitProvider: React.FC<AmityUIKitProviderProps>;
 
 interface FeedProps {
     className?: string;
@@ -80,7 +372,7 @@ interface FeedProps {
 }
 declare const _default$2: React.MemoExoticComponent<(props: FeedProps) => React.JSX.Element>;
 
-declare const Community: () => React.JSX.Element;
+declare const Application: () => React.JSX.Element;
 
 type PartialChannel = Pick<Amity.Channel, 'channelId' | 'type'>;
 declare const ChatApplication: ({ membershipFilter, defaultChannelId, onMemberSelect, onChannelSelect, onAddNewChannel, onEditChatMember, }: {
@@ -178,6 +470,7 @@ type ContextValue = {
         title: ReactNode;
         content: ReactNode;
         okText: ReactNode;
+        onOk?: () => void;
     } | null | undefined) => void;
 };
 declare const useNavigation: () => ContextValue;
@@ -200,10 +493,10 @@ interface AvatarProps {
 }
 declare const _default$1: (props: AvatarProps) => React.JSX.Element;
 
-declare const PostContainer: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<{
+declare const PostContainer: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<{
     className?: string | undefined;
     children?: ReactNode;
-}, never>> & Omit<({ className, ...props }: {
+}, never>> & string & Omit<({ className, ...props }: {
     className?: string | undefined;
     children?: ReactNode;
 }) => React.JSX.Element, keyof React.Component<any, {}, any>>;
@@ -213,6 +506,7 @@ type Mentioned = {
     length: number;
     index: number;
     type: string;
+    displayName: string;
 };
 
 interface EngagementBarProps {
@@ -279,11 +573,12 @@ declare class AmityUIKitManager {
      * @param userId - The user ID to be used for login.
      * @param displayName - The display name of the user.
      * @param sessionHandler - The session handler for access token renewal.
+     * @param authToken - The authentication token to be used for login.
      * @param onConnectionStatusChange - The callback function for connection status changes.
      * @param onConnected - The callback function to be called when connected.
      * @param onDisconnected - The callback function to be called when disconnected.
      */
-    static registerDevice(userId: string, displayName: string, sessionHandler: SessionHandler, onConnectionStatusChange?: (state: Amity.SessionStates) => void, onConnected?: () => void, onDisconnected?: () => void): Promise<void>;
+    static registerDevice(userId: string, displayName: string, sessionHandler: SessionHandler, authToken?: string, onConnectionStatusChange?: (state: Amity.SessionStates) => void, onConnected?: () => void, onDisconnected?: () => void): Promise<void>;
     /**
      * Sets the AmityClient instance to be used by the AmityUIKitManager.
      * This method is useful when sharing the AmityClient instance between different parts of the application.
@@ -313,15 +608,61 @@ declare class AmityUIKitManager {
     isClientConnected(): boolean;
 }
 
-interface CommentTrayProps {
-    referenceType: Amity.CommentReferenceType;
-    referenceId?: string;
-    community: Amity.Community;
-    shouldAllowInteraction: boolean;
-    shouldAllowCreation?: boolean;
+interface ChatHeaderProps {
+    channel: Amity.Channel | null;
+    pageId?: string;
+    componentId?: string;
+}
+declare const ChatHeader: ({ channel, pageId }: ChatHeaderProps) => React.JSX.Element;
+
+interface AmityLiveChatMessageListProps {
+    pageId?: string;
+    channel: Amity.Channel;
+    replyMessage: (message: Amity.Message<'text'>) => void;
+}
+declare const MessageList: ({ pageId, channel, replyMessage, }: AmityLiveChatMessageListProps) => React.JSX.Element;
+
+type ComposeActionTypes = {
+    replyMessage?: Amity.Message;
+    mentionMessage?: Amity.Message;
+    clearReplyMessage?: () => void;
+    clearMention?: () => void;
+};
+interface MessageComposerProps {
+    channel: Amity.Channel;
+    composeAction: ComposeActionTypes;
+    suggestionRef?: RefObject<HTMLDivElement>;
+    disabled?: boolean;
     pageId?: string;
 }
-declare const CommentTray: ({ pageId, referenceType, referenceId, community, shouldAllowInteraction, shouldAllowCreation, }: CommentTrayProps) => React.JSX.Element;
+declare const MessageComposer: ({ pageId, channel, composeAction: { replyMessage, mentionMessage, clearReplyMessage, clearMention }, }: MessageComposerProps) => React.JSX.Element;
+
+declare const MessageReactionPreview: ({ message, onClick, }: {
+    message: Amity.Message;
+    onClick?: (() => void) | undefined;
+}) => React.JSX.Element | null;
+
+declare const MessageReactionPicker: ({ message, onSelectReaction, }: {
+    message: Amity.Message;
+    onSelectReaction: (reactionName: string) => void;
+}) => React.JSX.Element | null;
+
+interface MessageQuickReactionProps {
+    pageId?: string;
+    componentId?: string;
+    message: Amity.Message;
+    onSelectReaction?: () => void;
+}
+declare const MessageQuickReaction: ({ pageId, componentId, message, onSelectReaction, }: MessageQuickReactionProps) => React.JSX.Element;
+
+type MessageActionType = {
+    onCopy?: () => void;
+    onFlag?: () => void;
+    onUnflag?: () => void;
+    onDelete?: () => void;
+    onReply?: () => void;
+    onMention?: () => void;
+};
 
 interface ReactionListProps$1 {
     pageId: string;
@@ -335,23 +676,6 @@ interface ReactionListProps {
     referenceType: Amity.ReactableType;
 }
 
-type StoryTabProps = ({
-    type: 'communityFeed';
-    communityId: string;
-} | {
-    type: 'globalFeed';
-}) & {
-    pageId?: string;
-};
-declare const StoryTab: React.FC<StoryTabProps>;
-
-declare enum HomePageTab {
-    Newsfeed = "Newsfeed",
-    Explore = "Explore",
-    MyCommunities = "My communities"
-}
-declare function SocialHomePage(): React.JSX.Element;
-
 interface LiveChatProps {
     channelId: Amity.Channel['channelId'];
 }
@@ -412,22 +736,7 @@ declare const ViewStoryPage: React.FC<AmityViewStoryPageProps>;
 
 declare function StoryTargetSelectionPage(): React.JSX.Element;
 
-declare enum Mode {
-    CREATE = "create",
-    EDIT = "edit"
-}
-interface AmityPostComposerEditOptions {
-    mode: Mode.EDIT;
-    post?: Amity.Post;
-}
-interface AmityPostComposerCreateOptions {
-    mode: Mode.CREATE;
-    targetId: string | null;
-    targetType: 'community' | 'user';
-    community?: Amity.Community;
-}
-type PostComposerPageProps = AmityPostComposerCreateOptions | AmityPostComposerEditOptions;
-declare function PostComposerPage(props: PostComposerPageProps): React.JSX.Element | null;
+declare function SocialHomePage(): React.JSX.Element;
 
 declare function SelectPostTargetPage(): React.JSX.Element;
 
@@ -437,7 +746,154 @@ declare function SocialGlobalSearchPage(): React.JSX.Element;
 
 interface PostDetailPageProps {
     id: string;
+    hideTarget?: boolean;
+    category?: AmityPostCategory;
+}
+declare function PostDetailPage({ id, hideTarget, category }: PostDetailPageProps): React.JSX.Element;
+
+interface CommunityProfileProps {
+    communityId: string;
+    page?: number;
+}
+declare const CommunityProfilePage: React.FC<CommunityProfileProps>;
+
+type UserProfilePageProps = {
+    userId: string;
+};
+declare const UserProfilePage: React.FC<UserProfilePageProps>;
+
+interface EditUserProfilePageProps {
+    userId: string;
+}
+declare const EditUserProfilePage: React.FC<EditUserProfilePageProps>;
+
+type CommentTrayProps = {
+    pageId?: string;
+    referenceId: string;
+    community: Amity.Community;
+    shouldAllowCreation?: boolean;
+    shouldAllowInteraction: boolean;
+    referenceType: Amity.CommentReferenceType;
+};
+declare const CommentTray: ({ referenceId, pageId, referenceType, shouldAllowCreation, shouldAllowInteraction, community, }: CommentTrayProps) => React.JSX.Element;
+
+type StoryTabProps = ({
+    type: 'communityFeed';
+    communityId: string;
+} | {
+    type: 'globalFeed';
+}) & {
+    pageId?: string;
+};
+declare const StoryTab: React.FC<StoryTabProps>;
+
+type CreatePostMenuProps = {
+    pageId: string;
+};
+declare function CreatePostMenu({ pageId }: CreatePostMenuProps): React.JSX.Element;
+
+interface MediaAttachmentProps {
+    pageId: string;
+    uploadLoading?: boolean;
+    isVisibleCamera: boolean;
+    isVisibleImage: boolean;
+    isVisibleVideo: boolean;
+    onVideoFileChange?: (files: File[]) => void;
+    onImageFileChange?: (files: File[]) => void;
+}
+declare function MediaAttachment({ pageId, isVisibleCamera, isVisibleImage, isVisibleVideo, onVideoFileChange, onImageFileChange, }: MediaAttachmentProps): React.JSX.Element | null;
+
+interface DetailedMediaAttachmentProps {
+    pageId: string;
+    isVisibleCamera: boolean;
+    isVisibleImage: boolean;
+    isVisibleVideo: boolean;
+    onVideoFileChange?: (files: File[]) => void;
+    onImageFileChange?: (files: File[]) => void;
+}
+declare function DetailedMediaAttachment({ pageId, isVisibleCamera, isVisibleImage, isVisibleVideo, onVideoFileChange, onImageFileChange, }: DetailedMediaAttachmentProps): React.JSX.Element | null;
+
+type UserSearchResultProps = {
+    pageId?: string;
+    isLoading: boolean;
+    onLoadMore: () => void;
+    userCollection: Amity.User[];
+    onClosePopover?: () => void;
+};
+declare const UserSearchResult: ({ isLoading, onLoadMore, pageId, onClosePopover, userCollection, }: UserSearchResultProps) => React.JSX.Element;
+
+type CommunitySearchResultProps = {
+    pageId?: string;
+    isLoading: boolean;
+    onLoadMore: () => void;
+    showJoinButton?: boolean;
+    onClosePopover?: () => void;
+    communityCollection: Amity.Community[];
+};
+declare const CommunitySearchResult: ({ isLoading, onLoadMore, pageId, onClosePopover, showJoinButton, communityCollection, }: CommunitySearchResultProps) => React.JSX.Element;
+
+type TopSearchBarProps = {
+    pageId?: string;
+    onFocus?: () => void;
+    search: (keyword: string) => void;
+};
+declare function TopSearchBar({ pageId, search, onFocus }: TopSearchBarProps): React.JSX.Element | null;
+
+interface MyCommunitiesProps {
+    pageId?: string;
+}
+declare const MyCommunities: ({ pageId }: MyCommunitiesProps) => React.JSX.Element;
+
+interface GlobalFeedProps {
+    pageId?: string;
+    componentId?: string;
+    items: Array<Amity.Post | Amity.Ad>;
+    isLoading: boolean;
+    onFeedReachBottom: () => void;
+    onPostDeleted?: (post: Amity.Post) => void;
+}
+declare const GlobalFeed: ({ pageId, componentId, items, isLoading, onFeedReachBottom, onPostDeleted, }: GlobalFeedProps) => React.JSX.Element;
+
+interface EmptyNewsfeedProps {
+    pageId?: string;
+}
+declare function EmptyNewsfeed({ pageId }: EmptyNewsfeedProps): React.JSX.Element | null;
+
+type NewsfeedProps = {
+    pageId?: string;
+};
+declare const Newsfeed: ({ pageId }: NewsfeedProps) => React.JSX.Element;
+
+declare enum HomePageTab {
+    Newsfeed = "Newsfeed",
+    Explore = "Explore",
+    MyCommunities = "My communities"
+}
+
+interface TopNavigationProps {
+    pageId?: string;
+    selectedTab?: HomePageTab;
+    onClickPostCreationButton?: () => void;
+}
+declare function TopNavigation({ pageId, selectedTab, onClickPostCreationButton, }: TopNavigationProps): React.JSX.Element | null;
+
+interface CommunityProfileHeaderProps {
+    pageId?: string;
+    community: Amity.Community;
+    isSticky?: boolean;
+    page?: number;
+}
+declare const CommunityHeader: React.FC<CommunityProfileHeaderProps>;
+
+interface CommunityFeedProps {
+    communityId: string;
+    pageId?: string;
+}
+declare const CommunityFeed: ({ pageId, communityId }: CommunityFeedProps) => React.JSX.Element | null;
+
+interface CommunityPinnedPostProps {
+    communityId?: string;
 }
-declare function PostDetailPage({ id }: PostDetailPageProps): React.JSX.Element;
+declare const CommunityPinnedPost: ({ communityId }: CommunityPinnedPostProps) => React.JSX.Element;
 
-export { _default$1 as AmityAvatar, CommentTray as AmityCommentTrayComponent, AmityDraftStoryPage, CommentText as AmityExpandableText, LiveChat as AmityLiveChatPage, MyCommunitiesSearchPage as AmityMyCommunitiesSearchPage, PostComposerPage as AmityPostComposerPage, PostContainer as AmityPostContainer, PostDetailPage as AmityPostDetailPage, _default as AmityPostEngagementBar, SelectPostTargetPage as AmityPostTargetSelectionPage, ReactionList as AmityReactionList, type ReactionListProps as AmityReactionListProps, SocialGlobalSearchPage as AmitySocialGlobalSearchPage, SocialHomePage as AmitySocialHomePage, HomePageTab as AmitySocialHomePageTab, StoryPreview as AmityStoryPreview, StoryPreviewThumbnail as AmityStoryPreviewThumbnail, StoryTab as AmityStoryTabComponent, StoryTargetSelectionPage as AmityStoryTargetSelectionPage, AmityUIKitManager, ChatApplication as AmityUiKitChat, _default$2 as AmityUiKitFeed, UiKitProvider as AmityUiKitProvider, Community as AmityUiKitSocial, ViewStoryPage as AmityViewStoryPage, addChatMembers as amityAddChatMembers, removeChatMembers as amityRemoveChatMembers, useNavigation as useAmityNavigation, useSDK as useAmitySDK, useUser as useAmityUser };
+export { _default$1 as AmityAvatar, CommentTray as AmityCommentTrayComponent, CommunityFeed as AmityCommunityFeedComponent, CommunityHeader as AmityCommunityHeaderComponent, CommunityPinnedPost as AmityCommunityPinnedPostComponent, CommunityProfilePage as AmityCommunityProfilePage, CommunitySearchResult as AmityCommunitySearchResultComponent, CreatePostMenu as AmityCreatePostMenuComponent, DetailedMediaAttachment as AmityDetailedMediaAttachmentComponent, AmityDraftStoryPage, EditUserProfilePage as AmityEditUserProfilePage, EmptyNewsfeed as AmityEmptyNewsFeedComponent, CommentText as AmityExpandableText, GlobalFeed as AmityGlobalFeedComponent, ChatHeader as AmityLiveChatHeader, MessageComposer as AmityLiveChatMessageComposeBar, MessageList as AmityLiveChatMessageList, MessageQuickReaction as AmityLiveChatMessageQuickReaction, MessageReactionPicker as AmityLiveChatMessageReactionPicker, MessageReactionPreview as AmityLiveChatMessageReactionPreview, LiveChat as AmityLiveChatPage, MediaAttachment as AmityMediaAttachmentComponent, type MessageActionType as AmityMessageActionType, MyCommunities as AmityMyCommunitiesComponent, MyCommunitiesSearchPage as AmityMyCommunitiesSearchPage, Newsfeed as AmityNewsFeedComponent, PostComposerPage as AmityPostComposerPage, PostContainer as AmityPostContainer, PostContent as AmityPostContentComponent, PostDetailPage as AmityPostDetailPage, _default as AmityPostEngagementBar, SelectPostTargetPage as AmityPostTargetSelectionPage, ReactionList as AmityReactionListComponent, type ReactionListProps as AmityReactionListProps, SocialGlobalSearchPage as AmitySocialGlobalSearchPage, SocialHomePage as AmitySocialHomePage, HomePageTab as AmitySocialHomePageTab, TopNavigation as AmitySocialHomeTopNavigationComponent, StoryPreview as AmityStoryPreview, StoryPreviewThumbnail as AmityStoryPreviewThumbnail, StoryTab as AmityStoryTabComponent, StoryTargetSelectionPage as AmityStoryTargetSelectionPage, TopSearchBar as AmityTopSearchBarComponent, AmityUIKitManager, ChatApplication as AmityUiKitChat, _default$2 as AmityUiKitFeed, AmityUIKitProvider as AmityUiKitProvider, Application as AmityUiKitSocial, UserProfilePage as AmityUserProfilePage, UserSearchResult as AmityUserSearchResultComponent, ViewStoryPage as AmityViewStoryPage, addChatMembers as amityAddChatMembers, removeChatMembers as amityRemoveChatMembers, useNavigation as useAmityNavigation, useSDK as useAmitySDK, useUser as useAmityUser };