@social-mail/social-mail-client 1.2.145 → 1.2.147

package/src/site-editor/styler/properties/text/stylerText.ts

@@ -73,5 +73,53 @@ export const stylerText = {
         "pre",
         "pre-line",
         "pre-wrap"
-    ]))
+    ])),
+
+    stylerTextOutline: new StylerProperty("styler-text-outline", {
+        "thin": styled.css `
+            -webkit-text-fill-color: transparent;
+            -webkit-text-stroke-color: currentColor;
+            -webkit-text-stroke-width: thin;
+        `,
+        "medium": styled.css `
+            -webkit-text-fill-color: transparent;
+            -webkit-text-stroke-color: currentColor;
+            -webkit-text-stroke-width: medium;
+        `,
+        "thick": styled.css `
+            -webkit-text-fill-color: transparent;
+            -webkit-text-stroke-color: currentColor;
+            -webkit-text-stroke-width: thick;
+        `,
+        "size1px": styled.css `
+            -webkit-text-fill-color: transparent;
+            -webkit-text-stroke-color: currentColor;
+            -webkit-text-stroke-width: 1px;
+        `,
+        "size2px": styled.css `
+            -webkit-text-fill-color: transparent;
+            -webkit-text-stroke-color: currentColor;
+            -webkit-text-stroke-width: 2px;
+        `,
+        "size3px": styled.css `
+            -webkit-text-fill-color: transparent;
+            -webkit-text-stroke-color: currentColor;
+            -webkit-text-stroke-width: 3px;
+        `,
+        "size1rem": styled.css `
+            -webkit-text-fill-color: transparent;
+            -webkit-text-stroke-color: currentColor;
+            -webkit-text-stroke-width: 1rem;
+        `,
+        "size2rem": styled.css `
+            -webkit-text-fill-color: transparent;
+            -webkit-text-stroke-color: currentColor;
+            -webkit-text-stroke-width: 2rem;
+        `,
+        "size3rem": styled.css `
+            -webkit-text-fill-color: transparent;
+            -webkit-text-stroke-color: currentColor;
+            -webkit-text-stroke-width: 3rem;
+        `
+    })
 };

package/src/web/page/mails/ConversationPage.tsx

@@ -253,6 +253,12 @@ export default class ConversationPage extends ContentPage {
                             <i
                                 data-click-event="reply-all-email"
                                 class="fa-solid fa-reply-all"
+                                title="Reply All"
+                                />
+                            <i
+                                data-click-event="forward-email"
+                                class="fa-solid fa-share-all"
+                                title="Forward"
                                 />
                         </div> }
                         {isSending && <div data-layout="command-row" style-padding-left="20px">
@@ -356,6 +362,22 @@ export default class ConversationPage extends ContentPage {
         await this.conversationService.stopEmail(thread);
     }
 
+    @Action({ onEvent: "forward-email"})
+    async forwardEmail(thread: IMailboxContactEmail, ce: CustomEvent) {
+        void InlinePopup.show(ce.target as HTMLElement, <div
+            data-click-event="none"
+            data-click-animate="none">
+                <MenuItem
+                    eventClick={() => CommonEvents.onEmailForward.dispatchEvent(thread)}
+                    label="As Inline Message"
+                    />
+                <MenuItem
+                    eventClick={() => CommonEvents.onEmailForwardAsAttachment.dispatchEvent(thread)}
+                    label="As Attachment"
+                    />
+            </div>, { alignment: "above"});
+    }
+
     @Action({ onEvent: "mail-options"})
     async mailOptions(thread: IMailboxContactEmail, ce: CustomEvent) {
         void InlinePopupControl.showPopup(ce.target as HTMLElement, <div
@@ -540,4 +562,5 @@ export default class ConversationPage extends ContentPage {
         await this.conversationService.delete(mce.email);
         this.mails.remove(mce);
     }
+
 }

package/src/web/page/mails/mini-compose/MiniComposeBox.tsx

@@ -31,6 +31,8 @@ import ToggleEmoji from "./ToggleEmoji";
 import Attach from "./Attach";
 import PopupService from "@web-atoms/core/dist/web/services/PopupService";
 import { CancelToken } from "@web-atoms/core/dist/core/types";
+import DomToString from "@web-atoms/email-dom/dist/DomToString";
+import EmailLabel from "../../../../common/controls/email-recipients/EmailLabel";
 
 const css = styled.css `
     display: grid;
@@ -70,7 +72,7 @@ const css = styled.css `
 `.installLocal();
 
 const defaultEmailBody = `<section style="background-color: white; color: black;">
-<section contentEditable="true">&nbsp;</br></section>
+<section contentEditable="true">&nbsp;<br/></section>
 <footer data-social-mail-commands="emoji-bar"></footer>
 </section>`;
 
@@ -283,6 +285,94 @@ export default class MiniComposeBox extends AtomControl {
         this.draft = mce.email;
     }
 
+    @Action({ onEvent: CommonEvents.onEmailForward})
+    async onForwardEmail(mce: IMailboxContactEmail) {
+        if (this.draft?.emailID) {
+            await this.save(true);
+            this.draft = null;
+        }
+        this.ensureDraft();
+        const { email } = mce;
+        const { recipients } = email;
+        const to = recipients?.filter((x) => x.type === "to");
+        const cc = recipients?.filter((x) => x.type === "cc");
+        this.draft.htmlBody = DomToString(
+            <section
+            style="background-color: white; color: black;">
+            <section contentEditable="true">
+                {"\xa0"}
+                <br/>
+            </section>
+            <blockquote
+                contentEditable="false"
+                data-type="forwarded"
+                style="margin-inline-start: 20px; margin-inline-end: 0; border-left: solid 1px lightgray; padding-left: 10px;">
+                <summary><div>From: ${email.senderName} {`<${email.senderEmail.emailAddress}>`}</div>
+                    <div>
+                        { to?.length && <div>
+                            <label style="margin-right:10px;">To:</label>
+                            { ... to.map((x) => <EmailLabel recipient={x} />) }
+                        </div> }
+                        { cc?.length && <div>
+                            <label style="margin-right:10px;">CC:</label>
+                            { ... cc.map((x) => <EmailLabel recipient={x} />) }
+                        </div>}
+                        <div>
+                            <label style="margin-right:10px;">Subject:</label>
+                            <label>{email.subject}</label>
+                        </div>
+                        <div data-type="html-body">
+                            {email.htmlBody}
+                        </div>
+                    </div>
+                </summary>
+            </blockquote>
+            <footer data-social-mail-commands="emoji-bar">
+            </footer>
+        </section>);
+
+        // copy all attachments..
+        this.editor.htmlContent = this.draft.htmlBody;
+
+        const attachments = mce.email.attachments;
+        if (attachments) {
+            for (const iterator of attachments) {
+                this.draft.attachments.add(AppFile.create({
+                    ... iterator,
+                    appFileID: void 0,
+                }));
+            }
+        }
+        await this.save(!!attachments);
+    }
+
+    @Action({ onEvent: CommonEvents.onEmailForwardAsAttachment})
+    async onForwardEmailAsAttachment(mce: IMailboxContactEmail) {
+        if (this.draft?.emailID) {
+            await this.save(true);
+            this.draft = null;
+        }
+        this.ensureDraft();
+        const { email, signedFileLogID } = mce;
+        const { mimeFileID } = email;
+
+        this.draft.htmlBody = DomToString(<section
+            style="background-color: white; color: black;">
+            <section contentEditable="true">
+                {"\xa0"}
+                <br/>
+            </section>
+        </section>);
+        this.editor.htmlContent = this.draft.htmlBody;
+
+        this.draft.attachments.add(AppFile.create({
+            name: "forwarded.eml",
+            sourceEmailLogID: mimeFileID ?? signedFileLogID,
+            contentType: "message/rfc822"
+        }));
+        await this.save(true);
+    }
+
     @Action({
         onEvent: "send-email"
     })