@archytechtor/ui 0.0.0-stage → 0.1.0

package/dist/components/message/message.d.ts

@@ -0,0 +1,37 @@
+import { MessageAvatarPropsT, MessageContentPropsT, MessageFooterPropsT, MessageGroupPropsT, MessageHeaderPropsT, MessagePropsT } from "./types.js";
+/**
+ * Группа сообщений одного автора подряд
+ * @param props - пропсы группы
+ * @returns колонка сообщений
+ */
+export declare function MessageGroup({ className, ...props }: MessageGroupPropsT): import("react").JSX.Element;
+/**
+ * Сообщение чата: аватар и содержимое (пузырь, заголовок, подвал)
+ * @param props - пропсы сообщения
+ * @returns строка сообщения
+ */
+export declare function Message({ className, align, ...props }: MessagePropsT): import("react").JSX.Element;
+/**
+ * Аватар автора: внизу у последней строки, над подвалом, если он есть
+ * @param props - пропсы аватара
+ * @returns круглый контейнер аватара
+ */
+export declare function MessageAvatar({ className, ...props }: MessageAvatarPropsT): import("react").JSX.Element;
+/**
+ * Содержимое сообщения: заголовок, пузыри, вложения и подвал в колонку
+ * @param props - пропсы содержимого
+ * @returns колонка содержимого
+ */
+export declare function MessageContent({ className, ...props }: MessageContentPropsT): import("react").JSX.Element;
+/**
+ * Заголовок сообщения: имя автора, время
+ * @param props - пропсы заголовка
+ * @returns строка заголовка
+ */
+export declare function MessageHeader({ className, ...props }: MessageHeaderPropsT): import("react").JSX.Element;
+/**
+ * Подвал сообщения: статус доставки, действия
+ * @param props - пропсы подвала
+ * @returns строка подвала
+ */
+export declare function MessageFooter({ className, ...props }: MessageFooterPropsT): import("react").JSX.Element;

package/dist/components/message/message.js

@@ -0,0 +1,83 @@
+import { cn } from "../../lib/utils.js";
+import { jsx } from "react/jsx-runtime";
+// src/components/message/message.tsx
+/**
+* Группа сообщений одного автора подряд
+* @param props - пропсы группы
+* @returns колонка сообщений
+*/
+function MessageGroup({ className, ...props }) {
+	const classes = cn("flex", "min-w-0", "flex-col", "gap-2", className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "message-group",
+		className: classes,
+		...props
+	});
+}
+/**
+* Сообщение чата: аватар и содержимое (пузырь, заголовок, подвал)
+* @param props - пропсы сообщения
+* @returns строка сообщения
+*/
+function Message({ className, align = "start", ...props }) {
+	const classes = cn("group/message", "relative", "flex", "w-full", "min-w-0", "gap-2", "text-sm", "data-[align=end]:flex-row-reverse", className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "message",
+		"data-align": align,
+		className: classes,
+		...props
+	});
+}
+/**
+* Аватар автора: внизу у последней строки, над подвалом, если он есть
+* @param props - пропсы аватара
+* @returns круглый контейнер аватара
+*/
+function MessageAvatar({ className, ...props }) {
+	const classes = cn("flex", "w-fit", "min-w-8", "shrink-0", "items-center", "justify-center", "self-end", "overflow-hidden", "rounded-full", "bg-muted", "group-has-data-[slot=message-footer]/message:-translate-y-8", className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "message-avatar",
+		className: classes,
+		...props
+	});
+}
+/**
+* Содержимое сообщения: заголовок, пузыри, вложения и подвал в колонку
+* @param props - пропсы содержимого
+* @returns колонка содержимого
+*/
+function MessageContent({ className, ...props }) {
+	const classes = cn("flex", "w-full", "min-w-0", "flex-col", "gap-2.5", "wrap-break-word", "group-data-[align=end]/message:*:data-slot:self-end", className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "message-content",
+		className: classes,
+		...props
+	});
+}
+/**
+* Заголовок сообщения: имя автора, время
+* @param props - пропсы заголовка
+* @returns строка заголовка
+*/
+function MessageHeader({ className, ...props }) {
+	const classes = cn("flex", "max-w-full", "min-w-0", "items-center", "px-3", "text-xs", "font-medium", "text-muted-foreground", "group-has-data-[variant=ghost]/message:px-0", className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "message-header",
+		className: classes,
+		...props
+	});
+}
+/**
+* Подвал сообщения: статус доставки, действия
+* @param props - пропсы подвала
+* @returns строка подвала
+*/
+function MessageFooter({ className, ...props }) {
+	const classes = cn("flex", "max-w-full", "min-w-0", "items-center", "px-3", "text-xs", "font-medium", "text-muted-foreground", "group-has-data-[variant=ghost]/message:px-0", "group-data-[align=end]/message:justify-end", className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "message-footer",
+		className: classes,
+		...props
+	});
+}
+export { Message, MessageAvatar, MessageContent, MessageFooter, MessageGroup, MessageHeader };

package/dist/components/message/types.d.ts

@@ -0,0 +1,32 @@
+import { ComponentProps } from "react";
+/**
+ * Сторона сообщения: start — слева (собеседник), end — справа (своё)
+ */
+export type MessageAlignT = 'start' | 'end';
+/**
+ * Пропсы группы сообщений
+ */
+export type MessageGroupPropsT = ComponentProps<'div'>;
+/**
+ * Пропсы сообщения
+ */
+export type MessagePropsT = ComponentProps<'div'> & {
+  /** Сторона: start — слева (собеседник), end — справа (своё сообщение) */
+  align?: MessageAlignT;
+};
+/**
+ * Пропсы аватара сообщения
+ */
+export type MessageAvatarPropsT = ComponentProps<'div'>;
+/**
+ * Пропсы содержимого сообщения
+ */
+export type MessageContentPropsT = ComponentProps<'div'>;
+/**
+ * Пропсы заголовка сообщения
+ */
+export type MessageHeaderPropsT = ComponentProps<'div'>;
+/**
+ * Пропсы подвала сообщения
+ */
+export type MessageFooterPropsT = ComponentProps<'div'>;

package/dist/components/message-scroller/index.d.ts

@@ -0,0 +1,4 @@
+import { MessageScrollerButtonDirectionT, MessageScrollerButtonPropsT, MessageScrollerContentPropsT, MessageScrollerDefaultScrollPositionT, MessageScrollerItemPropsT, MessageScrollerPropsT, MessageScrollerProviderPropsT, MessageScrollerScrollAlignT, MessageScrollerScrollOptionsT, MessageScrollerScrollableT, MessageScrollerViewportPropsT, MessageScrollerVisibilityStateT } from "./types.js";
+import { useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility } from "./message-scroller-primitive.js";
+import { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport } from "./message-scroller.js";
+export { MessageScroller, MessageScrollerButton, type MessageScrollerButtonDirectionT, type MessageScrollerButtonPropsT, MessageScrollerContent, type MessageScrollerContentPropsT, type MessageScrollerDefaultScrollPositionT, MessageScrollerItem, type MessageScrollerItemPropsT, type MessageScrollerPropsT, MessageScrollerProvider, type MessageScrollerProviderPropsT, type MessageScrollerScrollAlignT, type MessageScrollerScrollOptionsT, type MessageScrollerScrollableT, MessageScrollerViewport, type MessageScrollerViewportPropsT, type MessageScrollerVisibilityStateT, useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility };

package/dist/components/message-scroller/index.js

@@ -0,0 +1,3 @@
+import { useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility } from "./message-scroller-primitive.js";
+import { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport } from "./message-scroller.js";
+export { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility };

package/dist/components/message-scroller/message-scroller-primitive.d.ts

@@ -0,0 +1,21 @@
+import { MessageScrollerScrollOptionsT, MessageScrollerScrollableT, MessageScrollerVisibilityStateT } from "./types.js";
+import { ComponentProps, KeyboardEvent } from "react";
+/**
+ * Команды прокрутки ленты
+ * @returns прокрутить в конец, в начало и к сообщению
+ */
+export declare function useMessageScroller(): {
+  scrollToEnd: (options?: MessageScrollerScrollOptionsT) => boolean;
+  scrollToMessage: (messageId: string, options?: MessageScrollerScrollOptionsT) => boolean;
+  scrollToStart: (options?: MessageScrollerScrollOptionsT) => boolean;
+};
+/**
+ * Есть ли куда прокручивать ленту
+ * @returns к началу и к концу
+ */
+export declare function useMessageScrollerScrollable(): MessageScrollerScrollableT;
+/**
+ * Видимые сообщения и якорь у верхнего края: слежение включается, пока есть подписчики
+ * @returns видимые сообщения и якорь
+ */
+export declare function useMessageScrollerVisibility(): MessageScrollerVisibilityStateT;