@social-mail/social-mail-client 1.2.43 → 1.2.44

package/dist/public/channel/ChannelView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChannelView.d.ts","sourceRoot":"","sources":["../../../src/public/channel/ChannelView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAC;AAC5E,OAAO,yBAAyB,CAAC;AAOjC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,OAAO,WAAW,MAAM,eAAe,CAAC;AAKxC,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,WAAW;IAGhD,WAAW,EAAE,WAAW,CAAC;IAEzB,MAAM,SAAM;IAEZ,SAAS,SAAK;IAEd,KAAK,WAAkB;gBAEX,GAAG,KAAA,EAAE,CAAC,cAAoC;IAKhD,IAAI;CA4Cb"}
+{"version":3,"file":"ChannelView.d.ts","sourceRoot":"","sources":["../../../src/public/channel/ChannelView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAC;AAC5E,OAAO,yBAAyB,CAAC;AAOjC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,OAAO,WAAW,MAAM,eAAe,CAAC;AAuDxC,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,WAAW;IAGhD,WAAW,EAAE,WAAW,CAAC;IAEzB,MAAM,SAAM;IAEZ,SAAS,SAAK;IAEd,KAAK,WAAkB;gBAEX,GAAG,KAAA,EAAE,CAAC,cAAoC;IAKhD,IAAI;CAsDb"}

package/dist/public/channel/ChannelView.js

@@ -1,7 +1,7 @@
-System.register(["tslib", "@web-atoms/core/dist/web/controls/AtomControl", "../../style/GlobalStyle", "@web-atoms/core/dist/core/InjectProperty", "@web-atoms/core/dist/core/XNode", "./channelViewStyle", "@web-atoms/core/dist/core/Bind", "@web-atoms/web-controls/dist/basic/AtomRepeater", "../../common/controls/repeater/InfiniteRepeater", "./BlogService", "@web-atoms/core/dist/Pack", "../../web/page/mails/service/ConversationService"], function (_export, _context) {
+System.register(["tslib", "@web-atoms/core/dist/web/controls/AtomControl", "../../style/GlobalStyle", "@web-atoms/core/dist/core/InjectProperty", "@web-atoms/core/dist/core/XNode", "./channelViewStyle", "@web-atoms/core/dist/core/Bind", "@web-atoms/web-controls/dist/basic/AtomRepeater", "../../common/controls/repeater/InfiniteRepeater", "./BlogService", "@web-atoms/core/dist/Pack", "../../web/page/mails/service/ConversationService", "../../common/date/DateFormats", "@web-atoms/core/dist/style/styled", "@web-atoms/web-controls/dist/basic/LimitedText"], function (_export, _context) {
   "use strict";
 
-  var __awaiter, __decorate, __metadata, AtomControl, InjectProperty, XNode, channelViewStyle, Bind, AtomRepeater, InfiniteRepeater, BlogService, Pack, renderMail, ChannelView;
+  var __awaiter, __decorate, __metadata, AtomControl, InjectProperty, XNode, channelViewStyle, Bind, AtomRepeater, InfiniteRepeater, BlogService, Pack, renderMail, DateFormats, styled, LimitedText, ChannelView;
   return {
     setters: [function (_tslib) {
       __awaiter = _tslib.__awaiter;
@@ -27,8 +27,60 @@ System.register(["tslib", "@web-atoms/core/dist/web/controls/AtomControl", "../.
       Pack = _webAtomsCoreDistPack.default;
     }, function (_webPageMailsServiceConversationService) {
       renderMail = _webPageMailsServiceConversationService.renderMail;
+    }, function (_commonDateDateFormats) {
+      DateFormats = _commonDateDateFormats.DateFormats;
+    }, function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_webAtomsWebControlsDistBasicLimitedText) {
+      LimitedText = _webAtomsWebControlsDistBasicLimitedText.default;
     }],
     execute: function () {
+      styled.css`
+
+    box-sizing: border-box;
+
+    & > header {
+
+    }
+
+    & > section {
+        & [data-element=blog-item] {
+            margin: 10px;
+            border: solid 1px lightgray;
+            border-radius: 10px;
+            display: grid;
+            grid-template-columns: 1fr auto;
+            grid-template-rows: auto 1fr;
+
+            background-color: gray;
+
+            & > h4 {
+                grid-row: 1;
+                grid-column: 1;
+                margin-block-start: 0;
+                margin-block-end: 0;
+                padding: 10px;
+            }
+
+            & > h6 {
+                grid-row: 1;
+                grid-column: 2;
+                margin-block-start: 0;
+                margin-block-end: 0;
+                padding: 10px;
+            }
+            & > section {
+                padding: 10px;
+                border-bottom-left-radius: 10px;
+                border-bottom-right-radius: 10px;
+                grid-row: 2;
+                grid-column: 1 / span 2;
+                background-color: canvas;
+            }
+        }
+    }
+
+    `.installGlobal("[data-blog-list=blog-list]");
       ChannelView = class ChannelView extends AtomControl {
         constructor(app, e = document.createElement("section")) {
           super(app, e);
@@ -44,6 +96,7 @@ System.register(["tslib", "@web-atoms/core/dist/web/controls/AtomControl", "../.
               channelID,
               emailAddress
             } = (_a = window.socialMail) !== null && _a !== void 0 ? _a : {};
+            this.element.setAttribute("data-blog-list", "blog-list");
             this.channelID = channelID || (yield this.blogService.getChannelID(emailAddress));
             this.renderer = XNode.create("div", {
               "data-layout": "flex-center"
@@ -63,9 +116,23 @@ System.register(["tslib", "@web-atoms/core/dist/web/controls/AtomControl", "../.
               cancelToken
             })), {
               itemRenderer: email => {
-                return XNode.create("div", null, XNode.create("div", Object.assign({}, renderMail({
+                return XNode.create("section", {
+                  "data-element": "blog-item"
+                }, XNode.create("h4", {
+                  "data-element": "title",
+                  text: email.subject
+                }), XNode.create("h6", {
+                  "data-element": "date",
+                  text: DateFormats.relative.short(email.dateSent)
+                }), XNode.create("h6", {
+                  text: email.senderName
+                }), XNode.create("section", {
+                  "data-element": "content"
+                }, XNode.create(LimitedText, {
+                  height: 200
+                }, XNode.create("section", Object.assign({}, renderMail({
                   email
-                }))));
+                }))))));
               }
             }))), XNode.create("aside", null, XNode.create(AtomRepeater, null)), XNode.create("footer", null));
           });

package/dist/public/channel/ChannelView.js.map

@@ -1 +1 @@
-{"version":3,"names":["AtomControl","_webAtomsCoreDistWebControlsAtomControl","_styleGlobalStyle","_webAtomsCoreDistCoreInjectProperty","InjectProperty","default","_webAtomsCoreDistCoreXNode","XNode","_channelViewStyle","channelViewStyle","_webAtomsCoreDistCoreBind","Bind","_webAtomsWebControlsDistBasicAtomRepeater","AtomRepeater","_commonControlsRepeaterInfiniteRepeater","InfiniteRepeater","_BlogService","BlogService","_webAtomsCoreDistPack","Pack","_webPageMailsServiceConversationService","renderMail","execute","ChannelView","constructor","app","e","document","createElement","search","channelID","mails","runAfterInit","runAsync","init","emailAddress","_a","window","socialMail","blogService","getChannelID","renderer","create","text","element","className","placeholder","value","twoWaysImmediate","Object","assign","items","pagedItems","start","c","cancelToken","getEmails","itemRenderer","email","__decorate","_export"],"sources":["../../../src/public/channel/ChannelView.tsx"],"sourcesContent":[null],"mappings":"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"}
+{"version":3,"names":["AtomControl","_webAtomsCoreDistWebControlsAtomControl","_styleGlobalStyle","_webAtomsCoreDistCoreInjectProperty","InjectProperty","default","_webAtomsCoreDistCoreXNode","XNode","_channelViewStyle","channelViewStyle","_webAtomsCoreDistCoreBind","Bind","_webAtomsWebControlsDistBasicAtomRepeater","AtomRepeater","_commonControlsRepeaterInfiniteRepeater","InfiniteRepeater","_BlogService","BlogService","_webAtomsCoreDistPack","Pack","_webPageMailsServiceConversationService","renderMail","_commonDateDateFormats","DateFormats","_webAtomsCoreDistStyleStyled","styled","_webAtomsWebControlsDistBasicLimitedText","LimitedText","execute","css","installGlobal","ChannelView","constructor","app","e","document","createElement","search","channelID","mails","runAfterInit","runAsync","init","emailAddress","_a","window","socialMail","element","setAttribute","blogService","getChannelID","renderer","create","text","className","placeholder","value","twoWaysImmediate","Object","assign","items","pagedItems","start","c","cancelToken","getEmails","itemRenderer","email","subject","relative","short","dateSent","senderName","height","__decorate","_export"],"sources":["../../../src/public/channel/ChannelView.tsx"],"sourcesContent":[null],"mappings":"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"}

package/dist/public/channel/ChannelView.pack.js

@@ -1985,7 +1985,7 @@ const UMD = new UMDClass();
 
         AmdLoader.instance.register(
             ["@social-mail/social-mail-client","@web-atoms/core","reflect-metadata","@web-atoms/date-time","@web-atoms/data-styles","@web-atoms/web-controls","@web-atoms/entity","@web-atoms/email-dom"],
-            ["@social-mail/social-mail-client/dist/public/channel/ChannelView","@web-atoms/core/dist/web/controls/AtomControl","@web-atoms/core/dist/core/AtomBinder","@web-atoms/core/dist/core/types","reflect-metadata","@web-atoms/core/dist/core/AtomMap","@web-atoms/core/dist/core/AtomComponent","@web-atoms/core/dist/App","@web-atoms/core/dist/core/AtomDispatcher","@web-atoms/core/dist/di/RegisterSingleton","@web-atoms/core/dist/di/Register","@web-atoms/core/dist/di/ServiceCollection","@web-atoms/core/dist/di/TypeKey","@web-atoms/core/dist/di/ServiceProvider","@web-atoms/core/dist/core/TransientDisposable","@web-atoms/core/dist/di/Inject","@web-atoms/core/dist/services/BusyIndicatorService","@web-atoms/core/dist/core/AtomDisposableList","@web-atoms/core/dist/core/AtomWatcher","@web-atoms/core/dist/core/ExpressionParser","@web-atoms/core/dist/core/Bind","@web-atoms/core/dist/core/Hacks","@web-atoms/core/dist/web/core/AtomUI","@web-atoms/core/dist/core/InheritedProperty","@web-atoms/core/dist/core/PropertyMap","@web-atoms/core/dist/core/XNode","@web-atoms/core/dist/core/BindableProperty","@web-atoms/core/dist/core/Command","@web-atoms/core/dist/core/EventScope","@web-atoms/date-time/dist/DateTime","@web-atoms/date-time/dist/TimeSpan","@web-atoms/core/dist/core/Route","@web-atoms/core/dist/core/StringHelper","@web-atoms/core/dist/core/FormattedString","@web-atoms/core/dist/core/WebImage","@web-atoms/core/dist/web/styles/AtomStyle","@web-atoms/core/dist/web/styles/AtomStyleSheet","@social-mail/social-mail-client/dist/style/GlobalStyle","@web-atoms/core/dist/core/AtomList","@social-mail/social-mail-client/dist/style/OverrideAppStyle","@web-atoms/core/dist/style/styled","@web-atoms/data-styles/data-styles","@web-atoms/core/dist/core/InjectProperty","@social-mail/social-mail-client/dist/public/channel/channelViewStyle","@web-atoms/web-controls/dist/basic/AtomRepeater","@web-atoms/core/dist/core/Colors","@web-atoms/core/dist/core/WatchProperty","@web-atoms/core/dist/web/services/PopupService","@web-atoms/core/dist/web/services/PopupWindow","@web-atoms/core/dist/core/sleep","@web-atoms/web-controls/dist/basic/InlinePopup","@web-atoms/web-controls/dist/basic/styles/inline-popup-style","@web-atoms/web-controls/dist/basic/MergeNode","@web-atoms/web-controls/dist/basic/ItemPath","@web-atoms/web-controls/dist/basic/styles/ui-display-none-style","@web-atoms/web-controls/dist/basic/styles/popup-style","@web-atoms/web-controls/dist/basic/styles/suggestion-popup","@web-atoms/web-controls/dist/basic/styles/repeater-style","@web-atoms/web-controls/dist/DataAttributes","@social-mail/social-mail-client/dist/common/controls/repeater/InfiniteRepeater","@social-mail/social-mail-client/dist/public/channel/BlogService","@web-atoms/core/dist/di/DISingleton","@social-mail/social-mail-client/dist/services/EntityService","@web-atoms/entity/dist/services/BaseEntityService","@web-atoms/entity/dist/models/Cloner","@web-atoms/entity/dist/models/cloneSource","@web-atoms/entity/dist/models/IEntityModel","@web-atoms/entity/dist/services/HttpSession","@web-atoms/core/dist/services/http/JsonError","@web-atoms/entity/dist/models/TaskManager","@web-atoms/entity/dist/models/Queue","@web-atoms/entity/dist/services/mergeProperties","@web-atoms/entity/dist/services/Query","@web-atoms/entity/dist/services/StringHelper","@web-atoms/entity/dist/services/resolve","@social-mail/social-mail-client/dist/services/BusyProgress","@social-mail/social-mail-client/dist/model/model","@social-mail/social-mail-client/dist/common/Sql","@social-mail/social-mail-client/dist/services/email/EmailContentDownloader","@web-atoms/core/dist/services/FetchBuilder","@web-atoms/core/dist/Pack","@social-mail/social-mail-client/dist/web/page/mails/service/ConversationService","@web-atoms/email-dom/dist/DomToString","@web-atoms/email-dom/dist/dom/StyleHelper","@web-atoms/email-dom/dist/style/mergeStyle","@social-mail/social-mail-client/dist/common/events/CommonEvents","@web-atoms/core/dist/web/WebApp","@web-atoms/core/dist/core/AtomOnce","@web-atoms/core/dist/core/AtomUri","@web-atoms/core/dist/services/NavigationService","@web-atoms/core/dist/services/ReferenceService","@web-atoms/core/dist/web/services/WebBusyIndicatorService","@web-atoms/core/dist/web/styles/StyleBuilder","@web-atoms/core/dist/web/services/WindowService","@web-atoms/core/dist/Atom","@web-atoms/core/dist/core/AtomLoader","@web-atoms/core/dist/services/JsonService","@web-atoms/core/dist/core/FormattedError","@web-atoms/core/dist/view-model/AtomWindowViewModel","@web-atoms/core/dist/view-model/AtomViewModel","@web-atoms/core/dist/view-model/baseTypes","@web-atoms/core/dist/web/controls/AtomAlertWindow","@web-atoms/core/dist/web/styles/AtomAlertWindowStyle","@web-atoms/core/dist/web/styles/AtomWindowStyle","@web-atoms/core/src/web/images/close-button-hover.svg","@web-atoms/core/dist/web/controls/AtomWindow","@web-atoms/core/dist/web/controls/AtomTemplate","@web-atoms/core/dist/web/controls/AtomNotification","@web-atoms/core/dist/web/styles/AtomNotificationStyle","@web-atoms/core/dist/web/styles/AtomPopupStyle","@web-atoms/core/dist/web/services/NotificationPopup","@web-atoms/core/dist/web/styles/AtomTheme"]);
+            ["@social-mail/social-mail-client/dist/public/channel/ChannelView","@web-atoms/core/dist/web/controls/AtomControl","@web-atoms/core/dist/core/AtomBinder","@web-atoms/core/dist/core/types","reflect-metadata","@web-atoms/core/dist/core/AtomMap","@web-atoms/core/dist/core/AtomComponent","@web-atoms/core/dist/App","@web-atoms/core/dist/core/AtomDispatcher","@web-atoms/core/dist/di/RegisterSingleton","@web-atoms/core/dist/di/Register","@web-atoms/core/dist/di/ServiceCollection","@web-atoms/core/dist/di/TypeKey","@web-atoms/core/dist/di/ServiceProvider","@web-atoms/core/dist/core/TransientDisposable","@web-atoms/core/dist/di/Inject","@web-atoms/core/dist/services/BusyIndicatorService","@web-atoms/core/dist/core/AtomDisposableList","@web-atoms/core/dist/core/AtomWatcher","@web-atoms/core/dist/core/ExpressionParser","@web-atoms/core/dist/core/Bind","@web-atoms/core/dist/core/Hacks","@web-atoms/core/dist/web/core/AtomUI","@web-atoms/core/dist/core/InheritedProperty","@web-atoms/core/dist/core/PropertyMap","@web-atoms/core/dist/core/XNode","@web-atoms/core/dist/core/BindableProperty","@web-atoms/core/dist/core/Command","@web-atoms/core/dist/core/EventScope","@web-atoms/date-time/dist/DateTime","@web-atoms/date-time/dist/TimeSpan","@web-atoms/core/dist/core/Route","@web-atoms/core/dist/core/StringHelper","@web-atoms/core/dist/core/FormattedString","@web-atoms/core/dist/core/WebImage","@web-atoms/core/dist/web/styles/AtomStyle","@web-atoms/core/dist/web/styles/AtomStyleSheet","@social-mail/social-mail-client/dist/style/GlobalStyle","@web-atoms/core/dist/core/AtomList","@social-mail/social-mail-client/dist/style/OverrideAppStyle","@web-atoms/core/dist/style/styled","@web-atoms/data-styles/data-styles","@web-atoms/core/dist/core/InjectProperty","@social-mail/social-mail-client/dist/public/channel/channelViewStyle","@web-atoms/web-controls/dist/basic/AtomRepeater","@web-atoms/core/dist/core/Colors","@web-atoms/core/dist/core/WatchProperty","@web-atoms/core/dist/web/services/PopupService","@web-atoms/core/dist/web/services/PopupWindow","@web-atoms/core/dist/core/sleep","@web-atoms/web-controls/dist/basic/InlinePopup","@web-atoms/web-controls/dist/basic/styles/inline-popup-style","@web-atoms/web-controls/dist/basic/MergeNode","@web-atoms/web-controls/dist/basic/ItemPath","@web-atoms/web-controls/dist/basic/styles/ui-display-none-style","@web-atoms/web-controls/dist/basic/styles/popup-style","@web-atoms/web-controls/dist/basic/styles/suggestion-popup","@web-atoms/web-controls/dist/basic/styles/repeater-style","@web-atoms/web-controls/dist/DataAttributes","@social-mail/social-mail-client/dist/common/controls/repeater/InfiniteRepeater","@social-mail/social-mail-client/dist/public/channel/BlogService","@web-atoms/core/dist/di/DISingleton","@social-mail/social-mail-client/dist/services/EntityService","@web-atoms/entity/dist/services/BaseEntityService","@web-atoms/entity/dist/models/Cloner","@web-atoms/entity/dist/models/cloneSource","@web-atoms/entity/dist/models/IEntityModel","@web-atoms/entity/dist/services/HttpSession","@web-atoms/core/dist/services/http/JsonError","@web-atoms/entity/dist/models/TaskManager","@web-atoms/entity/dist/models/Queue","@web-atoms/entity/dist/services/mergeProperties","@web-atoms/entity/dist/services/Query","@web-atoms/entity/dist/services/StringHelper","@web-atoms/entity/dist/services/resolve","@social-mail/social-mail-client/dist/services/BusyProgress","@social-mail/social-mail-client/dist/model/model","@social-mail/social-mail-client/dist/common/Sql","@social-mail/social-mail-client/dist/services/email/EmailContentDownloader","@web-atoms/core/dist/services/FetchBuilder","@web-atoms/core/dist/Pack","@social-mail/social-mail-client/dist/web/page/mails/service/ConversationService","@web-atoms/email-dom/dist/DomToString","@web-atoms/email-dom/dist/dom/StyleHelper","@web-atoms/email-dom/dist/style/mergeStyle","@social-mail/social-mail-client/dist/common/events/CommonEvents","@social-mail/social-mail-client/dist/common/date/DateFormats","@web-atoms/web-controls/dist/basic/LimitedText","@web-atoms/core/dist/web/WebApp","@web-atoms/core/dist/core/AtomOnce","@web-atoms/core/dist/core/AtomUri","@web-atoms/core/dist/services/NavigationService","@web-atoms/core/dist/services/ReferenceService","@web-atoms/core/dist/web/services/WebBusyIndicatorService","@web-atoms/core/dist/web/styles/StyleBuilder","@web-atoms/core/dist/web/services/WindowService","@web-atoms/core/dist/Atom","@web-atoms/core/dist/core/AtomLoader","@web-atoms/core/dist/services/JsonService","@web-atoms/core/dist/core/FormattedError","@web-atoms/core/dist/view-model/AtomWindowViewModel","@web-atoms/core/dist/view-model/AtomViewModel","@web-atoms/core/dist/view-model/baseTypes","@web-atoms/core/dist/web/controls/AtomAlertWindow","@web-atoms/core/dist/web/styles/AtomAlertWindowStyle","@web-atoms/core/dist/web/styles/AtomWindowStyle","@web-atoms/core/src/web/images/close-button-hover.svg","@web-atoms/core/dist/web/controls/AtomWindow","@web-atoms/core/dist/web/controls/AtomTemplate","@web-atoms/core/dist/web/controls/AtomNotification","@web-atoms/core/dist/web/styles/AtomNotificationStyle","@web-atoms/core/dist/web/styles/AtomPopupStyle","@web-atoms/core/dist/web/services/NotificationPopup","@web-atoms/core/dist/web/styles/AtomTheme"]);
 
 /*! *****************************************************************************
 Copyright (C) Microsoft. All rights reserved.
@@ -15012,10 +15012,216 @@ System.register(["tslib", "@web-atoms/core/dist/di/DISingleton", "@web-atoms/cor
 
     AmdLoader.instance.setup("@social-mail/social-mail-client/dist/web/page/mails/service/ConversationService");
 
-System.register(["tslib", "@web-atoms/core/dist/web/controls/AtomControl", "../../style/GlobalStyle", "@web-atoms/core/dist/core/InjectProperty", "@web-atoms/core/dist/core/XNode", "./channelViewStyle", "@web-atoms/core/dist/core/Bind", "@web-atoms/web-controls/dist/basic/AtomRepeater", "../../common/controls/repeater/InfiniteRepeater", "./BlogService", "@web-atoms/core/dist/Pack", "../../web/page/mails/service/ConversationService"], function (_export, _context) {
+System.register(["@web-atoms/date-time/dist/DateTime"], function (_export, _context) {
+  "use strict";
+
+  var DateTime, DIVISIONS, DateFormats;
+  return {
+    setters: [function (_webAtomsDateTimeDistDateTime) {
+      DateTime = _webAtomsDateTimeDistDateTime.default;
+    }],
+    execute: function () {
+      DIVISIONS = [{
+        amount: 60,
+        name: 'seconds'
+      }, {
+        amount: 60,
+        name: 'minutes'
+      }, {
+        amount: 24,
+        name: 'hours'
+      }, {
+        amount: 7,
+        name: 'days'
+      }, {
+        amount: 4.34524,
+        name: 'weeks'
+      }, {
+        amount: 12,
+        name: 'months'
+      }, {
+        amount: Number.POSITIVE_INFINITY,
+        name: 'years'
+      }];
+      _export("DateFormats", DateFormats = {
+        diff(d) {
+          if (!d) {
+            return "";
+          }
+          if (!(d instanceof DateTime)) {
+            d = typeof d === "string" ? new DateTime(d) : DateTime.from(d);
+          }
+          const today = DateTime.now;
+          let diff = today.diff(d);
+          if (diff.totalMilliseconds < 0) {
+            diff = d.diff(today);
+          }
+          if (diff.totalHours <= 24) {
+            if (diff.totalSeconds <= 180) {
+              return "now";
+            }
+            if (diff.totalMinutes < 60) {
+              return Math.round(diff.totalMinutes) + "m";
+            }
+            return Math.round(diff.totalHours) + "h";
+          }
+          if (diff.totalDays <= 30) {
+            return Math.round(diff.totalDays) + "d";
+          }
+          if (diff.totalDays <= 365) {
+            return Math.round(diff.totalDays / 30) + "mo";
+          }
+          return Math.round(diff.totalDays / 365) + "yr";
+        },
+        withWeekDayAndTime(d, def = "") {
+          var _a;
+          if (!d) {
+            return def;
+          }
+          d = DateTime.from(d);
+          return (_a = d === null || d === void 0 ? void 0 : d.toLocaleString(navigator.language, {
+            year: "numeric",
+            month: "short",
+            day: "numeric",
+            weekday: "short",
+            hour12: true,
+            minute: "numeric",
+            hour: "numeric"
+          })) !== null && _a !== void 0 ? _a : def;
+        },
+        relative: {
+          short(d) {
+            if (!d) {
+              return "";
+            }
+            d = DateTime.from(d);
+            const now = DateTime.now;
+            if (now < d) {
+              return "in " + DateFormats.diff(d);
+            }
+            return DateFormats.diff(d) + " ago";
+          }
+        }
+      });
+    }
+  };
+});
+//# sourceMappingURL=DateFormats.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/common/date/DateFormats");
+
+System.register(["tslib", "@web-atoms/core/dist/core/XNode", "@web-atoms/core/dist/style/styled"], function (_export, _context) {
+  "use strict";
+
+  var __rest, XNode, styled, toggleDetails, setEventHandler;
+  function LimitedText(_a, ...nodes) {
+    var {
+        text = "",
+        height = 100
+      } = _a,
+      a = __rest(_a, ["text", "height"]);
+    setEventHandler === null || setEventHandler === void 0 ? void 0 : setEventHandler();
+    const h = typeof height === "number" ? `${height}px` : height;
+    return XNode.create("div", Object.assign({
+      "data-mode": "collapsed",
+      "data-max-height": h,
+      "style-max-height": h,
+      "data-limited-text": "limited-text"
+    }, a), text && XNode.create("p", {
+      text: text
+    }), ...nodes, XNode.create("div", {
+      "style-top": h,
+      "data-element": "more"
+    }, XNode.create("button", {
+      class: "fa-solid fa-angles-up"
+    })));
+  }
+  _export("default", LimitedText);
+  return {
+    setters: [function (_tslib) {
+      __rest = _tslib.__rest;
+    }, function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }],
+    execute: function () {
+      styled.css`
+        position: relative;
+        overflow: hidden;
+        contain: content;
+
+        &[data-mode=collapsed] {
+            & > [data-element=more] {
+                cursor: pointer;
+                background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 19%, rgba(255,255,255,1) 65%, rgba(255,255,255,1) 100%);
+                & > button {
+                    transform: rotate(180deg);
+                }
+            }
+        }
+
+        & > [data-element=more] {
+            display: flex;
+            justify-content: flex-end;
+            width: 100%;
+            right: 0;
+            left: 0;
+            position: absolute;
+            transform: translateY(-100%);
+            & > button {
+                padding: 1px;
+                padding-left: 10px;
+                padding-right: 10px;
+                border-radius: 9999px;
+                border: none;
+                outline: none;
+                box-shadow: 0 0 6px 6px white;
+                transition: transform 0.5s ease-out;
+            }
+        }
+
+    `.installGlobal("[data-limited-text]");
+      toggleDetails = e => {
+        let start = e.target;
+        if (e.defaultPrevented) {
+          return;
+        }
+        start = start.parentElement;
+        const container = start;
+        start = start === null || start === void 0 ? void 0 : start.parentElement;
+        if (!start || start.getAttribute("data-limited-text") !== "limited-text") {
+          return;
+        }
+        e.preventDefault();
+        e.stopImmediatePropagation();
+        e.stopPropagation();
+        if (start.getAttribute("data-mode") === "collapsed") {
+          start.setAttribute("data-mode", "open");
+          start.style.maxHeight = "";
+          container.style.top = "";
+        } else {
+          const h = start.getAttribute("data-max-height");
+          start.style.maxHeight = h;
+          container.style.top = h;
+          start.setAttribute("data-mode", "collapsed");
+        }
+      };
+      setEventHandler = () => {
+        document.body.addEventListener("click", toggleDetails);
+        setEventHandler = null;
+      };
+    }
+  };
+});
+//# sourceMappingURL=LimitedText.js.map
+
+    AmdLoader.instance.setup("@web-atoms/web-controls/dist/basic/LimitedText");
+
+System.register(["tslib", "@web-atoms/core/dist/web/controls/AtomControl", "../../style/GlobalStyle", "@web-atoms/core/dist/core/InjectProperty", "@web-atoms/core/dist/core/XNode", "./channelViewStyle", "@web-atoms/core/dist/core/Bind", "@web-atoms/web-controls/dist/basic/AtomRepeater", "../../common/controls/repeater/InfiniteRepeater", "./BlogService", "@web-atoms/core/dist/Pack", "../../web/page/mails/service/ConversationService", "../../common/date/DateFormats", "@web-atoms/core/dist/style/styled", "@web-atoms/web-controls/dist/basic/LimitedText"], function (_export, _context) {
   "use strict";
 
-  var __awaiter, __decorate, __metadata, AtomControl, InjectProperty, XNode, channelViewStyle, Bind, AtomRepeater, InfiniteRepeater, BlogService, Pack, renderMail, ChannelView;
+  var __awaiter, __decorate, __metadata, AtomControl, InjectProperty, XNode, channelViewStyle, Bind, AtomRepeater, InfiniteRepeater, BlogService, Pack, renderMail, DateFormats, styled, LimitedText, ChannelView;
   return {
     setters: [function (_tslib) {
       __awaiter = _tslib.__awaiter;
@@ -15041,8 +15247,60 @@ System.register(["tslib", "@web-atoms/core/dist/web/controls/AtomControl", "../.
       Pack = _webAtomsCoreDistPack.default;
     }, function (_webPageMailsServiceConversationService) {
       renderMail = _webPageMailsServiceConversationService.renderMail;
+    }, function (_commonDateDateFormats) {
+      DateFormats = _commonDateDateFormats.DateFormats;
+    }, function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_webAtomsWebControlsDistBasicLimitedText) {
+      LimitedText = _webAtomsWebControlsDistBasicLimitedText.default;
     }],
     execute: function () {
+      styled.css`
+
+    box-sizing: border-box;
+
+    & > header {
+
+    }
+
+    & > section {
+        & [data-element=blog-item] {
+            margin: 10px;
+            border: solid 1px lightgray;
+            border-radius: 10px;
+            display: grid;
+            grid-template-columns: 1fr auto;
+            grid-template-rows: auto 1fr;
+
+            background-color: gray;
+
+            & > h4 {
+                grid-row: 1;
+                grid-column: 1;
+                margin-block-start: 0;
+                margin-block-end: 0;
+                padding: 10px;
+            }
+
+            & > h6 {
+                grid-row: 1;
+                grid-column: 2;
+                margin-block-start: 0;
+                margin-block-end: 0;
+                padding: 10px;
+            }
+            & > section {
+                padding: 10px;
+                border-bottom-left-radius: 10px;
+                border-bottom-right-radius: 10px;
+                grid-row: 2;
+                grid-column: 1 / span 2;
+                background-color: canvas;
+            }
+        }
+    }
+
+    `.installGlobal("[data-blog-list=blog-list]");
       ChannelView = class ChannelView extends AtomControl {
         constructor(app, e = document.createElement("section")) {
           super(app, e);
@@ -15058,6 +15316,7 @@ System.register(["tslib", "@web-atoms/core/dist/web/controls/AtomControl", "../.
               channelID,
               emailAddress
             } = (_a = window.socialMail) !== null && _a !== void 0 ? _a : {};
+            this.element.setAttribute("data-blog-list", "blog-list");
             this.channelID = channelID || (yield this.blogService.getChannelID(emailAddress));
             this.renderer = XNode.create("div", {
               "data-layout": "flex-center"
@@ -15077,9 +15336,23 @@ System.register(["tslib", "@web-atoms/core/dist/web/controls/AtomControl", "../.
               cancelToken
             })), {
               itemRenderer: email => {
-                return XNode.create("div", null, XNode.create("div", Object.assign({}, renderMail({
+                return XNode.create("section", {
+                  "data-element": "blog-item"
+                }, XNode.create("h4", {
+                  "data-element": "title",
+                  text: email.subject
+                }), XNode.create("h6", {
+                  "data-element": "date",
+                  text: DateFormats.relative.short(email.dateSent)
+                }), XNode.create("h6", {
+                  text: email.senderName
+                }), XNode.create("section", {
+                  "data-element": "content"
+                }, XNode.create(LimitedText, {
+                  height: 200
+                }, XNode.create("section", Object.assign({}, renderMail({
                   email
-                }))));
+                }))))));
               }
             }))), XNode.create("aside", null, XNode.create(AtomRepeater, null)), XNode.create("footer", null));
           });