@nodeblocks/frontend-chat-conversation-block 0.1.0

package/dist/context.d.ts

@@ -0,0 +1,86 @@
+import { AvatarProps } from '@basaldev/blocks-frontend-framework';
+import { ReactNode } from 'react';
+type ChatConversationContextValue = {
+    /** Callback when submitting a message*/
+    onMessageSubmit?: (text: string) => void;
+    /** Callback on comment change */
+    onInputChange?: (text: string) => void;
+    /** Configs for the comment input at the bottom of the page */
+    commentInput?: {
+        /** Disables input (while submitting or similar) */
+        isDisabled?: boolean;
+        /** Error message to show below the comment input field */
+        errorText?: string;
+    };
+    /** Configs for the comment input submit button */
+    commentSubmitButton?: {
+        /** Disables input (while submitting or similar) */
+        isDisabled?: boolean;
+    };
+    /** Chat panel configuration */
+    chatView: {
+        /** Configuration for the chat view heading above the chat view */
+        heading?: {
+            avatar?: AvatarProps;
+            buttonHref: string;
+        };
+        /**
+         * Loading state for either overall view or for previous methods
+         * (depends on whether messages is empty)
+         */
+        isLoading?: boolean;
+        /**
+         * Callback when the user has scrolled up and reached the top of the chat view
+         * This can be used to fetch more messages from the server.
+         */
+        onScrollTop?: (earliestMessageId: string) => void;
+    };
+    /**
+     * The list of messages to show in the chat view
+     * Messages should always be provided newest-first.
+     * They will be displayed with the newest at the bottom.
+     *
+     * When the latest message id changes, the user scroll will be
+     * updated automatically if the user is currently at the bottom, otherwise
+     * they will remain where they are.
+     */
+    messages: {
+        /** Avatar used if no image is provided; if not provided, no avatar shown */
+        avatarColor?: AvatarProps['avatarColor'];
+        /** Avatar link href (requires onNavigate) */
+        avatarHref?: AvatarProps['href'];
+        /** Avatar picture */
+        avatarUrl?: AvatarProps['avatarUrl'];
+        /** Message bubble content */
+        content: string;
+        /**
+         * Date time the message was created at, as an ISO string
+         * Messages will then be grouped by days based on the configured locale via
+         * the luxon library
+         */
+        createdAt: string;
+        /** Identifier for this message (for callbacks) */
+        id: string;
+        /** Messages that are your own are highlighted */
+        isOwnMessage?: boolean;
+        /** Title string (appears above the bubble) */
+        title?: string;
+    }[];
+    /** Label text configuration */
+    labels: {
+        chatViewHeadingButtonText?: string;
+        chatViewHeadingText?: string;
+    };
+    /** Navigation callback (required for href) */
+    onNavigate: (url: string) => void;
+    /** Placeholder text configuration */
+    placeholders: {
+        commentInput: string;
+    };
+};
+export declare const ChatConversationProvider: ({ children, ...value }: ChatConversationContextValue & {
+    children: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const useChatConversationContext: () => ChatConversationContextValue;
+export {};
+//# sourceMappingURL=context.d.ts.map

package/dist/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../src/context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAClE,OAAO,EAAiB,SAAS,EAAc,MAAM,OAAO,CAAC;AAE7D,KAAK,4BAA4B,GAAG;IAClC,wCAAwC;IACxC,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,iCAAiC;IACjC,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAEvC,8DAA8D;IAC9D,YAAY,CAAC,EAAE;QACb,mDAAmD;QACnD,UAAU,CAAC,EAAE,OAAO,CAAC;QAIrB,0DAA0D;QAC1D,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,kDAAkD;IAClD,mBAAmB,CAAC,EAAE;QACpB,mDAAmD;QACnD,UAAU,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;IACF,+BAA+B;IAC/B,QAAQ,EAAE;QACR,kEAAkE;QAClE,OAAO,CAAC,EAAE;YACR,MAAM,CAAC,EAAE,WAAW,CAAC;YACrB,UAAU,EAAE,MAAM,CAAC;SACpB,CAAC;QACF;;;WAGG;QACH,SAAS,CAAC,EAAE,OAAO,CAAC;QACpB;;;WAGG;QACH,WAAW,CAAC,EAAE,CAAC,iBAAiB,EAAE,MAAM,KAAK,IAAI,CAAC;KACnD,CAAC;IACF;;;;;;;;OAQG;IACH,QAAQ,EAAE;QACR,4EAA4E;QAC5E,WAAW,CAAC,EAAE,WAAW,CAAC,aAAa,CAAC,CAAC;QACzC,6CAA6C;QAC7C,UAAU,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;QACjC,qBAAqB;QACrB,SAAS,CAAC,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;QACrC,6BAA6B;QAC7B,OAAO,EAAE,MAAM,CAAC;QAChB;;;;WAIG;QACH,SAAS,EAAE,MAAM,CAAC;QAClB,kDAAkD;QAClD,EAAE,EAAE,MAAM,CAAC;QACX,iDAAiD;QACjD,YAAY,CAAC,EAAE,OAAO,CAAC;QACvB,8CAA8C;QAC9C,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,EAAE,CAAC;IACJ,+BAA+B;IAC/B,MAAM,EAAE;QACN,yBAAyB,CAAC,EAAE,MAAM,CAAC;QACnC,mBAAmB,CAAC,EAAE,MAAM,CAAC;KAC9B,CAAC;IACF,8CAA8C;IAC9C,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,qCAAqC;IACrC,YAAY,EAAE;QACZ,YAAY,EAAE,MAAM,CAAC;KACtB,CAAC;CACH,CAAC;AAIF,eAAO,MAAM,wBAAwB,GAAI,wBAGtC,4BAA4B,GAAG;IAChC,QAAQ,EAAE,SAAS,CAAC;CACrB,4CAEA,CAAC;AAEF,eAAO,MAAM,0BAA0B,oCAOtC,CAAC"}