@connectycube/react-ui-kit 0.0.17 → 0.0.19

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

@@ -0,0 +1,45 @@
+import type React from 'react';
+import { type LucideProps } from 'lucide-react';
+interface AttachmentProps {
+    uid?: string;
+    url?: string;
+    mimeType?: string;
+    uploading?: boolean;
+    onReady?: (skipOnce?: boolean) => void;
+    linkProps?: AttachmentLinkProps;
+    containerProps?: React.ComponentProps<'div'>;
+}
+interface AttachmentLinkProps extends React.ComponentProps<'a'>, Omit<AttachmentProps, 'containerProps' & 'mimeType' & 'onReady'> {
+    children?: React.ReactNode;
+}
+interface AttachmentImageProps extends React.ComponentProps<'img'>, Omit<AttachmentProps, 'containerProps' & 'mimeType'> {
+}
+interface AttachmentAudioProps extends React.ComponentProps<'audio'>, Omit<AttachmentProps, 'linkProps' & 'mimeType' & 'onReady'> {
+}
+interface AttachmentVideoProps extends React.ComponentProps<'video'>, Omit<AttachmentProps, 'linkProps' & 'mimeType'> {
+    maxSize?: number;
+}
+interface AttachmentFileProps extends LucideProps, Omit<AttachmentProps, 'containerProps' & 'mimeType'> {
+    name?: string | undefined;
+    iconElement?: React.ReactNode;
+}
+interface AttachmentFailedProps extends LucideProps, Omit<AttachmentProps, 'linkProps' & 'mimeType'> {
+    name?: string | undefined;
+    iconElement?: React.ReactNode;
+}
+declare const AttachmentLink: React.ForwardRefExoticComponent<Omit<AttachmentLinkProps, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+declare const AttachmentAudio: React.ForwardRefExoticComponent<Omit<AttachmentAudioProps, "ref"> & React.RefAttributes<HTMLAudioElement>>;
+declare const AttachmentVideo: React.ForwardRefExoticComponent<Omit<AttachmentVideoProps, "ref"> & React.RefAttributes<HTMLVideoElement>>;
+declare const AttachmentImage: React.ForwardRefExoticComponent<Omit<AttachmentImageProps, "ref"> & React.RefAttributes<HTMLImageElement>>;
+declare function AttachmentFile({ url, name, uploading, iconElement, linkProps, ...props }: AttachmentFileProps): import("react/jsx-runtime").JSX.Element;
+declare namespace AttachmentFile {
+    var displayName: string;
+}
+declare function AttachmentFailed({ name, uploading, iconElement, containerProps, ...props }: AttachmentFailedProps): import("react/jsx-runtime").JSX.Element;
+declare namespace AttachmentFailed {
+    var displayName: string;
+}
+declare function AttachmentBase({ mimeType, ...props }: AttachmentProps): import("react/jsx-runtime").JSX.Element;
+declare const Attachment: React.MemoExoticComponent<typeof AttachmentBase>;
+export { Attachment, AttachmentLink, AttachmentImage, AttachmentAudio, AttachmentVideo, AttachmentFile, AttachmentFailed, type AttachmentLinkProps, type AttachmentImageProps, type AttachmentAudioProps, type AttachmentVideoProps, type AttachmentFileProps, type AttachmentFailedProps, type AttachmentProps, };
+//# sourceMappingURL=attachment.d.ts.map

package/dist/types/components/attachment.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"attachment.d.ts","sourceRoot":"","sources":["../../../src/components/attachment.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAqB,KAAK,WAAW,EAAE,MAAM,cAAc,CAAC;AAInE,UAAU,eAAe;IACvB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,SAAS,CAAC,EAAE,mBAAmB,CAAC;IAChC,cAAc,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;CAC9C;AAED,UAAU,mBACR,SAAQ,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,EAC/B,IAAI,CAAC,eAAe,EAAE,gBAAgB,GAAG,UAAU,GAAG,SAAS,CAAC;IAClE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,UAAU,oBACR,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EACjC,IAAI,CAAC,eAAe,EAAE,gBAAgB,GAAG,UAAU,CAAC;CAAG;AAE3D,UAAU,oBACR,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EACnC,IAAI,CAAC,eAAe,EAAE,WAAW,GAAG,UAAU,GAAG,SAAS,CAAC;CAAG;AAElE,UAAU,oBAAqB,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,eAAe,EAAE,WAAW,GAAG,UAAU,CAAC;IACnH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,mBAAoB,SAAQ,WAAW,EAAE,IAAI,CAAC,eAAe,EAAE,gBAAgB,GAAG,UAAU,CAAC;IACrG,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC/B;AAED,UAAU,qBAAsB,SAAQ,WAAW,EAAE,IAAI,CAAC,eAAe,EAAE,WAAW,GAAG,UAAU,CAAC;IAClG,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC/B;AAwBD,QAAA,MAAM,cAAc,4GAAyE,CAAC;AAqB9F,QAAA,MAAM,eAAe,4GAA0E,CAAC;AAmDhG,QAAA,MAAM,eAAe,4GAA0E,CAAC;AAgChG,QAAA,MAAM,eAAe,4GAA0E,CAAC;AAIhG,iBAAS,cAAc,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,SAAiB,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,2CA2B9G;kBA3BQ,cAAc;;;AA+BvB,iBAAS,gBAAgB,CAAC,EACxB,IAAqB,EACrB,SAAiB,EACjB,WAAW,EACX,cAAc,EACd,GAAG,KAAK,EACT,EAAE,qBAAqB,2CAkBvB;kBAxBQ,gBAAgB;;;AA4BzB,iBAAS,cAAc,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CAiB9D;AAED,QAAA,MAAM,UAAU,kDAAuB,CAAC;AAExC,OAAO,EACL,UAAU,EACV,cAAc,EACd,eAAe,EACf,eAAe,EACf,eAAe,EACf,cAAc,EACd,gBAAgB,EAChB,KAAK,mBAAmB,EACxB,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,mBAAmB,EACxB,KAAK,qBAAqB,EAC1B,KAAK,eAAe,GACrB,CAAC"}

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

@@ -2,9 +2,9 @@ import type React from 'react';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import { type PresenceStatus, type PresenceBadgeProps } from './presence';
 interface AvatarProps extends AvatarPrimitive.AvatarProps {
-    src?: string;
-    name?: string;
-    online?: boolean;
+    src?: string | undefined;
+    name?: string | undefined;
+    online?: boolean | undefined;
     presence?: PresenceStatus;
     onlineProps?: React.ComponentProps<'div'>;
     presenceProps?: PresenceBadgeProps;

package/dist/types/components/avatar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../../src/components/avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAiB,KAAK,cAAc,EAAE,KAAK,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAGzF,UAAU,WAAY,SAAQ,eAAe,CAAC,WAAW;IACvD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAC1C,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,UAAU,CAAC,EAAE,eAAe,CAAC,gBAAgB,CAAC;IAC9C,aAAa,CAAC,EAAE,eAAe,CAAC,mBAAmB,CAAC;CACrD;AA+CD,QAAA,MAAM,MAAM,+EAA4D,CAAC;AAIzE,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,CAAC"}
+{"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../../src/components/avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAiB,KAAK,cAAc,EAAE,KAAK,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAGzF,UAAU,WAAY,SAAQ,eAAe,CAAC,WAAW;IACvD,GAAG,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC7B,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAC1C,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,UAAU,CAAC,EAAE,eAAe,CAAC,gBAAgB,CAAC;IAC9C,aAAa,CAAC,EAAE,eAAe,CAAC,mBAAmB,CAAC;CACrD;AAyDD,QAAA,MAAM,MAAM,+EAA4D,CAAC;AAIzE,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,CAAC"}

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

@@ -1,11 +1,11 @@
 import type React from 'react';
 import { type VariantProps } from 'class-variance-authority';
-interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
+interface BadgeProps extends React.HTMLAttributes<HTMLElement>, VariantProps<typeof badgeVariants> {
     asChild?: boolean;
 }
 declare const badgeVariants: (props?: ({
-    variant?: "default" | "destructive" | "outline" | "secondary" | null | undefined;
+    variant?: "default" | "outline" | "secondary" | "destructive" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
-declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLSpanElement>>;
+declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLElement>>;
 export { Badge, type BadgeProps };
 //# sourceMappingURL=badge.d.ts.map

package/dist/types/components/badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../src/components/badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,UAAU,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,YAAY,CAAC,OAAO,aAAa,CAAC;IACnG,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,QAAA,MAAM,aAAa;;mFAgBlB,CAAC;AAWF,QAAA,MAAM,KAAK,oFAAqD,CAAC;AAIjE,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,CAAC"}
+{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../src/components/badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,UAAU,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,YAAY,CAAC,OAAO,aAAa,CAAC;IAChG,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,QAAA,MAAM,aAAa;;mFAgBlB,CAAC;AAWF,QAAA,MAAM,KAAK,gFAAiD,CAAC;AAI7D,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,CAAC"}

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

@@ -4,8 +4,8 @@ interface ButtonProps extends React.ComponentProps<'button'>, VariantProps<typeo
     asChild?: boolean;
 }
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
-    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
+    variant?: "default" | "link" | "outline" | "secondary" | "destructive" | "ghost" | null | undefined;
+    size?: "default" | "icon" | "sm" | "lg" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 declare const Button: React.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 export { Button, type ButtonProps };

package/dist/types/components/dialog-item.d.ts

@@ -0,0 +1,46 @@
+import type React from 'react';
+import { type AvatarProps } from './avatar';
+import { type LucideProps } from 'lucide-react';
+import { type FormattedDateProps } from './formatted-date';
+import { type StatusSentProps } from './status-sent';
+import { type PresenceStatus } from './presence';
+import { type BadgeProps } from './badge';
+interface DialogItemProps extends React.ComponentProps<'div'> {
+    index?: number;
+    isPrivateDialog?: boolean;
+    selected?: boolean;
+    onSelect?: () => void;
+    name: string;
+    photo?: string;
+    userOnline?: boolean;
+    userPresence?: PresenceStatus;
+    hasGroupIcon?: boolean;
+    lastSentStatus?: StatusSentProps['status'];
+    lastSentDate?: FormattedDateProps['date'];
+    lastSenderName?: string;
+    lastMessage?: string;
+    typingStatusText?: string;
+    draft?: string;
+    draftLabel?: string;
+    unreadCount?: number;
+    language?: string;
+    divider?: 'top' | 'bottom' | 'both' | 'none';
+    avatarProps?: AvatarProps;
+    contentProps?: React.ComponentProps<'div'>;
+    headerProps?: React.ComponentProps<'div'>;
+    headerLeftProps?: React.ComponentProps<'div'>;
+    groupIconProps?: LucideProps;
+    nameProps?: React.ComponentProps<'span'>;
+    headerRightProps?: React.ComponentProps<'div'>;
+    statusSentIconProps?: StatusSentProps;
+    formattedDateProps?: FormattedDateProps;
+    footerProps?: React.ComponentProps<'div'>;
+    lastMessageProps?: React.ComponentProps<'span'>;
+    draftLabelProps?: React.ComponentProps<'span'>;
+    lastSenderNameProps?: React.ComponentProps<'span'>;
+    unreadBadgeProps?: BadgeProps;
+    dividerProps?: React.ComponentProps<'div'>;
+}
+declare const DialogItem: React.NamedExoticComponent<Omit<DialogItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { DialogItem, type DialogItemProps };
+//# sourceMappingURL=dialog-item.d.ts.map

package/dist/types/components/dialog-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-item.d.ts","sourceRoot":"","sources":["../../../src/components/dialog-item.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AACpD,OAAO,EAAS,KAAK,WAAW,EAAE,MAAM,cAAc,CAAC;AAEvD,OAAO,EAAiB,KAAK,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAC1E,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,YAAY,CAAC;AAEjD,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAEjD,UAAU,eAAgB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAC3D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,cAAc,CAAC;IAC9B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,cAAc,CAAC,EAAE,eAAe,CAAC,QAAQ,CAAC,CAAC;IAC3C,YAAY,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,CAAC;IAC1C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;IAC7C,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,YAAY,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAC3C,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAC1C,eAAe,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAC9C,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,SAAS,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;IACzC,gBAAgB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAC/C,mBAAmB,CAAC,EAAE,eAAe,CAAC;IACtC,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;IACxC,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAC1C,gBAAgB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;IAChD,eAAe,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;IAC/C,mBAAmB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;IACnD,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAC9B,YAAY,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;CAC5C;AA0ID,QAAA,MAAM,UAAU,gGAAoE,CAAC;AAIrF,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,CAAC"}

package/dist/types/components/file-picker.d.ts

@@ -0,0 +1,22 @@
+import type React from 'react';
+import { LucideProps } from 'lucide-react';
+import { type LabelProps } from './label';
+interface FilePickerInputProps extends React.ComponentProps<'input'> {
+    onSelectFile: (files: File[]) => void;
+    onInvalidFile?: () => void;
+    iconElement?: React.ReactNode;
+    labelProps?: LabelProps;
+    iconProps?: LucideProps;
+}
+interface FilePickerDropzoneProps extends FilePickerInputProps {
+    children?: React.ReactNode;
+    placeholder?: string;
+    dropZoneProps?: React.ComponentProps<'div'>;
+    placeholderContainerProps?: React.ComponentProps<'div'>;
+    iconProps?: LucideProps;
+    placeholderProps?: React.ComponentProps<'span'>;
+}
+declare const FilePickerInput: React.ForwardRefExoticComponent<Omit<FilePickerInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+declare const FilePickerDropzone: React.ForwardRefExoticComponent<Omit<FilePickerDropzoneProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { FilePickerInput, FilePickerDropzone, FilePickerInput as Input, FilePickerDropzone as Dropzone, type FilePickerInputProps, type FilePickerDropzoneProps, };
+//# sourceMappingURL=file-picker.d.ts.map

package/dist/types/components/file-picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-picker.d.ts","sourceRoot":"","sources":["../../../src/components/file-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAkB,WAAW,EAAa,MAAM,cAAc,CAAC;AACtE,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAwDjD,UAAU,oBAAqB,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC;IAClE,YAAY,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IACtC,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,SAAS,CAAC,EAAE,WAAW,CAAC;CACzB;AAED,UAAU,uBAAwB,SAAQ,oBAAoB;IAC5D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAC5C,yBAAyB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IACxD,SAAS,CAAC,EAAE,WAAW,CAAC;IACxB,gBAAgB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;CACjD;AAoDD,QAAA,MAAM,eAAe,4GAA0E,CAAC;AA6FhG,QAAA,MAAM,kBAAkB,6GAA8E,CAAC;AAIvG,OAAO,EACL,eAAe,EACf,kBAAkB,EAClB,eAAe,IAAI,KAAK,EACxB,kBAAkB,IAAI,QAAQ,EAC9B,KAAK,oBAAoB,EACzB,KAAK,uBAAuB,GAC7B,CAAC"}

package/dist/types/components/formatted-date.d.ts

@@ -0,0 +1,8 @@
+interface FormattedDateProps extends React.ComponentProps<'span'> {
+    date?: Date | string | number | null | undefined;
+    language?: string;
+    distanceToNow?: boolean;
+}
+declare const FormattedDate: import("react").NamedExoticComponent<Omit<FormattedDateProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+export { FormattedDate, type FormattedDateProps };
+//# sourceMappingURL=formatted-date.d.ts.map

package/dist/types/components/formatted-date.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"formatted-date.d.ts","sourceRoot":"","sources":["../../../src/components/formatted-date.tsx"],"names":[],"mappings":"AAKA,UAAU,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC;IAC/D,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACjD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AA2CD,QAAA,MAAM,aAAa,wHAA2E,CAAC;AAI/F,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,CAAC"}

package/dist/types/components/input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/components/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,KAAK,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;AAiBhD,QAAA,MAAM,KAAK,8KAAwB,CAAC;AAIpC,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,CAAC"}
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/components/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,KAAK,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;AAiBhD,QAAA,MAAM,KAAK,8KAAsD,CAAC;AAIlE,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,CAAC"}

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

@@ -0,0 +1,5 @@
+import type React from 'react';
+import { type LabelProps } from '@radix-ui/react-label';
+declare const Label: React.ForwardRefExoticComponent<LabelProps & React.RefAttributes<HTMLLabelElement>>;
+export { Label, type LabelProps };
+//# sourceMappingURL=label.d.ts.map

package/dist/types/components/label.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.d.ts","sourceRoot":"","sources":["../../../src/components/label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAqB,KAAK,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAgB3E,QAAA,MAAM,KAAK,qFAAsD,CAAC;AAIlE,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,CAAC"}

package/dist/types/components/link-preview.d.ts

@@ -0,0 +1,21 @@
+import type React from 'react';
+import { type LucideProps } from 'lucide-react';
+interface LinkPreviewProps extends React.ComponentProps<'a'> {
+    thin?: boolean;
+    title?: string;
+    description?: string;
+    icon?: React.ComponentProps<'img'>['src'];
+    image?: React.ComponentProps<'img'>['src'];
+    onReady?: () => void;
+    iconFallbackElement?: React.ReactElement;
+    titleContainerProps?: React.ComponentProps<'div'>;
+    iconProps?: React.ComponentProps<'img'>;
+    iconFallbackProps?: LucideProps;
+    titleProps?: React.ComponentProps<'span'>;
+    descriptionProps?: React.ComponentProps<'div'>;
+    imageContainerProps?: React.ComponentProps<'div'>;
+    imageProps?: React.ComponentProps<'img'>;
+}
+declare const LinkPreview: React.NamedExoticComponent<Omit<LinkPreviewProps, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+export { LinkPreview, type LinkPreviewProps };
+//# sourceMappingURL=link-preview.d.ts.map

package/dist/types/components/link-preview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-preview.d.ts","sourceRoot":"","sources":["../../../src/components/link-preview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAS,KAAK,WAAW,EAAE,MAAM,cAAc,CAAC;AAevD,UAAU,gBAAiB,SAAQ,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC;IAC1D,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC;IAC1C,KAAK,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC;IAC3C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,mBAAmB,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IACzC,mBAAmB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAClD,SAAS,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IACxC,iBAAiB,CAAC,EAAE,WAAW,CAAC;IAChC,UAAU,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;IAC1C,gBAAgB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAC/C,mBAAmB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAClD,UAAU,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;CAC1C;AAgHD,QAAA,MAAM,WAAW,oGAAyE,CAAC;AAI3F,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,CAAC"}

package/dist/types/components/linkify-text.d.ts

@@ -0,0 +1,9 @@
+import type React from 'react';
+import type { Opts } from 'linkifyjs';
+interface LinkifyTextProps extends React.ComponentProps<'p'> {
+    text: string;
+    linkifyProps?: Opts;
+}
+declare const LinkifyText: React.NamedExoticComponent<Omit<LinkifyTextProps, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+export { LinkifyText, type LinkifyTextProps };
+//# sourceMappingURL=linkify-text.d.ts.map

package/dist/types/components/linkify-text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"linkify-text.d.ts","sourceRoot":"","sources":["../../../src/components/linkify-text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAUtC,UAAU,gBAAiB,SAAQ,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC;IAC1D,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,CAAC,EAAE,IAAI,CAAC;CACrB;AAsBD,QAAA,MAAM,WAAW,uGAA4E,CAAC;AAI9F,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,CAAC"}

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

@@ -1,8 +1,10 @@
 import { type LucideProps } from 'lucide-react';
 interface SpinnerProps extends LucideProps {
     loading?: boolean;
+    type?: 'default' | 'circle';
+    layout?: 'absolute' | 'centered' | 'overlay' | 'flow';
 }
-declare function Spinner({ loading, ...props }: SpinnerProps): import("react/jsx-runtime").JSX.Element | null;
+declare function Spinner({ loading, layout, type, ...props }: SpinnerProps): import("react/jsx-runtime").JSX.Element | null;
 declare namespace Spinner {
     var displayName: string;
 }

package/dist/types/components/spinner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../src/components/spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgB,KAAK,WAAW,EAAE,MAAM,cAAc,CAAC;AAG9D,UAAU,YAAa,SAAQ,WAAW;IACxC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,iBAAS,OAAO,CAAC,EAAE,OAAc,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,kDAI1D;kBAJQ,OAAO;;;AAQhB,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,CAAC"}
+{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../src/components/spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwB,KAAK,WAAW,EAAE,MAAM,cAAc,CAAC;AAGtE,UAAU,YAAa,SAAQ,WAAW;IACxC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,MAAM,CAAC,EAAE,UAAU,GAAG,UAAU,GAAG,SAAS,GAAG,MAAM,CAAC;CACvD;AAED,iBAAS,OAAO,CAAC,EAAE,OAAe,EAAE,MAAe,EAAE,IAAgB,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,kDA4B9F;kBA5BQ,OAAO;;;AAgChB,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,CAAC"}

package/dist/types/components/status-sent.d.ts

@@ -0,0 +1,7 @@
+import { type LucideProps } from 'lucide-react';
+interface StatusSentProps extends LucideProps {
+    status?: 'wait' | 'sent' | 'read' | 'lost' | null | undefined;
+}
+declare const StatusSent: React.FC<StatusSentProps>;
+export { StatusSent, type StatusSentProps };
+//# sourceMappingURL=status-sent.d.ts.map

package/dist/types/components/status-sent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-sent.d.ts","sourceRoot":"","sources":["../../../src/components/status-sent.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiC,KAAK,WAAW,EAAE,MAAM,cAAc,CAAC;AAG/E,UAAU,eAAgB,SAAQ,WAAW;IAC3C,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;CAC/D;AAED,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAazC,CAAC;AAIF,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,CAAC"}

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

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import * as SwitchPrimitive from '@radix-ui/react-switch';
+type SwitchProps = React.ComponentProps<typeof SwitchPrimitive.Root>;
+declare function Switch(props: SwitchProps): import("react/jsx-runtime").JSX.Element;
+export { Switch, type SwitchProps };
+//# sourceMappingURL=switch.d.ts.map

package/dist/types/components/switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../src/components/switch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAG1D,KAAK,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,CAAC;AAErE,iBAAS,MAAM,CAAC,KAAK,EAAE,WAAW,2CAgBjC;AAED,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,CAAC"}

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

@@ -1,6 +1,5 @@
 import { type ClassValue } from 'clsx';
 export declare function cn(...inputs: ClassValue[]): string;
 export declare function getRandomString(length?: number): string;
-export declare function getInitialsFromName(name?: string): string;
 export declare function capitalize(str?: string): string;
 //# sourceMappingURL=utils.d.ts.map

package/dist/types/components/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,UAAU,EAAE,MAAM,MAAM,CAAC;AAG7C,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC;AAED,wBAAgB,eAAe,CAAC,MAAM,SAAI,GAAG,MAAM,CAElD;AAED,wBAAgB,mBAAmB,CAAC,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAKzD;AAED,wBAAgB,UAAU,CAAC,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAE/C"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,UAAU,EAAE,MAAM,MAAM,CAAC;AAG7C,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC;AAED,wBAAgB,eAAe,CAAC,MAAM,SAAI,GAAG,MAAM,CAElD;AAED,wBAAgB,UAAU,CAAC,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAE/C"}

package/dist/types/index.d.ts

@@ -1,5 +1,22 @@
-export { DismissLayer } from './components/dismiss-layer';
-export type { DismissLayerProps } from './components/dismiss-layer';
-export { StreamView, LocalStreamView, RemoteStreamView, FullscreenStreamView } from './components/stream-view';
-export type { StreamViewProps, FullscreenStreamViewProps, FullscreenStreamViewRef } from './components/stream-view';
+export { Attachment, AttachmentLink, AttachmentImage, AttachmentAudio, AttachmentVideo, AttachmentFile, AttachmentFailed, type AttachmentProps, type AttachmentLinkProps, type AttachmentImageProps, type AttachmentAudioProps, type AttachmentVideoProps, type AttachmentFileProps, type AttachmentFailedProps, } from './components/attachment';
+export { Avatar, type AvatarProps } from './components/avatar';
+export { Badge, type BadgeProps } from './components/badge';
+export { Button, type ButtonProps } from './components/button';
+export { DialogItem, type DialogItemProps } from './components/dialog-item';
+export { DismissLayer, type DismissLayerProps } from './components/dismiss-layer';
+export { FilePickerInput, FilePickerDropzone, type FilePickerInputProps, type FilePickerDropzoneProps, } from './components/file-picker';
+export { FormattedDate, type FormattedDateProps } from './components/formatted-date';
+export { Input, type InputProps } from './components/input';
+export { Label, type LabelProps } from './components/label';
+export { LinkPreview, type LinkPreviewProps } from './components/link-preview';
+export { LinkifyText, type LinkifyTextProps } from './components/linkify-text';
+export { PlaceholderText, type PlaceholderTextProps } from './components/placeholder-text';
+export { Presence, PresenceBadge, type PresenceStatus, type PresenceProps, type PresenceBadgeProps, } from './components/presence';
+export { Search, type SearchProps } from './components/search';
+export { Spinner, type SpinnerProps } from './components/spinner';
+export { StatusIndicator, type StatusName, type StatusIndicatorProps } from './components/status-indicator';
+export { StatusSent, type StatusSentProps } from './components/status-sent';
+export { StreamView, LocalStreamView, RemoteStreamView, FullscreenStreamView, type StreamViewProps, type FullscreenStreamViewProps, type FullscreenStreamViewRef, } from './components/stream-view';
+export { Switch, type SwitchProps } from './components/switch';
+export * from './components/utils';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,YAAY,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAEpE,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAE/G,YAAY,EAAE,eAAe,EAAE,yBAAyB,EAAE,uBAAuB,EAAE,MAAM,0BAA0B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,cAAc,EACd,eAAe,EACf,eAAe,EACf,eAAe,EACf,cAAc,EACd,gBAAgB,EAChB,KAAK,eAAe,EACpB,KAAK,mBAAmB,EACxB,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,mBAAmB,EACxB,KAAK,qBAAqB,GAC3B,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAE/D,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAE/D,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAE5E,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAElF,OAAO,EACL,eAAe,EACf,kBAAkB,EAClB,KAAK,oBAAoB,EACzB,KAAK,uBAAuB,GAC7B,MAAM,0BAA0B,CAAC;AAElC,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAErF,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAE5D,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAE5D,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAE/E,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAE/E,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AAE3F,OAAO,EACL,QAAQ,EACR,aAAa,EACb,KAAK,cAAc,EACnB,KAAK,aAAa,EAClB,KAAK,kBAAkB,GACxB,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAE/D,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAElE,OAAO,EAAE,eAAe,EAAE,KAAK,UAAU,EAAE,KAAK,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AAE5G,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAE5E,OAAO,EACL,UAAU,EACV,eAAe,EACf,gBAAgB,EAChB,oBAAoB,EACpB,KAAK,eAAe,EACpB,KAAK,yBAAyB,EAC9B,KAAK,uBAAuB,GAC7B,MAAM,0BAA0B,CAAC;AAElC,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAE/D,cAAc,oBAAoB,CAAC"}

package/gen/components/attachment.jsx

@@ -0,0 +1,214 @@
+import { forwardRef, memo, useImperativeHandle, useRef, useState } from 'react';
+import { File, FileXCorner } from 'lucide-react';
+import { Spinner } from './spinner';
+import { cn, getRandomString } from './utils';
+
+function AttachmentLinkBase({ url, uploading = false, children, ...props }, ref) {
+  return (
+    <a
+      ref={ref}
+      target="_blank"
+      rel="noopener noreferrer"
+      {...props}
+      href={url}
+      className={cn(
+        'group relative min-h-12 min-w-12 w-full flex items-center justify-center rounded-md overflow-hidden bg-ring/10 hover:bg-ring/20 transition-color duration-300 ease-out cursor-pointer',
+        props?.className
+      )}
+    >
+      {children}
+      <Spinner loading={uploading} layout="overlay" />
+    </a>
+  );
+}
+
+const AttachmentLink = forwardRef(AttachmentLinkBase);
+
+AttachmentLink.displayName = 'AttachmentLink';
+
+function AttachmentAudioBase({ uid, url, uploading = false, containerProps, ...props }, ref) {
+  const audioId = `attachment_audio_${uid || getRandomString()}`;
+
+  return (
+    <div
+      {...containerProps}
+      className={cn('relative min-h-12 min-w-12 w-full rounded-md overflow-hidden', containerProps?.className)}
+    >
+      <audio ref={ref} src={url} id={audioId} controls {...props} />
+      <Spinner loading={uploading} layout="overlay" />
+    </div>
+  );
+}
+
+const AttachmentAudio = forwardRef(AttachmentAudioBase);
+
+function AttachmentVideoBase(
+  { uid, url, maxSize = 360, uploading = false, onReady = () => {}, containerProps, ...props },
+  ref
+) {
+  const videoId = `attachment_video_${uid || getRandomString()}`;
+  const videoMaxSize = `${maxSize}px`;
+  const playerRef = useRef(null);
+  const [style, setStyle] = useState({
+    maxHeight: videoMaxSize,
+    maxWidth: videoMaxSize,
+  });
+  const handleCanPlay = (event) => {
+    const player = playerRef.current;
+
+    if (player) {
+      const { videoWidth, videoHeight } = player;
+      const ratio = videoWidth / videoHeight || 1;
+      const height = ratio < 1 ? videoMaxSize : `${Math.round(maxSize / ratio)}px`;
+      const width = ratio < 1 ? `${Math.round(maxSize * ratio)}px` : videoMaxSize;
+
+      setStyle({
+        height,
+        width,
+        maxHeight: height,
+        maxWidth: width,
+      });
+      props.onCanPlay?.(event);
+      onReady();
+    }
+  };
+
+  useImperativeHandle(ref, () => playerRef.current, []);
+
+  return (
+    <div
+      {...containerProps}
+      className={cn('relative min-h-20 w-full rounded-md overflow-hidden', containerProps?.className)}
+    >
+      <video
+        id={videoId}
+        ref={playerRef}
+        src={url}
+        controls
+        preload="metadata"
+        style={style}
+        {...props}
+        onCanPlay={handleCanPlay}
+        className={cn('size-full', props?.className)}
+      />
+      <Spinner loading={uploading} layout="overlay" />
+    </div>
+  );
+}
+
+const AttachmentVideo = forwardRef(AttachmentVideoBase);
+
+AttachmentVideo.displayName = 'AttachmentVideo';
+
+function AttachmentImageBase({ uid, url, uploading = false, onReady = () => {}, linkProps, ...props }, ref) {
+  const imageId = `attachment_image_${uid || getRandomString()}`;
+  const handleLoad = (event) => {
+    props.onLoad?.(event);
+    onReady();
+  };
+
+  return (
+    <AttachmentLink href={url} uploading={uploading} {...linkProps}>
+      <img
+        ref={ref}
+        src={url}
+        id={imageId}
+        alt="attachment"
+        {...props}
+        className={cn(
+          'rounded-md object-cover min-h-12 min-w-12 max-h-[360px] group-hover:scale-103 transition-transform duration-300 ease-out',
+          props?.className
+        )}
+        onLoad={handleLoad}
+      />
+    </AttachmentLink>
+  );
+}
+
+const AttachmentImage = forwardRef(AttachmentImageBase);
+
+AttachmentImage.displayName = 'AttachmentImage';
+
+function AttachmentFile({ url, name, uploading = false, iconElement, linkProps, ...props }) {
+  const fileId = `attachment_file_${props.id || getRandomString()}`;
+
+  return (
+    <AttachmentLink
+      href={url}
+      uploading={uploading}
+      {...linkProps}
+      className={cn('flex-row gap-2 px-2', linkProps?.className)}
+    >
+      {iconElement || (
+        <File
+          id={fileId}
+          {...props}
+          className={cn(
+            'size-6 shrink-0 text-foreground/85 group-hover:text-foreground duration-300 ease-out',
+            props?.className
+          )}
+        />
+      )}
+      {name && (
+        <span className="font-medium line-clamp-1 break-all text-foreground/85 group-hover:text-foreground duration-300 ease-out">
+          {name}
+        </span>
+      )}
+    </AttachmentLink>
+  );
+}
+
+AttachmentFile.displayName = 'AttachmentFile';
+
+function AttachmentFailed({ name = 'Unknown file', uploading = false, iconElement, containerProps, ...props }) {
+  const failedId = `attachment_failed_${props.id || getRandomString()}`;
+
+  return (
+    <div
+      {...containerProps}
+      className={cn(
+        'relative min-h-12 min-w-12 w-full flex flex-row items-center justify-center gap-2 px-2 bg-red-600/10 rounded-md overflow-hidden',
+        containerProps?.className
+      )}
+    >
+      {iconElement || (
+        <FileXCorner id={failedId} {...props} className={cn('size-6 shrink-0 text-red-600', props?.className)} />
+      )}
+      <span className="font-medium line-clamp-1 break-all text-red-600">{name}</span>
+      <Spinner loading={uploading} layout="overlay" />
+    </div>
+  );
+}
+
+AttachmentFailed.displayName = 'AttachmentFailed';
+
+function AttachmentBase({ mimeType, ...props }) {
+  const [type = ''] = mimeType?.split('/') || [];
+
+  if (!props.url) {
+    return <AttachmentFailed {...props} />;
+  }
+
+  switch (type) {
+    case 'image':
+      return <AttachmentImage {...props} />;
+    case 'video':
+      return <AttachmentVideo {...props} />;
+    case 'audio':
+      return <AttachmentAudio {...props} />;
+    default:
+      return <AttachmentFile name={mimeType} {...props} />;
+  }
+}
+
+const Attachment = memo(AttachmentBase);
+
+export {
+  Attachment,
+  AttachmentLink,
+  AttachmentImage,
+  AttachmentAudio,
+  AttachmentVideo,
+  AttachmentFile,
+  AttachmentFailed,
+};

package/gen/components/avatar.jsx

@@ -1,7 +1,14 @@
 import { memo, forwardRef } from 'react';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import { PresenceBadge } from './presence';
-import { cn, getInitialsFromName } from './utils';
+import { cn } from './utils';
+
+function getInitialsFromName(name) {
+  const words = name?.trim().split(/\s+/).filter(Boolean) ?? [];
+  const result = words.length > 1 ? `${words[0]?.[0]}${words[1]?.[0]}` : (words[0]?.slice(0, 2) ?? 'NA');
+
+  return result.toUpperCase();
+}
 
 function AvatarBase(
   { src, name = 'NA', online, presence, className, onlineProps, presenceProps, imageProps, fallbackProps, ...props },
@@ -25,13 +32,16 @@ function AvatarBase(
       {online && (
         <div
           {...onlineProps}
-          className={cn('rounded-full border-2 bg-green-600 border-green-200 size-3.5', onlineProps?.className)}
+          className={cn(
+            'absolute top-0 right-0 rounded-full border-2 bg-green-600 border-green-200 size-3.5',
+            onlineProps?.className
+          )}
         />
       )}
       <PresenceBadge
         status={presence}
         {...presenceProps}
-        className={cn('absolute -bottom-0.5 -right-1', presenceProps?.className)}
+        className={cn('absolute bottom-0 right-0', presenceProps?.className)}
       />
     </AvatarPrimitive.Root>
   );

package/gen/components/badge.jsx

@@ -1,5 +1,5 @@
 import { forwardRef } from 'react';
-import * as SlotPrimitive from '@radix-ui/react-slot';
+import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
 import { cn } from './utils';
 
@@ -22,18 +22,18 @@ const badgeVariants = cva(
 );
 
 function BadgeBase({ className, variant, asChild = false, ...props }, ref) {
-  const Comp = asChild ? SlotPrimitive.Root : 'span';
+  const Comp = asChild ? Slot : 'span';
 
   return (
     <Comp
       ref={ref}
+      {...props}
       className={cn(
         badgeVariants({
           variant,
         }),
         className
       )}
-      {...props}
     />
   );
 }