@solidstarters/solid-core-ui 1.1.69 → 1.1.71

package/dist/components/core/chatter/SolidChatterHeader.d.ts

@@ -0,0 +1,17 @@
+interface FilterState {
+    name: string;
+    startDate: Date | null;
+    endDate: Date | null;
+}
+interface Props {
+    activeTab: any;
+    handleTabClick: any;
+    visibleBox: any;
+    solidFormViewMetaData: any;
+    refetch: any;
+    id: any;
+    onFilterChange?: (filters: FilterState) => void;
+}
+export declare const SolidChatterHeader: (props: Props) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=SolidChatterHeader.d.ts.map

package/dist/components/core/chatter/SolidChatterHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidChatterHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/core/chatter/SolidChatterHeader.tsx"],"names":[],"mappings":"AAOA,UAAU,WAAW;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,IAAI,GAAG,IAAI,CAAC;IACvB,OAAO,EAAE,IAAI,GAAG,IAAI,CAAC;CACxB;AAED,UAAU,KAAK;IACX,SAAS,EAAE,GAAG,CAAC;IACf,cAAc,EAAE,GAAG,CAAC;IACpB,UAAU,EAAE,GAAG,CAAC;IAChB,qBAAqB,EAAE,GAAG,CAAC;IAC3B,OAAO,EAAE,GAAG,CAAC;IACb,EAAE,EAAE,GAAG,CAAC;IACR,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,IAAI,CAAC;CACnD;AAED,eAAO,MAAM,kBAAkB,UAAW,KAAK,4CA0J9C,CAAA"}

package/dist/components/core/chatter/SolidChatterHeader.js

@@ -0,0 +1,67 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from 'react';
+import { SolidMessageComposer } from './SolidMessageComposer';
+import { Button } from 'primereact/button';
+import { Dialog } from 'primereact/dialog';
+import { Calendar } from 'primereact/calendar';
+import styles from './chatter.module.css';
+export var SolidChatterHeader = function (props) {
+    var activeTab = props.activeTab, visibleBox = props.visibleBox, handleTabClick = props.handleTabClick, solidFormViewMetaData = props.solidFormViewMetaData, refetch = props.refetch, id = props.id, onFilterChange = props.onFilterChange;
+    var _a = useState(false), showFilterDialog = _a[0], setShowFilterDialog = _a[1];
+    var _b = useState({
+        name: '',
+        startDate: null,
+        endDate: null
+    }), filters = _b[0], setFilters = _b[1];
+    var _c = useState(false), hasActiveFilters = _c[0], setHasActiveFilters = _c[1];
+    useEffect(function () {
+        var isActive = filters.name !== '' || filters.startDate !== null || filters.endDate !== null;
+        setHasActiveFilters(isActive);
+    }, [filters]);
+    var handleFilterClick = function () {
+        setShowFilterDialog(true);
+    };
+    var handleApplyFilters = function () {
+        if (onFilterChange) {
+            onFilterChange(filters);
+        }
+        setShowFilterDialog(false);
+    };
+    var handleClearFilters = function () {
+        var clearedFilters = {
+            name: '',
+            startDate: null,
+            endDate: null
+        };
+        setFilters(clearedFilters);
+        if (onFilterChange) {
+            onFilterChange(clearedFilters);
+        }
+        setShowFilterDialog(false);
+    };
+    return (_jsxs("div", { className: styles.chatterTitle, children: [_jsxs("div", { className: 'flex justify-content-between align-items-center', children: [_jsx("div", { className: "form-wrapper-title", children: "Activity" }), _jsxs("div", { className: 'flex align-items-center gap-2', children: [_jsx(Button, __assign({ label: "Send Message", size: "small", type: "button", onClick: function () { return handleTabClick('email-message'); } }, (activeTab !== 'email-message' && {
+                                severity: 'secondary',
+                                outlined: true,
+                            }))), _jsx(Button, __assign({ label: "Log Note", size: "small", type: "button", onClick: function () { return handleTabClick('log'); } }, (activeTab !== 'log' && {
+                                severity: 'secondary',
+                                outlined: true,
+                            }))), _jsx(Button, { icon: "pi pi-filter-fill", text: true, size: 'small', severity: "secondary", "aria-label": "Filter", style: {
+                                    width: 20,
+                                    color: hasActiveFilters ? '#722ED1' : undefined
+                                }, onClick: handleFilterClick })] })] }), visibleBox &&
+                _jsxs("div", { className: 'mt-4', children: [visibleBox === "email-message" &&
+                            _jsx(SolidMessageComposer, { id: id, refetch: refetch, solidFormViewMetaData: solidFormViewMetaData, type: "email" }), visibleBox === "log" &&
+                            _jsx(SolidMessageComposer, { id: id, refetch: refetch, solidFormViewMetaData: solidFormViewMetaData })] }), _jsx(Dialog, { header: "Filter Messages", visible: showFilterDialog, style: { width: 500 }, onHide: function () { return setShowFilterDialog(false); }, children: _jsxs("div", { className: "p-fluid", children: [_jsxs("div", { className: "flex flex-column gap-2", children: [_jsx("label", { htmlFor: "name", children: "Name:" }), _jsx("input", { type: "text", id: "name", name: "name", placeholder: "Filter By User", className: "p-inputtext p-inputtext-sm p-component", value: filters.name, onChange: function (e) { return setFilters(function (prev) { return (__assign(__assign({}, prev), { name: e.target.value })); }); } })] }), _jsxs("div", { className: "flex flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "dateRange", children: "Date Range" }), _jsxs("div", { className: "flex gap-2", children: [_jsx("div", { className: "flex-1", children: _jsx(Calendar, { id: "startDate", value: filters.startDate, onChange: function (e) { return setFilters(function (prev) { return (__assign(__assign({}, prev), { startDate: e.value })); }); }, placeholder: "Start Date", showIcon: true, dateFormat: "dd/mm/yy", className: "w-full" }) }), _jsx("div", { className: "flex-1", children: _jsx(Calendar, { id: "endDate", value: filters.endDate, onChange: function (e) { return setFilters(function (prev) { return (__assign(__assign({}, prev), { endDate: e.value })); }); }, placeholder: "End Date", showIcon: true, dateFormat: "dd/mm/yy", className: "w-full" }) })] })] }), _jsxs("div", { className: "flex justify-content-end gap-2 mt-4", children: [_jsx(Button, { label: "Clear", severity: "secondary", outlined: true, onClick: handleClearFilters }), _jsx(Button, { label: "Apply", onClick: handleApplyFilters })] })] }) })] }));
+};
+//# sourceMappingURL=SolidChatterHeader.js.map

package/dist/components/core/chatter/SolidChatterHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidChatterHeader.js","sourceRoot":"","sources":["../../../../src/components/core/chatter/SolidChatterHeader.tsx"],"names":[],"mappings":"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"}

package/dist/components/core/chatter/SolidChatterHeader.tsx

@@ -0,0 +1,178 @@
+import React, { useState, useEffect } from 'react'
+import { SolidMessageComposer } from './SolidMessageComposer'
+import { Button } from 'primereact/button'
+import { Dialog } from 'primereact/dialog'
+import { Calendar } from 'primereact/calendar'
+import styles from './chatter.module.css'
+
+interface FilterState {
+    name: string;
+    startDate: Date | null;
+    endDate: Date | null;
+}
+
+interface Props {
+    activeTab: any,
+    handleTabClick: any,
+    visibleBox: any,
+    solidFormViewMetaData: any,
+    refetch: any,
+    id: any,
+    onFilterChange?: (filters: FilterState) => void;
+}
+
+export const SolidChatterHeader = (props: Props) => {
+    const { activeTab, visibleBox, handleTabClick, solidFormViewMetaData, refetch, id, onFilterChange } = props;
+    const [showFilterDialog, setShowFilterDialog] = useState(false);
+    const [filters, setFilters] = useState<FilterState>({
+        name: '',
+        startDate: null,
+        endDate: null
+    });
+    const [hasActiveFilters, setHasActiveFilters] = useState(false);
+
+    useEffect(() => {
+        const isActive = filters.name !== '' || filters.startDate !== null || filters.endDate !== null;
+        setHasActiveFilters(isActive);
+    }, [filters]);
+
+    const handleFilterClick = () => {
+        setShowFilterDialog(true);
+    };
+
+    const handleApplyFilters = () => {
+        if (onFilterChange) {
+            onFilterChange(filters);
+        }
+        setShowFilterDialog(false);
+    };
+
+    const handleClearFilters = () => {
+        const clearedFilters = {
+            name: '',
+            startDate: null,
+            endDate: null
+        };
+        setFilters(clearedFilters);
+        if (onFilterChange) {
+            onFilterChange(clearedFilters);
+        }
+        setShowFilterDialog(false);
+    };
+
+    return (
+        <div className={styles.chatterTitle}>
+            <div className='flex justify-content-between align-items-center'>
+                <div className="form-wrapper-title">
+                    Activity
+                </div>
+                <div className='flex align-items-center gap-2'>
+                    <Button
+                        label="Send Message"
+                        size="small"
+                        type="button"
+                        onClick={() => handleTabClick('email-message')}
+                        {...(activeTab !== 'email-message' && {
+                            severity: 'secondary',
+                            outlined: true,
+                        })}
+                    />
+                    <Button
+                        label="Log Note"
+                        size="small"
+                        type="button"
+                        onClick={() => handleTabClick('log')}
+                        {...(activeTab !== 'log' && {
+                            severity: 'secondary',
+                            outlined: true,
+                        }
+                        )}
+                    />
+                    <Button
+                        icon="pi pi-filter-fill"
+                        text
+                        size='small'
+                        severity="secondary"
+                        aria-label="Filter"
+                        style={{ 
+                            width: 20,
+                            color: hasActiveFilters ? '#722ED1' : undefined
+                        }}
+                        onClick={handleFilterClick}
+                    />
+                </div>
+            </div>
+            {visibleBox &&
+                <div className='mt-4'>
+                    {visibleBox === "email-message" &&
+                        <SolidMessageComposer id={id} refetch={refetch} solidFormViewMetaData={solidFormViewMetaData} type={"email"} />
+                    }
+
+                    {visibleBox === "log" &&
+                        <SolidMessageComposer id={id} refetch={refetch} solidFormViewMetaData={solidFormViewMetaData} />
+                    }
+                </div>
+            }
+            <Dialog 
+                header="Filter Messages" 
+                visible={showFilterDialog} 
+                style={{ width: 500 }} 
+                onHide={() => setShowFilterDialog(false)}
+            >
+                <div className="p-fluid">
+                    <div className="flex flex-column gap-2">
+                        <label htmlFor="name">Name:</label>
+                        <input
+                            type="text"
+                            id="name"
+                            name="name"
+                            placeholder="Filter By User"
+                            className="p-inputtext p-inputtext-sm p-component"
+                            value={filters.name}
+                            onChange={(e) => setFilters(prev => ({ ...prev, name: e.target.value }))}
+                        />
+                    </div>
+                    <div className="flex flex-column gap-2 mt-3">
+                        <label htmlFor="dateRange">Date Range</label>
+                        <div className="flex gap-2">
+                            <div className="flex-1">
+                                <Calendar
+                                    id="startDate"
+                                    value={filters.startDate}
+                                    onChange={(e) => setFilters(prev => ({ ...prev, startDate: e.value as Date }))}
+                                    placeholder="Start Date"
+                                    showIcon
+                                    dateFormat="dd/mm/yy"
+                                    className="w-full"
+                                />
+                            </div>
+                            <div className="flex-1">
+                                <Calendar
+                                    id="endDate"
+                                    value={filters.endDate}
+                                    onChange={(e) => setFilters(prev => ({ ...prev, endDate: e.value as Date }))}
+                                    placeholder="End Date"
+                                    showIcon
+                                    dateFormat="dd/mm/yy"
+                                    className="w-full"
+                                />
+                            </div>
+                        </div>
+                    </div>
+                    <div className="flex justify-content-end gap-2 mt-4">
+                        <Button 
+                            label="Clear" 
+                            severity="secondary" 
+                            outlined 
+                            onClick={handleClearFilters}
+                        />
+                        <Button 
+                            label="Apply" 
+                            onClick={handleApplyFilters}
+                        />
+                    </div>
+                </div>
+            </Dialog>
+        </div>
+    )
+}

package/dist/components/core/chatter/SolidChatterMessageBox.d.ts

@@ -0,0 +1,19 @@
+interface Props {
+    user: string;
+    auditType?: string;
+    message?: any;
+    time?: string;
+    auditRecord?: any;
+    media?: {
+        messageAttachments?: Array<{
+            id: number;
+            relativeUri: string;
+            mimeType: string;
+            originalFileName: string;
+            _full_url: string;
+        }>;
+    };
+}
+export declare const SolidChatterMessageBox: (props: Props) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=SolidChatterMessageBox.d.ts.map

package/dist/components/core/chatter/SolidChatterMessageBox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidChatterMessageBox.d.ts","sourceRoot":"","sources":["../../../../src/components/core/chatter/SolidChatterMessageBox.tsx"],"names":[],"mappings":"AAQA,UAAU,KAAK;IACX,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,GAAG,CAAC;IAClB,KAAK,CAAC,EAAE;QACJ,kBAAkB,CAAC,EAAE,KAAK,CAAC;YACvB,EAAE,EAAE,MAAM,CAAC;YACX,WAAW,EAAE,MAAM,CAAC;YACpB,QAAQ,EAAE,MAAM,CAAC;YACjB,gBAAgB,EAAE,MAAM,CAAC;YACzB,SAAS,EAAE,MAAM,CAAC;SACrB,CAAC,CAAC;KACN,CAAC;CACL;AAsBD,eAAO,MAAM,sBAAsB,UAAW,KAAK,4CAuHlD,CAAA"}

package/dist/components/core/chatter/SolidChatterMessageBox.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from 'react';
+import styles from './chatter.module.css';
+import { Avatar } from 'primereact/avatar';
+import { stringToColor, getTextColor } from '../../../helpers/getRandomColors';
+import { RightArrowSvg } from '../../../components/Svg/RightArrowSvg';
+import { Dialog } from 'primereact/dialog';
+import Image from 'next/image';
+var getFileIcon = function (mimeType) {
+    if (mimeType.startsWith('image/')) {
+        return 'pi pi-image';
+    }
+    switch (mimeType) {
+        case 'application/pdf':
+            return 'pi pi-file-pdf';
+        case 'application/vnd.ms-excel':
+        case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet':
+            return 'pi pi-file-excel';
+        case 'application/msword':
+        case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document':
+            return 'pi pi-file-word';
+        case 'text/plain':
+            return 'pi pi-file';
+        default:
+            return 'pi pi-file';
+    }
+};
+export var SolidChatterMessageBox = function (props) {
+    var user = props.user, auditType = props.auditType, message = props.message, time = props.time, auditRecord = props.auditRecord, media = props.media;
+    var _a = useState(null), selectedImage = _a[0], setSelectedImage = _a[1];
+    var _b = useState(false), isImageDialogVisible = _b[0], setIsImageDialogVisible = _b[1];
+    var avatarStyle = useMemo(function () {
+        var bg = stringToColor(user);
+        var color = getTextColor(bg);
+        return { backgroundColor: bg, color: color, height: 24, width: 24, fontSize: 10, fontWeight: 600 };
+    }, [user]);
+    var handleImageClick = function (url) {
+        setSelectedImage(url);
+        setIsImageDialogVisible(true);
+    };
+    return (_jsxs("div", { className: styles.solidChatterMessageBox, children: [_jsxs("div", { className: 'flex align-items-center', children: [_jsx("div", { style: { width: 32 }, children: _jsx(Avatar, { label: user.charAt(0).toUpperCase(), style: avatarStyle, shape: "circle" }) }), _jsxs("div", { className: 'flex align-items-center justify-content-between', style: { width: '100%' }, children: [_jsxs("div", { className: 'text-sm', children: [_jsx("span", { className: 'font-bold', children: user }), _jsx("span", { className: 'ml-2', style: { color: '#949494' }, children: auditType === "fieldChange" ? 'Fields changed' : 'Sent message' })] }), _jsx("i", { className: 'pi pi-ellipsis-v text-xs' })] })] }), _jsxs("div", { className: 'flex align-items-center mt-1', children: [_jsx("div", { style: { width: 32 } }), _jsxs("div", { style: { width: '100%' }, children: [_jsx("p", { className: 'mb-1 text-sm font-bold', style: { color: '#949494' }, children: time }), _jsx("div", { className: styles.solidMessageWrapper, children: auditType === "audit" ? (_jsx("div", { className: 'flex flex-column gap-2', children: auditRecord.map(function (item, index) { return (_jsxs("div", { className: 'flex gap-2', children: [_jsx("span", { className: 'm-0 text-sm', children: "(" + item.field + ")" }), _jsx("span", { className: 'm-0 text-sm font-bold', children: item.previous }), _jsx(RightArrowSvg, {}), _jsx("span", { className: 'm-0 text-sm font-bold text-primary', children: item.current })] }, index)); }) })) : (_jsx("p", { className: 'm-0 text-sm', children: message })) }), (media === null || media === void 0 ? void 0 : media.messageAttachments) && media.messageAttachments.length > 0 && (_jsx("div", { className: 'flex flex-wrap gap-2 mt-2', children: media.messageAttachments.map(function (attachment) {
+                                    var isImage = attachment.mimeType.startsWith('image/');
+                                    return (_jsx("div", { className: 'flex align-items-center gap-2 bg-gray-100 p-2 rounded', children: isImage ? (_jsx("div", { className: 'cursor-pointer', onClick: function () { return handleImageClick(attachment._full_url); }, children: _jsx(Image, { src: encodeURI(attachment._full_url), alt: attachment.originalFileName, width: 50, height: 50, className: 'rounded', style: { objectFit: 'cover' } }) })) : (_jsxs("a", { href: encodeURI(attachment._full_url), target: "_blank", rel: "noopener noreferrer", className: 'flex align-items-center gap-2 text-decoration-none', children: [_jsx("i", { className: getFileIcon(attachment.mimeType) }), _jsx("span", { className: 'text-sm', children: attachment.originalFileName })] })) }, attachment.id));
+                                }) }))] })] }), _jsx(Dialog, { visible: isImageDialogVisible, onHide: function () { return setIsImageDialogVisible(false); }, className: 'w-9', modal: true, children: selectedImage && (_jsx(Image, { src: selectedImage, alt: "Preview", width: 800, height: 600, style: { width: '100%', height: 'auto' } })) })] }));
+};
+//# sourceMappingURL=SolidChatterMessageBox.js.map

package/dist/components/core/chatter/SolidChatterMessageBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidChatterMessageBox.js","sourceRoot":"","sources":["../../../../src/components/core/chatter/SolidChatterMessageBox.tsx"],"names":[],"mappings":"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"}

package/dist/components/core/chatter/SolidChatterMessageBox.tsx

@@ -0,0 +1,165 @@
+import React, { useMemo, useState } from 'react'
+import styles from './chatter.module.css'
+import { Avatar } from 'primereact/avatar'
+import { stringToColor, getTextColor } from '@/helpers/getRandomColors'
+import { RightArrowSvg } from '@/components/Svg/RightArrowSvg'
+import { Dialog } from 'primereact/dialog';
+import Image from 'next/image';
+
+interface Props {
+    user: string,
+    auditType?: string,
+    message?: any,
+    time?: string,
+    auditRecord?: any,
+    media?: {
+        messageAttachments?: Array<{
+            id: number;
+            relativeUri: string;
+            mimeType: string;
+            originalFileName: string;
+            _full_url: string;
+        }>;
+    };
+}
+
+const getFileIcon = (mimeType: string) => {
+    if (mimeType.startsWith('image/')) {
+        return 'pi pi-image';
+    }
+    switch (mimeType) {
+        case 'application/pdf':
+            return 'pi pi-file-pdf';
+        case 'application/vnd.ms-excel':
+        case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet':
+            return 'pi pi-file-excel';
+        case 'application/msword':
+        case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document':
+            return 'pi pi-file-word';
+        case 'text/plain':
+            return 'pi pi-file';
+        default:
+            return 'pi pi-file';
+    }
+};
+
+export const SolidChatterMessageBox = (props: Props) => {
+    const { user, auditType, message, time, auditRecord, media } = props;
+    const [selectedImage, setSelectedImage] = useState<string | null>(null);
+    const [isImageDialogVisible, setIsImageDialogVisible] = useState(false);
+
+    const avatarStyle = useMemo(() => {
+        const bg = stringToColor(user)
+        const color = getTextColor(bg)
+        return { backgroundColor: bg, color, height: 24, width: 24, fontSize: 10, fontWeight: 600 }
+    }, [user])
+
+    const handleImageClick = (url: string) => {
+        setSelectedImage(url);
+        setIsImageDialogVisible(true);
+    };
+
+    return (
+        <div className={styles.solidChatterMessageBox}>
+            <div className='flex align-items-center'>
+                <div style={{ width: 32 }}>
+                    <Avatar label={user.charAt(0).toUpperCase()} style={avatarStyle} shape="circle" />
+                </div>
+                <div className='flex align-items-center justify-content-between' style={{ width: '100%' }}>
+                    <div className='text-sm'>
+                        <span className='font-bold'>{user}</span>
+                        <span className='ml-2' style={{ color: '#949494' }}>
+                            {auditType === "fieldChange" ? 'Fields changed' : 'Sent message'}
+                        </span>
+                    </div>
+                    <i className='pi pi-ellipsis-v text-xs' />
+                </div>
+            </div>
+            <div className='flex align-items-center mt-1'>
+                <div style={{ width: 32 }}>
+                </div>
+                <div style={{ width: '100%' }}>
+                    <p className='mb-1 text-sm font-bold' style={{ color: '#949494' }}>
+                        {time}
+                    </p>
+                    <div className={styles.solidMessageWrapper}>
+                        {auditType === "audit" ? (
+                            <div className='flex flex-column gap-2'>
+                                {auditRecord.map((item: any, index: number) => (
+                                    <div key={index} className='flex gap-2'>
+                                        <span className='m-0 text-sm'>
+                                            {"(" + item.field + ")"}
+                                        </span>
+                                        <span className='m-0 text-sm font-bold'>
+                                            {item.previous}
+                                        </span>
+                                        <RightArrowSvg />
+                                        <span className='m-0 text-sm font-bold text-primary'>
+                                            {item.current}
+                                        </span>
+                                    </div>
+                                ))}
+                            </div>
+                        ) : (
+                            <p className='m-0 text-sm'>
+                                {message}
+                            </p>
+                        )}
+                    </div>
+                    {media?.messageAttachments && media.messageAttachments.length > 0 && (
+                        <div className='flex flex-wrap gap-2 mt-2'>
+                            {media.messageAttachments.map((attachment) => {
+                                const isImage = attachment.mimeType.startsWith('image/');
+                                return (
+                                    <div key={attachment.id} className='flex align-items-center gap-2 bg-gray-100 p-2 rounded'>
+                                        {isImage ? (
+                                            <div 
+                                                className='cursor-pointer'
+                                                onClick={() => handleImageClick(attachment._full_url)}
+                                            >
+                                                <Image
+                                                    src={encodeURI(attachment._full_url)}
+                                                    alt={attachment.originalFileName}
+                                                    width={50}
+                                                    height={50}
+                                                    className='rounded'
+                                                    style={{ objectFit: 'cover' }}
+                                                />
+                                            </div>
+                                        ) : (
+                                            <a 
+                                                href={encodeURI(attachment._full_url)}
+                                                target="_blank"
+                                                rel="noopener noreferrer"
+                                                className='flex align-items-center gap-2 text-decoration-none'
+                                            >
+                                                <i className={getFileIcon(attachment.mimeType)} />
+                                                <span className='text-sm'>{attachment.originalFileName}</span>
+                                            </a>
+                                        )}
+                                    </div>
+                                );
+                            })}
+                        </div>
+                    )}
+                </div>
+            </div>
+            <Dialog
+                visible={isImageDialogVisible}
+                onHide={() => setIsImageDialogVisible(false)}
+                className='w-9'
+                modal
+            >
+                {selectedImage && (
+                    <Image
+                        src={selectedImage}
+                        alt="Preview"
+                        width={800}
+                        height={600}
+                        style={{ width: '100%', height: 'auto' }}
+                    />
+                )}
+            </Dialog>
+        </div>
+    )
+}

package/dist/components/core/chatter/SolidMessageComposer.d.ts

@@ -0,0 +1,7 @@
+export declare const SolidMessageComposer: ({ type, solidFormViewMetaData, refetch, id }: {
+    type?: string | undefined;
+    solidFormViewMetaData?: any;
+    refetch?: any;
+    id?: any;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SolidMessageComposer.d.ts.map

package/dist/components/core/chatter/SolidMessageComposer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidMessageComposer.d.ts","sourceRoot":"","sources":["../../../../src/components/core/chatter/SolidMessageComposer.tsx"],"names":[],"mappings":"AAUA,eAAO,MAAM,oBAAoB;;4BAA2F,GAAG;cAAY,GAAG;SAAO,GAAG;6CAsIvJ,CAAA"}