@social-mail/social-mail-client 1.2.16 → 1.2.18

package/dist/admin/AdminAppIndex.pack.js

@@ -1985,7 +1985,7 @@ const UMD = new UMDClass();
 
         AmdLoader.instance.register(
             ["@social-mail/social-mail-client","@web-atoms/core","@web-atoms/web-controls","reflect-metadata","@web-atoms/date-time","@web-atoms/data-styles","@web-atoms/entity","@web-atoms/email-dom"],
-            ["@social-mail/social-mail-client/dist/admin/AdminAppIndex","@web-atoms/core/dist/Pack","@web-atoms/web-controls/dist/desktop-app/MobileDesktopApp","@web-atoms/web-controls/dist/mobile-app/MobileApp","@web-atoms/core/dist/core/AtomLoader","@web-atoms/core/dist/services/JsonService","@web-atoms/core/dist/core/StringHelper","@web-atoms/core/dist/di/RegisterSingleton","@web-atoms/core/dist/di/Register","@web-atoms/core/dist/core/types","reflect-metadata","@web-atoms/core/dist/core/AtomMap","@web-atoms/core/dist/di/ServiceCollection","@web-atoms/core/dist/di/TypeKey","@web-atoms/date-time/dist/DateTime","@web-atoms/date-time/dist/TimeSpan","@web-atoms/core/dist/services/ReferenceService","@web-atoms/core/dist/di/DISingleton","@web-atoms/core/dist/core/AtomUri","@web-atoms/core/dist/web/core/AtomUI","@web-atoms/core/dist/core/Command","@web-atoms/core/dist/core/EventScope","@web-atoms/core/dist/core/Route","@web-atoms/core/dist/core/InheritedProperty","@web-atoms/core/dist/core/AtomBinder","@web-atoms/core/dist/core/sleep","@web-atoms/core/dist/core/XNode","@web-atoms/core/dist/core/Bind","@web-atoms/core/dist/core/ExpressionParser","@web-atoms/core/dist/services/NavigationService","@web-atoms/core/dist/core/AtomComponent","@web-atoms/core/dist/App","@web-atoms/core/dist/core/AtomDispatcher","@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/Hacks","@web-atoms/core/dist/core/PropertyMap","@web-atoms/core/dist/core/FormattedString","@web-atoms/core/dist/web/controls/AtomControl","@web-atoms/core/dist/core/BindableProperty","@web-atoms/core/dist/core/WebImage","@web-atoms/core/dist/web/styles/AtomStyle","@web-atoms/core/dist/web/styles/AtomStyleSheet","@web-atoms/core/dist/web/services/PopupService","@web-atoms/core/dist/style/styled","@web-atoms/core/dist/web/services/PopupWindow","@web-atoms/web-controls/dist/PageNavigator","@web-atoms/web-controls/dist/desktop-app/DesktopApp","@social-mail/social-mail-client/dist/style/GlobalStyle","@web-atoms/core/dist/core/AtomList","@social-mail/social-mail-client/dist/style/OverrideAppStyle","@web-atoms/data-styles/data-styles","@social-mail/social-mail-client/dist/services/LoginService","@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/SocialMailApp","@web-atoms/core/dist/core/InjectProperty","@social-mail/social-mail-client/dist/admin/commands/AdminCommands","@social-mail/social-mail-client/dist/admin/pages/home/AdminHome","@social-mail/social-mail-client/dist/admin/pages/domains/DomainListPage","@web-atoms/web-controls/dist/basic/AtomRepeater","@web-atoms/core/dist/core/Colors","@web-atoms/core/dist/core/WatchProperty","@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/admin/pages/domains/services/AdminDomainService","@web-atoms/core/dist/di/DITransient","@web-atoms/core/dist/view-model/Action","@social-mail/social-mail-client/dist/admin/pages/domains/edit/EditDomainPage","@web-atoms/web-controls/dist/basic/Form","@social-mail/social-mail-client/dist/common/controls/form/RequiredFormField","@web-atoms/web-controls/dist/basic/FormField","@web-atoms/web-controls/dist/basic/styles/form-field-style","@web-atoms/web-controls/dist/basic/PasswordBox","@web-atoms/web-controls/dist/basic/styles/password-box-style","@web-atoms/web-controls/dist/basic/Checkbox","@web-atoms/web-controls/dist/basic/styles/checkbox-style","@web-atoms/web-controls/dist/basic/Expander","@web-atoms/web-controls/dist/basic/styles/expander-style","@social-mail/social-mail-client/dist/common/controls/buttons/IconButton","@social-mail/social-mail-client/dist/admin/pages/domains/edit/DomainKeySetupPage","@social-mail/social-mail-client/dist/common/controls/buttons/CopyIcon","@social-mail/social-mail-client/dist/admin/pages/domains/domain-user/DomainUserEditor","@social-mail/social-mail-client/dist/common/controls/drop-downs/user/UserDropDown","@web-atoms/web-controls/dist/basic/DropDown","@web-atoms/web-controls/dist/basic/styles/drop-down-style","@social-mail/social-mail-client/dist/admin/pages/users/services/AdminUserService","@social-mail/social-mail-client/dist/common/Sql","@social-mail/social-mail-client/dist/common/pages/folders/ChooserFolderPage","@social-mail/social-mail-client/dist/web/page/files/service/CloudFileService","@web-atoms/core/dist/services/FetchBuilder","@social-mail/social-mail-client/dist/common/controls/tree/TreeView","@social-mail/social-mail-client/dist/admin/pages/users/UserListPage","@social-mail/social-mail-client/dist/common/controls/repeater/InfiniteRepeater","@social-mail/social-mail-client/dist/admin/pages/users/EditUserPage","@social-mail/social-mail-client/dist/common/validators/Validators","@social-mail/social-mail-client/dist/common/controls/password/PasswordStrength","@web-atoms/web-controls/dist/mobile-app/MasterDetailPage","@social-mail/social-mail-client/dist/admin/pages/users/UserDetailsPage","@social-mail/social-mail-client/dist/common/NumberFormats","@social-mail/social-mail-client/dist/common/controls/collection-editor/CollectionEditor","@social-mail/social-mail-client/dist/admin/pages/users/domains/EditDomainUserPage","@social-mail/social-mail-client/dist/admin/pages/users/mailboxes/EditUserMailboxPage","@social-mail/social-mail-client/dist/common/pages/mailboxes/services/MailboxService","@social-mail/social-mail-client/dist/admin/pages/users/files/EditFileAccessPage","@web-atoms/web-controls/dist/basic/ComboBox","@social-mail/social-mail-client/dist/common/pages/mailboxes/MailboxListPage","@social-mail/social-mail-client/dist/common/pages/mailboxes/MailboxEditorPage","@social-mail/social-mail-client/dist/admin/pages/users/ChooseUserPage","@social-mail/social-mail-client/dist/common/commands/CommonCommands","@social-mail/social-mail-client/dist/web/page/mails/MailboxContacts","@social-mail/social-mail-client/dist/web/page/mails/service/MailService","@social-mail/social-mail-client/dist/common/events/CommonEvents","@social-mail/social-mail-client/dist/web/page/mails/ConversationPage","@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","@web-atoms/web-controls/dist/basic/InlinePopupControl","@social-mail/social-mail-client/dist/web/page/mails/ComposeMailPage","@social-mail/social-mail-client/dist/common/controls/html/InlineHtmlEditorWithToolbar","@web-atoms/web-controls/dist/html-editor/InlineHtmlEditor","@web-atoms/web-controls/dist/html-editor/commands/AddImage","@web-atoms/web-controls/dist/html-editor/commands/CommandButton","@web-atoms/web-controls/dist/html-editor/commands/HtmlCommands","@web-atoms/web-controls/dist/html-editor/commands/Toolbar","@web-atoms/web-controls/dist/html-editor/commands/Bold","@web-atoms/web-controls/dist/html-editor/commands/Command","@web-atoms/web-controls/dist/html-editor/commands/Italic","@web-atoms/web-controls/dist/html-editor/commands/Underline","@web-atoms/web-controls/dist/html-editor/commands/StrikeThrough","@web-atoms/web-controls/dist/html-editor/commands/Align","@web-atoms/web-controls/dist/basic/PopupButton","@web-atoms/web-controls/dist/basic/styles/popup-button-style","@web-atoms/web-controls/dist/html-editor/commands/HorizontalRule","@web-atoms/web-controls/dist/html-editor/commands/Separator","@web-atoms/web-controls/dist/html-editor/commands/Headings","@web-atoms/web-controls/dist/html-editor/commands/ChangeColor","@web-atoms/web-controls/dist/html-editor/commands/ChangeFont","@web-atoms/web-controls/dist/html-editor/commands/ChangeFontSize","@web-atoms/web-controls/dist/html-editor/commands/NumberedList","@web-atoms/web-controls/dist/html-editor/commands/UnorderedList","@web-atoms/web-controls/dist/html-editor/commands/IndentLess","@web-atoms/web-controls/dist/html-editor/commands/IndentMore","@web-atoms/web-controls/dist/html-editor/commands/AddLink","@web-atoms/core/dist/web/controls/AtomToggleButtonBar","@web-atoms/core/dist/web/styles/AtomToggleButtonBarStyle","@web-atoms/core/dist/web/styles/AtomListBoxStyle","@web-atoms/core/dist/web/controls/AtomListBox","@web-atoms/core/dist/web/controls/AtomItemsControl","@web-atoms/core/dist/core/AtomEnumerator","@web-atoms/web-controls/dist/html-editor/commands/Unlink","@web-atoms/web-controls/dist/html-editor/commands/RemoveFormat","@web-atoms/web-controls/dist/html-editor/commands/Source","@web-atoms/web-controls/dist/basic/UploadEvent","@social-mail/social-mail-client/dist/services/files/LocalFileService","@web-atoms/web-controls/dist/basic/TitleEditor","@web-atoms/web-controls/dist/basic/styles/title-editor-style","@social-mail/social-mail-client/dist/common/controls/email-recipients/EmailRecipientChips","@web-atoms/web-controls/dist/basic/AtomChips","@web-atoms/web-controls/dist/basic/Chip","@web-atoms/web-controls/dist/basic/styles/chip-style","@web-atoms/web-controls/dist/basic/styles/chips-style","@web-atoms/web-controls/dist/basic/styles/item-suggestion-style","@social-mail/social-mail-client/dist/services/email-addresses/EmailAddressService","@social-mail/social-mail-client/dist/common/cache/CacheTTL","@social-mail/social-mail-client/dist/web/page/templates/social/SocialTemplate","@social-mail/social-mail-client/dist/services/Emoji","@social-mail/social-mail-client/dist/services/socket/sockets","@web-atoms/web-controls/dist/basic/LimitedText","@social-mail/social-mail-client/dist/common/date/DateFormats","@social-mail/social-mail-client/dist/common/pages/logs/LogsPage","@social-mail/social-mail-client/dist/common/pages/logs/services/AppLogService","@social-mail/social-mail-client/dist/web/page/mails/detail/MailDetailPage","@social-mail/social-mail-client/dist/common/controls/file-preview/FilePreview","@social-mail/social-mail-client/dist/web/commands/AppCommands","@social-mail/social-mail-client/dist/web/page/home/HomePage","@social-mail/social-mail-client/dist/web/page/files/FolderPage","@social-mail/social-mail-client/dist/common/controls/drag-drop/FilesDragDrop","@social-mail/social-mail-client/dist/web/page/files/shares/EditSharesPage","@social-mail/social-mail-client/dist/services/files/FileShareService","@social-mail/social-mail-client/dist/web/page/files/shares/AddSharePage","@web-atoms/web-controls/dist/basic/Switch","@web-atoms/web-controls/dist/basic/styles/switch-style","@web-atoms/web-controls/dist/basic/DateField","@web-atoms/web-controls/dist/basic/Calendar","@web-atoms/web-controls/dist/basic/Select","@web-atoms/web-controls/dist/basic/styles/calendar-style","@web-atoms/web-controls/dist/basic/TimeEditor","@web-atoms/web-controls/dist/basic/styles/time-editor-style","@web-atoms/web-controls/dist/basic/styles/date-field-style","@social-mail/social-mail-client/dist/web/page/templates/EditTemplatePage","@social-mail/social-mail-client/dist/services/mime-service/MimeNode","@social-mail/social-mail-client/dist/common/QueryIterator","@social-mail/social-mail-client/dist/services/mime-service/AttachmentFile","@social-mail/social-mail-client/dist/services/mime-service/HeaderContentType","@social-mail/social-mail-client/dist/services/mime-service/parsePairs","@social-mail/social-mail-client/dist/services/mime-service/tokenizer","@social-mail/social-mail-client/dist/services/mime-service/HeaderContentDisposition","@social-mail/social-mail-client/dist/services/mime-service/encoder/word-encoding","@social-mail/social-mail-client/dist/services/mime-service/encoder/RawBuffer","@social-mail/social-mail-client/dist/services/mime-service/encoder/base64-to-blob","@social-mail/social-mail-client/dist/services/mime-service/encoder/quoted-printable","@social-mail/social-mail-client/dist/services/mime-service/MimeMessage","@social-mail/social-mail-client/dist/services/mime-service/stream/LineStream","@social-mail/social-mail-client/dist/services/mime-service/stream/TextWriter","@social-mail/social-mail-client/dist/web/page/files/preview/image/PreviewImage","@web-atoms/web-controls/dist/basic/PinchZoomView","@web-atoms/web-controls/dist/basic/styles/pinch-zoom-view-style","@social-mail/social-mail-client/dist/web/page/files/preview/document/PreviewDocument","@social-mail/social-mail-client/dist/web/page/files/preview/media/PreviewMedia","@web-atoms/web-controls/dist/player/AtomVideoPlayer","@social-mail/social-mail-client/dist/services/FileTypes","@social-mail/social-mail-client/dist/web/page/mails/mini-compose/MiniComposeBox","@social-mail/social-mail-client/dist/common/controls/audio/AudioRecorder","@web-atoms/web-controls/dist/mobile-app/BottomPopup","@web-atoms/web-controls/dist/animations/Animations","@social-mail/social-mail-client/dist/common/controls/audio/WebRTCService","@social-mail/social-mail-client/dist/common/controls/buttons/RoundButton","@web-atoms/web-controls/dist/html-editor/AtomHtmlEditor","@web-atoms/web-controls/dist/html-editor/commands/AttachFile","@social-mail/social-mail-client/dist/web/page/mails/mini-compose/Insert","@social-mail/social-mail-client/dist/web/page/mails/ChooseMailboxPage","@social-mail/social-mail-client/dist/common/pages/folders/ChooseTemplatePage","@web-atoms/web-controls/dist/basic/Resizable","@web-atoms/web-controls/dist/basic/ToggleButtonBar","@web-atoms/web-controls/dist/basic/styles/toggle-button-bar-style","@social-mail/social-mail-client/dist/web/page/mails/contact/AddMiniContactPage","@social-mail/social-mail-client/dist/web/page/channels/detail/ChannelDetailPage","@social-mail/social-mail-client/dist/web/page/channels/subscribers/ChannelSubscribersPage","@social-mail/social-mail-client/dist/web/page/channels/services/ChannelService","@social-mail/social-mail-client/dist/web/page/channels/subscribers/add/AddSubscriberPage","@social-mail/social-mail-client/dist/web/page/channels/subscribers/rights/UpdateRightsPage","@social-mail/social-mail-client/dist/common/pages/drives/DriveListPage","@social-mail/social-mail-client/dist/common/pages/websites/manage/ManageWebSitePage","@social-mail/social-mail-client/dist/services/websites/WebSiteService","@social-mail/social-mail-client/dist/common/pages/websites/studio/WebSiteStudioPage","@social-mail/social-mail-client/dist/common/pages/websites/templates/ChooseWebSiteTemplatePage","@social-mail/social-mail-client/dist/common/controls/tree/FileTreeView","@social-mail/social-mail-client/dist/site-editor/editor/WebSitePageEditor","@social-mail/social-mail-client/dist/site-editor/editor/HtmlPageEditor","@social-mail/social-mail-client/dist/site-editor/blocks/ImageBlock","@social-mail/social-mail-client/dist/site-editor/blocks/Block","@social-mail/social-mail-client/dist/site-editor/drag-drop/DragDropHelper","@social-mail/social-mail-client/dist/site-editor/commands/CodeCommand","@social-mail/social-mail-client/dist/site-editor/commands/EditorCommand","@social-mail/social-mail-client/dist/site-editor/toolbars/UndoRedoToolbar","@social-mail/social-mail-client/dist/site-editor/toolbars/EditorToolbar","@social-mail/social-mail-client/dist/site-editor/blocks/WrapGrid","@social-mail/social-mail-client/dist/site-editor/properties/Properties","@social-mail/social-mail-client/dist/site-editor/properties/groups/LayoutEditor","@social-mail/social-mail-client/dist/site-editor/properties/controls/PropertyEditor","@social-mail/social-mail-client/dist/site-editor/styler/StylerSet","@social-mail/social-mail-client/dist/site-editor/styler/Styler","@social-mail/social-mail-client/dist/site-editor/styler/properties/stylerBorder","@social-mail/social-mail-client/dist/site-editor/styler/properties/layout/display","@social-mail/social-mail-client/dist/site-editor/styler/properties/layout/flex/flex","@social-mail/social-mail-client/dist/site-editor/styler/properties/layout/items-position/itemsPosition","@social-mail/social-mail-client/dist/site-editor/styler/properties/layout/layout","@social-mail/social-mail-client/dist/site-editor/styler/properties/stylerPosition","@social-mail/social-mail-client/dist/site-editor/styler/properties/stylerSizes","@social-mail/social-mail-client/dist/site-editor/styler/properties/stylerSpace","@social-mail/social-mail-client/dist/site-editor/styler/properties/text/stylerText","@social-mail/social-mail-client/dist/site-editor/styler/properties/stylerBackground","@social-mail/social-mail-client/dist/site-editor/properties/groups/TextPropertyEditor","@social-mail/social-mail-client/dist/site-editor/properties/controls/SizeEditorControl","@social-mail/social-mail-client/dist/site-editor/properties/groups/BorderGroupEditor","@social-mail/social-mail-client/dist/site-editor/properties/groups/SizeGroupEditor","@social-mail/social-mail-client/dist/site-editor/properties/groups/SpaceGroupEditor","@social-mail/social-mail-client/dist/site-editor/properties/groups/PositionGroupEditor","@social-mail/social-mail-client/dist/site-editor/properties/groups/BackgroundGroupEditor","@social-mail/social-mail-client/dist/site-editor/editor/SelectedElement","@social-mail/social-mail-client/dist/web/page/files/media/ChooseMediaPage","@social-mail/social-mail-client/dist/common/pages/user/change-password/ChangePasswordPage","@social-mail/social-mail-client/dist/common/pages/user/services/UserService","@social-mail/social-mail-client/dist/common/pages/user/multi-factor/MultiFactorSetupPage","@social-mail/social-mail-client/dist/common/pages/websites/list/WebSiteListPage","@social-mail/social-mail-client/dist/common/pages/websites/edit/WebSiteFolderEditor","@social-mail/social-mail-client/dist/common/pages/mailboxes/MailboxDetailPage","@social-mail/social-mail-client/dist/common/pages/mailboxes/settings/EditSyncTargetPage","@social-mail/social-mail-client/dist/common/icons/Icons","@social-mail/social-mail-client/dist/common/pages/mailboxes/external-mailboxes/AddExternalMailboxPage","@social-mail/social-mail-client/dist/common/pages/mailboxes/services/ExternalMailboxService","@social-mail/social-mail-client/dist/admin/pages/relays/edit/EditRelayPage","@social-mail/social-mail-client/dist/admin/pages/repair/RepairPage","@social-mail/social-mail-client/dist/common/pages/user/login/LoginPage","@social-mail/social-mail-client/dist/admin/drawer/AdminDrawer","@social-mail/social-mail-client/dist/common/controls/menu/MenuItem","@social-mail/social-mail-client/dist/common/controls/ModuleInfo","@web-atoms/core/dist/web/WebApp","@web-atoms/core/dist/core/AtomOnce","@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/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/admin/AdminAppIndex","@web-atoms/core/dist/Pack","@web-atoms/web-controls/dist/desktop-app/MobileDesktopApp","@web-atoms/web-controls/dist/mobile-app/MobileApp","@web-atoms/core/dist/core/AtomLoader","@web-atoms/core/dist/services/JsonService","@web-atoms/core/dist/core/StringHelper","@web-atoms/core/dist/di/RegisterSingleton","@web-atoms/core/dist/di/Register","@web-atoms/core/dist/core/types","reflect-metadata","@web-atoms/core/dist/core/AtomMap","@web-atoms/core/dist/di/ServiceCollection","@web-atoms/core/dist/di/TypeKey","@web-atoms/date-time/dist/DateTime","@web-atoms/date-time/dist/TimeSpan","@web-atoms/core/dist/services/ReferenceService","@web-atoms/core/dist/di/DISingleton","@web-atoms/core/dist/core/AtomUri","@web-atoms/core/dist/web/core/AtomUI","@web-atoms/core/dist/core/Command","@web-atoms/core/dist/core/EventScope","@web-atoms/core/dist/core/Route","@web-atoms/core/dist/core/InheritedProperty","@web-atoms/core/dist/core/AtomBinder","@web-atoms/core/dist/core/sleep","@web-atoms/core/dist/core/XNode","@web-atoms/core/dist/core/Bind","@web-atoms/core/dist/core/ExpressionParser","@web-atoms/core/dist/services/NavigationService","@web-atoms/core/dist/core/AtomComponent","@web-atoms/core/dist/App","@web-atoms/core/dist/core/AtomDispatcher","@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/Hacks","@web-atoms/core/dist/core/PropertyMap","@web-atoms/core/dist/core/FormattedString","@web-atoms/core/dist/web/controls/AtomControl","@web-atoms/core/dist/core/BindableProperty","@web-atoms/core/dist/core/WebImage","@web-atoms/core/dist/web/styles/AtomStyle","@web-atoms/core/dist/web/styles/AtomStyleSheet","@web-atoms/core/dist/web/services/PopupService","@web-atoms/core/dist/style/styled","@web-atoms/core/dist/web/services/PopupWindow","@web-atoms/web-controls/dist/PageNavigator","@web-atoms/web-controls/dist/desktop-app/DesktopApp","@social-mail/social-mail-client/dist/style/GlobalStyle","@web-atoms/core/dist/core/AtomList","@social-mail/social-mail-client/dist/style/OverrideAppStyle","@web-atoms/data-styles/data-styles","@social-mail/social-mail-client/dist/services/LoginService","@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/SocialMailApp","@web-atoms/core/dist/core/InjectProperty","@social-mail/social-mail-client/dist/admin/commands/AdminCommands","@social-mail/social-mail-client/dist/admin/pages/home/AdminHome","@social-mail/social-mail-client/dist/admin/pages/domains/DomainListPage","@web-atoms/web-controls/dist/basic/AtomRepeater","@web-atoms/core/dist/core/Colors","@web-atoms/core/dist/core/WatchProperty","@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/admin/pages/domains/services/AdminDomainService","@web-atoms/core/dist/di/DITransient","@web-atoms/core/dist/view-model/Action","@social-mail/social-mail-client/dist/admin/pages/domains/edit/EditDomainPage","@web-atoms/web-controls/dist/basic/Form","@social-mail/social-mail-client/dist/common/controls/form/RequiredFormField","@web-atoms/web-controls/dist/basic/FormField","@web-atoms/web-controls/dist/basic/styles/form-field-style","@web-atoms/web-controls/dist/basic/PasswordBox","@web-atoms/web-controls/dist/basic/styles/password-box-style","@web-atoms/web-controls/dist/basic/Checkbox","@web-atoms/web-controls/dist/basic/styles/checkbox-style","@web-atoms/web-controls/dist/basic/Expander","@web-atoms/web-controls/dist/basic/styles/expander-style","@social-mail/social-mail-client/dist/common/controls/buttons/IconButton","@social-mail/social-mail-client/dist/admin/pages/domains/edit/DomainKeySetupPage","@social-mail/social-mail-client/dist/common/controls/buttons/CopyIcon","@social-mail/social-mail-client/dist/admin/pages/domains/domain-user/DomainUserEditor","@social-mail/social-mail-client/dist/common/controls/drop-downs/user/UserDropDown","@web-atoms/web-controls/dist/basic/DropDown","@web-atoms/web-controls/dist/basic/styles/drop-down-style","@social-mail/social-mail-client/dist/admin/pages/users/services/AdminUserService","@social-mail/social-mail-client/dist/common/Sql","@social-mail/social-mail-client/dist/common/pages/folders/ChooserFolderPage","@social-mail/social-mail-client/dist/web/page/files/service/CloudFileService","@social-mail/social-mail-client/dist/services/files/LocalFileService","@social-mail/social-mail-client/dist/common/controls/tree/TreeView","@social-mail/social-mail-client/dist/admin/pages/users/UserListPage","@social-mail/social-mail-client/dist/common/controls/repeater/InfiniteRepeater","@social-mail/social-mail-client/dist/admin/pages/users/EditUserPage","@social-mail/social-mail-client/dist/common/validators/Validators","@social-mail/social-mail-client/dist/common/controls/password/PasswordStrength","@web-atoms/web-controls/dist/mobile-app/MasterDetailPage","@social-mail/social-mail-client/dist/admin/pages/users/UserDetailsPage","@social-mail/social-mail-client/dist/common/NumberFormats","@social-mail/social-mail-client/dist/common/controls/collection-editor/CollectionEditor","@social-mail/social-mail-client/dist/admin/pages/users/domains/EditDomainUserPage","@social-mail/social-mail-client/dist/admin/pages/users/mailboxes/EditUserMailboxPage","@social-mail/social-mail-client/dist/common/pages/mailboxes/services/MailboxService","@social-mail/social-mail-client/dist/admin/pages/users/files/EditFileAccessPage","@web-atoms/web-controls/dist/basic/ComboBox","@social-mail/social-mail-client/dist/common/pages/mailboxes/MailboxListPage","@social-mail/social-mail-client/dist/common/pages/mailboxes/MailboxEditorPage","@social-mail/social-mail-client/dist/admin/pages/users/ChooseUserPage","@social-mail/social-mail-client/dist/common/commands/CommonCommands","@social-mail/social-mail-client/dist/web/page/mails/MailboxContacts","@social-mail/social-mail-client/dist/web/page/mails/service/MailService","@social-mail/social-mail-client/dist/common/events/CommonEvents","@social-mail/social-mail-client/dist/web/page/mails/ConversationPage","@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","@web-atoms/web-controls/dist/basic/InlinePopupControl","@social-mail/social-mail-client/dist/web/page/mails/ComposeMailPage","@social-mail/social-mail-client/dist/common/controls/html/InlineHtmlEditorWithToolbar","@web-atoms/web-controls/dist/html-editor/InlineHtmlEditor","@web-atoms/web-controls/dist/html-editor/commands/AddImage","@web-atoms/web-controls/dist/html-editor/commands/CommandButton","@web-atoms/web-controls/dist/html-editor/commands/HtmlCommands","@web-atoms/web-controls/dist/html-editor/commands/Toolbar","@web-atoms/web-controls/dist/html-editor/commands/Bold","@web-atoms/web-controls/dist/html-editor/commands/Command","@web-atoms/web-controls/dist/html-editor/commands/Italic","@web-atoms/web-controls/dist/html-editor/commands/Underline","@web-atoms/web-controls/dist/html-editor/commands/StrikeThrough","@web-atoms/web-controls/dist/html-editor/commands/Align","@web-atoms/web-controls/dist/basic/PopupButton","@web-atoms/web-controls/dist/basic/styles/popup-button-style","@web-atoms/web-controls/dist/html-editor/commands/HorizontalRule","@web-atoms/web-controls/dist/html-editor/commands/Separator","@web-atoms/web-controls/dist/html-editor/commands/Headings","@web-atoms/web-controls/dist/html-editor/commands/ChangeColor","@web-atoms/web-controls/dist/html-editor/commands/ChangeFont","@web-atoms/web-controls/dist/html-editor/commands/ChangeFontSize","@web-atoms/web-controls/dist/html-editor/commands/NumberedList","@web-atoms/web-controls/dist/html-editor/commands/UnorderedList","@web-atoms/web-controls/dist/html-editor/commands/IndentLess","@web-atoms/web-controls/dist/html-editor/commands/IndentMore","@web-atoms/web-controls/dist/html-editor/commands/AddLink","@web-atoms/core/dist/web/controls/AtomToggleButtonBar","@web-atoms/core/dist/web/styles/AtomToggleButtonBarStyle","@web-atoms/core/dist/web/styles/AtomListBoxStyle","@web-atoms/core/dist/web/controls/AtomListBox","@web-atoms/core/dist/web/controls/AtomItemsControl","@web-atoms/core/dist/core/AtomEnumerator","@web-atoms/web-controls/dist/html-editor/commands/Unlink","@web-atoms/web-controls/dist/html-editor/commands/RemoveFormat","@web-atoms/web-controls/dist/html-editor/commands/Source","@web-atoms/web-controls/dist/basic/UploadEvent","@web-atoms/web-controls/dist/basic/TitleEditor","@web-atoms/web-controls/dist/basic/styles/title-editor-style","@social-mail/social-mail-client/dist/common/controls/email-recipients/EmailRecipientChips","@web-atoms/web-controls/dist/basic/AtomChips","@web-atoms/web-controls/dist/basic/Chip","@web-atoms/web-controls/dist/basic/styles/chip-style","@web-atoms/web-controls/dist/basic/styles/chips-style","@web-atoms/web-controls/dist/basic/styles/item-suggestion-style","@social-mail/social-mail-client/dist/services/email-addresses/EmailAddressService","@social-mail/social-mail-client/dist/common/cache/CacheTTL","@social-mail/social-mail-client/dist/web/page/templates/social/SocialTemplate","@social-mail/social-mail-client/dist/services/Emoji","@social-mail/social-mail-client/dist/services/socket/sockets","@web-atoms/web-controls/dist/basic/LimitedText","@social-mail/social-mail-client/dist/common/date/DateFormats","@social-mail/social-mail-client/dist/common/pages/logs/LogsPage","@social-mail/social-mail-client/dist/common/pages/logs/services/AppLogService","@social-mail/social-mail-client/dist/web/page/mails/detail/MailDetailPage","@social-mail/social-mail-client/dist/common/controls/file-preview/FilePreview","@social-mail/social-mail-client/dist/web/commands/AppCommands","@social-mail/social-mail-client/dist/web/page/home/HomePage","@social-mail/social-mail-client/dist/web/page/files/FolderPage","@social-mail/social-mail-client/dist/common/controls/drag-drop/FilesDragDrop","@social-mail/social-mail-client/dist/web/page/files/shares/EditSharesPage","@social-mail/social-mail-client/dist/services/files/FileShareService","@social-mail/social-mail-client/dist/web/page/files/shares/AddSharePage","@web-atoms/web-controls/dist/basic/Switch","@web-atoms/web-controls/dist/basic/styles/switch-style","@web-atoms/web-controls/dist/basic/DateField","@web-atoms/web-controls/dist/basic/Calendar","@web-atoms/web-controls/dist/basic/Select","@web-atoms/web-controls/dist/basic/styles/calendar-style","@web-atoms/web-controls/dist/basic/TimeEditor","@web-atoms/web-controls/dist/basic/styles/time-editor-style","@web-atoms/web-controls/dist/basic/styles/date-field-style","@social-mail/social-mail-client/dist/web/page/templates/EditTemplatePage","@social-mail/social-mail-client/dist/services/mime-service/MimeNode","@social-mail/social-mail-client/dist/common/QueryIterator","@social-mail/social-mail-client/dist/services/mime-service/AttachmentFile","@social-mail/social-mail-client/dist/services/mime-service/HeaderContentType","@social-mail/social-mail-client/dist/services/mime-service/parsePairs","@social-mail/social-mail-client/dist/services/mime-service/tokenizer","@social-mail/social-mail-client/dist/services/mime-service/HeaderContentDisposition","@social-mail/social-mail-client/dist/services/mime-service/encoder/word-encoding","@social-mail/social-mail-client/dist/services/mime-service/encoder/RawBuffer","@social-mail/social-mail-client/dist/services/mime-service/encoder/base64-to-blob","@social-mail/social-mail-client/dist/services/mime-service/encoder/quoted-printable","@social-mail/social-mail-client/dist/services/mime-service/MimeMessage","@social-mail/social-mail-client/dist/services/mime-service/stream/LineStream","@social-mail/social-mail-client/dist/services/mime-service/stream/TextWriter","@social-mail/social-mail-client/dist/web/page/files/preview/image/PreviewImage","@web-atoms/web-controls/dist/basic/PinchZoomView","@web-atoms/web-controls/dist/basic/styles/pinch-zoom-view-style","@social-mail/social-mail-client/dist/web/page/files/preview/document/PreviewDocument","@web-atoms/core/dist/services/FetchBuilder","@social-mail/social-mail-client/dist/web/page/files/preview/media/PreviewMedia","@web-atoms/web-controls/dist/player/AtomVideoPlayer","@social-mail/social-mail-client/dist/services/FileTypes","@social-mail/social-mail-client/dist/web/page/mails/mini-compose/MiniComposeBox","@social-mail/social-mail-client/dist/common/controls/audio/AudioRecorder","@web-atoms/web-controls/dist/mobile-app/BottomPopup","@web-atoms/web-controls/dist/animations/Animations","@social-mail/social-mail-client/dist/common/controls/audio/WebRTCService","@social-mail/social-mail-client/dist/common/controls/buttons/RoundButton","@web-atoms/web-controls/dist/html-editor/AtomHtmlEditor","@web-atoms/web-controls/dist/html-editor/commands/AttachFile","@social-mail/social-mail-client/dist/web/page/mails/mini-compose/Insert","@social-mail/social-mail-client/dist/web/page/mails/ChooseMailboxPage","@social-mail/social-mail-client/dist/common/pages/folders/ChooseTemplatePage","@web-atoms/web-controls/dist/basic/Resizable","@web-atoms/web-controls/dist/basic/ToggleButtonBar","@web-atoms/web-controls/dist/basic/styles/toggle-button-bar-style","@social-mail/social-mail-client/dist/web/page/mails/contact/AddMiniContactPage","@social-mail/social-mail-client/dist/web/page/channels/detail/ChannelDetailPage","@social-mail/social-mail-client/dist/web/page/channels/subscribers/ChannelSubscribersPage","@social-mail/social-mail-client/dist/web/page/channels/services/ChannelService","@social-mail/social-mail-client/dist/web/page/channels/subscribers/add/AddSubscriberPage","@social-mail/social-mail-client/dist/web/page/channels/subscribers/rights/UpdateRightsPage","@social-mail/social-mail-client/dist/common/pages/drives/DriveListPage","@social-mail/social-mail-client/dist/common/pages/websites/manage/ManageWebSitePage","@social-mail/social-mail-client/dist/services/websites/WebSiteService","@social-mail/social-mail-client/dist/common/pages/websites/studio/WebSiteStudioPage","@social-mail/social-mail-client/dist/common/pages/websites/templates/ChooseWebSiteTemplatePage","@social-mail/social-mail-client/dist/common/controls/tree/FileTreeView","@social-mail/social-mail-client/dist/site-editor/editor/WebSitePageEditor","@social-mail/social-mail-client/dist/site-editor/editor/HtmlPageEditor","@social-mail/social-mail-client/dist/site-editor/drag-drop/DragDropHelper","@social-mail/social-mail-client/dist/site-editor/commands/CodeCommand","@social-mail/social-mail-client/dist/site-editor/commands/EditorCommand","@social-mail/social-mail-client/dist/site-editor/toolbars/UndoRedoToolbar","@social-mail/social-mail-client/dist/site-editor/toolbars/EditorToolbar","@social-mail/social-mail-client/dist/site-editor/blocks/WrapGrid","@social-mail/social-mail-client/dist/site-editor/blocks/Block","@social-mail/social-mail-client/dist/site-editor/properties/Properties","@social-mail/social-mail-client/dist/site-editor/properties/groups/LayoutEditor","@social-mail/social-mail-client/dist/site-editor/properties/controls/PropertyEditor","@social-mail/social-mail-client/dist/site-editor/styler/StylerSet","@social-mail/social-mail-client/dist/site-editor/styler/Styler","@social-mail/social-mail-client/dist/site-editor/styler/properties/stylerBorder","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/display","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/flex/flex","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/items-position/itemsPosition","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/layout","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutTextBox","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutWrapList","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutImageBox","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutRightImageBox","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutColumn2Box","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutColumn","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutRow","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutBlock","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutNavBar","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutFloatingNavBar","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutColumn3Box","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutImageCard","@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutCard","@social-mail/social-mail-client/dist/site-editor/styler/properties/stylerPosition","@social-mail/social-mail-client/dist/site-editor/styler/properties/stylerSizes","@social-mail/social-mail-client/dist/site-editor/styler/properties/stylerSpace","@social-mail/social-mail-client/dist/site-editor/styler/properties/text/stylerText","@social-mail/social-mail-client/dist/site-editor/styler/properties/stylerBackground","@social-mail/social-mail-client/dist/site-editor/styler/properties/color-sets/stylerColorSets","@social-mail/social-mail-client/dist/site-editor/properties/groups/TextPropertyEditor","@social-mail/social-mail-client/dist/site-editor/properties/controls/SizeEditorControl","@social-mail/social-mail-client/dist/site-editor/properties/groups/BorderGroupEditor","@social-mail/social-mail-client/dist/site-editor/properties/groups/SizeGroupEditor","@social-mail/social-mail-client/dist/site-editor/properties/groups/SpaceGroupEditor","@social-mail/social-mail-client/dist/site-editor/properties/groups/PositionGroupEditor","@social-mail/social-mail-client/dist/site-editor/properties/groups/BackgroundGroupEditor","@social-mail/social-mail-client/dist/site-editor/editor/SelectedElement","@social-mail/social-mail-client/dist/site-editor/blocks/ImageBox","@social-mail/social-mail-client/dist/site-editor/blocks/defaultImage","@social-mail/social-mail-client/dist/site-editor/blocks/RowBox","@social-mail/social-mail-client/content/images/svg/html-editor/layouts/row.png","@social-mail/social-mail-client/dist/site-editor/blocks/ColumnBox","@social-mail/social-mail-client/content/images/svg/html-editor/layouts/column.png","@social-mail/social-mail-client/content/images/svg/html-editor/layouts/column-2.png","@social-mail/social-mail-client/content/images/svg/html-editor/layouts/column-3.png","@social-mail/social-mail-client/dist/site-editor/blocks/VerticalImageBox","@social-mail/social-mail-client/content/images/svg/html-editor/layouts/vertical-image-box.png","@social-mail/social-mail-client/dist/site-editor/blocks/Image","@social-mail/social-mail-client/dist/site-editor/blocks/ImageCard","@social-mail/social-mail-client/dist/site-editor/blocks/TextBox","@social-mail/social-mail-client/dist/site-editor/blocks/Card","@social-mail/social-mail-client/content/images/svg/html-editor/layouts/card.png","@social-mail/social-mail-client/dist/site-editor/blocks/List","@social-mail/social-mail-client/dist/web/page/files/media/ChooseMediaPage","@social-mail/social-mail-client/dist/common/pages/user/change-password/ChangePasswordPage","@social-mail/social-mail-client/dist/common/pages/user/services/UserService","@social-mail/social-mail-client/dist/common/pages/user/multi-factor/MultiFactorSetupPage","@social-mail/social-mail-client/dist/common/pages/websites/list/WebSiteListPage","@social-mail/social-mail-client/dist/common/pages/websites/edit/WebSiteFolderEditor","@social-mail/social-mail-client/dist/common/pages/mailboxes/MailboxDetailPage","@social-mail/social-mail-client/dist/common/pages/mailboxes/settings/EditSyncTargetPage","@social-mail/social-mail-client/dist/common/icons/Icons","@social-mail/social-mail-client/dist/common/pages/mailboxes/external-mailboxes/AddExternalMailboxPage","@social-mail/social-mail-client/dist/common/pages/mailboxes/services/ExternalMailboxService","@social-mail/social-mail-client/dist/admin/pages/relays/edit/EditRelayPage","@social-mail/social-mail-client/dist/admin/pages/repair/RepairPage","@social-mail/social-mail-client/dist/common/pages/user/login/LoginPage","@social-mail/social-mail-client/dist/admin/drawer/AdminDrawer","@social-mail/social-mail-client/dist/common/controls/menu/MenuItem","@social-mail/social-mail-client/dist/common/controls/ModuleInfo","@web-atoms/core/dist/web/WebApp","@web-atoms/core/dist/core/AtomOnce","@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/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"]);
 
 System.register([], function (_export, _context) {
   "use strict";
@@ -11750,7 +11750,7 @@ System.register(["@web-atoms/core/dist/core/types", "@web-atoms/core/dist/core/A
       _export("___UMD", ___UMD = UMD);
       addLinkTag("https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap");
       addLinkTag("https://npm-git.azureedge.net/npm/package/@c8private/fa-icons@6.5.1/css/all.min.css");
-      addLinkTag("https://cdn.jsdelivr.net/npm/file-icon-vectors@1.0.0/dist/file-icon-vivid.min.css");
+      addLinkTag("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0");
       styled.css`
 
 :root {
@@ -18018,183 +18018,329 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
 
     AmdLoader.instance.setup("@social-mail/social-mail-client/dist/admin/pages/domains/domain-user/DomainUserEditor");
 
-System.register(["tslib", "./http/JsonError"], function (_export, _context) {
+System.register(["tslib", "@web-atoms/core/dist/App", "@web-atoms/core/dist/core/types", "@web-atoms/core/dist/di/DISingleton", "@web-atoms/core/dist/di/Inject", "@web-atoms/core/dist/core/StringHelper", "@web-atoms/core/dist/style/styled", "@web-atoms/core/dist/web/services/PopupWindow", "@web-atoms/core/dist/core/InjectProperty", "@web-atoms/core/dist/core/XNode", "@web-atoms/web-controls/dist/basic/AtomRepeater", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/web/services/PopupService", "../../model/model", "@web-atoms/entity/dist/models/TaskManager", "../EntityService"], function (_export, _context) {
   "use strict";
 
-  var __awaiter, JsonError, FetchBuilder;
-  function buildUrl(strings, ...p) {
-    let r = "";
-    for (let index = 0; index < strings.length; index++) {
-      const element = strings[index];
-      r += element;
-      if (index < p.length) {
-        r += encodeURIComponent(p[index]);
-      }
-    }
-    return r;
-  }
-  _export({
-    buildUrl: buildUrl,
-    default: void 0
-  });
+  var __awaiter, __decorate, __metadata, App, CancelToken, DISingleton, Inject, StringHelper, styled, PopupWindow, InjectProperty, XNode, AtomRepeater, Bind, PopupService, AppFile, TaskManager, EntityService, FileUploadWindow, acceptDocumentAndMedia, LocalFileService;
   return {
     setters: [function (_tslib) {
       __awaiter = _tslib.__awaiter;
-    }, function (_httpJsonError) {
-      JsonError = _httpJsonError.default;
+      __decorate = _tslib.__decorate;
+      __metadata = _tslib.__metadata;
+    }, function (_webAtomsCoreDistApp) {
+      App = _webAtomsCoreDistApp.App;
+    }, function (_webAtomsCoreDistCoreTypes) {
+      CancelToken = _webAtomsCoreDistCoreTypes.CancelToken;
+    }, function (_webAtomsCoreDistDiDISingleton) {
+      DISingleton = _webAtomsCoreDistDiDISingleton.default;
+    }, function (_webAtomsCoreDistDiInject) {
+      Inject = _webAtomsCoreDistDiInject.Inject;
+    }, function (_webAtomsCoreDistCoreStringHelper) {
+      StringHelper = _webAtomsCoreDistCoreStringHelper.StringHelper;
+    }, function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_webAtomsCoreDistWebServicesPopupWindow) {
+      PopupWindow = _webAtomsCoreDistWebServicesPopupWindow.default;
+    }, function (_webAtomsCoreDistCoreInjectProperty) {
+      InjectProperty = _webAtomsCoreDistCoreInjectProperty.default;
+    }, function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_webAtomsWebControlsDistBasicAtomRepeater) {
+      AtomRepeater = _webAtomsWebControlsDistBasicAtomRepeater.default;
+    }, function (_webAtomsCoreDistCoreBind) {
+      Bind = _webAtomsCoreDistCoreBind.default;
+    }, function (_webAtomsCoreDistWebServicesPopupService) {
+      PopupService = _webAtomsCoreDistWebServicesPopupService.default;
+    }, function (_modelModel) {
+      AppFile = _modelModel.AppFile;
+    }, function (_webAtomsEntityDistModelsTaskManager) {
+      TaskManager = _webAtomsEntityDistModelsTaskManager.default;
+    }, function (_EntityService) {
+      EntityService = _EntityService.default;
     }],
     execute: function () {
-      _export("default", FetchBuilder = class FetchBuilder {
-        static get(url) {
-          return this.method(url, "GET");
-        }
-        static put(url) {
-          return this.method(url, "PUT");
-        }
-        static post(url) {
-          return this.method(url, "POST");
-        }
-        static delete(url) {
-          return this.method(url, "DELETE");
-        }
-        static method(url, method) {
-          return new FetchBuilder({
-            url,
-            method
-          });
-        }
-        constructor(request) {
-          this.request = request;
-        }
-        cancelToken(cancelToken) {
-          const ac = new AbortController();
-          cancelToken.registerForCancel(() => ac.abort());
-          return this.signal(ac.signal);
-        }
-        signal(signal) {
-          return this.append({
-            signal
-          });
-        }
-        form(name, value, fileName) {
-          var _a;
-          const body = (_a = this.request.body) !== null && _a !== void 0 ? _a : new FormData();
-          if (fileName) {
-            if (typeof value === "string") {
-              throw new Error("value must be a blob with content type set correctly.");
-            }
-            body.append(name, value, fileName);
-          } else {
-            body.append(name, value);
-          }
-          return this.append({
-            body
-          });
-        }
-        jsonBody(body, encode = true) {
-          var _a;
-          if (encode) {
-            body = JSON.stringify(body);
-          }
-          const headers = (_a = this.request.headers) !== null && _a !== void 0 ? _a : {};
-          headers["content-type"] = "application/json";
-          return this.append({
-            body,
-            headers
-          });
+      _export("acceptDocumentAndMedia", acceptDocumentAndMedia = ".doc, .docx, application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document, video/*, application/pdf, .pdf, .txt, audio/*, image/*, .csv, text/csv, application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, text/plain, text/html");
+      styled.css`
+        display: inline-grid;
+        grid-template-rows: auto auto auto;
+
+        & > [data-element=file-name] {
+            grid-row: 1;
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
         }
-        header(name, value) {
-          var _a;
-          const headers = (_a = this.request.headers) !== null && _a !== void 0 ? _a : {};
-          headers[name] = value;
-          return this.append({
-            headers
-          });
+
+        & > progress {
+            grid-row: 2;
+            width: 100%;
         }
-        path(name, value, encode = true) {
-          let url = this.request.url;
-          if (encode) {
-            value = encodeURIComponent(value);
-          }
-          url = url.replace(name, value);
-          return this.append({
-            url
-          });
+        & > [data-element=error] {
+            grid-row: 3;
+            width: 100%;
         }
-        query(name, value, encode = true) {
-          let url = this.request.url;
-          if (encode) {
-            value = encodeURIComponent(value);
-          }
-          name = encodeURIComponent(name);
-          if (url.indexOf("?") === -1) {
-            url += `?${name}=${value}`;
-          } else {
-            url += `&${name}=${value}`;
-          }
-          return this.append({
-            url
+
+    `.installGlobal("[data-attachment-file]");
+      LocalFileService = class LocalFileService extends TaskManager {
+        constructor() {
+          super();
+          document.body.addEventListener("uploadRequested", ce => {
+            const {
+              target,
+              detail: {
+                files,
+                extra,
+                uploadEvent
+              }
+            } = ce;
+            ce.preventDefault();
+            this.app.runAsync(() => __awaiter(this, void 0, void 0, function* () {
+              const detail = yield FileUploadWindow.showModal({
+                parameters: {
+                  files,
+                  extra
+                }
+              });
+              target.dispatchEvent(new CustomEvent(StringHelper.fromHyphenToCamel(uploadEvent), {
+                detail,
+                bubbles: true
+              }));
+            }));
           });
         }
-        responseAsText(ensureSuccess = true) {
+        uploadWithProgress(files, extra) {
           return __awaiter(this, void 0, void 0, function* () {
-            const r = yield this.response();
-            if (ensureSuccess) {
-              yield this.ensureSuccess(r);
-            }
-            return yield r.text();
+            const detail = yield FileUploadWindow.showModal({
+              parameters: {
+                files,
+                extra
+              }
+            });
+            return detail.files;
           });
         }
-        responseAsBlob(ensureSuccess = true) {
+        sha256(blob) {
           return __awaiter(this, void 0, void 0, function* () {
-            const r = yield this.response();
-            if (ensureSuccess) {
-              yield this.ensureSuccess(r);
-            }
-            return yield r.blob();
+            const msgBuffer = yield blob.arrayBuffer();
+            const hashBuffer = yield crypto.subtle.digest('SHA-256', msgBuffer);
+            const hashArray = Array.from(new Uint8Array(hashBuffer));
+            const hashHex = hashArray.map(b => b.toString(16).padStart(2, '0')).join('');
+            return hashHex;
           });
         }
-        responseAsJson(ensureSuccess = true) {
+        uploadFile(file, extra, ct, progress) {
           return __awaiter(this, void 0, void 0, function* () {
-            const r = yield this.response();
-            if (ensureSuccess) {
-              yield this.ensureSuccess(r);
+            const sha256 = yield this.sha256(file);
+            if (typeof extra === "string") {
+              extra = JSON.parse(extra);
             }
-            return yield r.json();
+            if (extra.parentID) {
+              const existing = yield this.entityService.query(AppFile, "children", extra.parentID, file.name, sha256).firstOrDefault();
+              if (existing) {
+                const {
+                  appFileID,
+                  url
+                } = existing;
+                return {
+                  appFileID,
+                  file,
+                  url
+                };
+              }
+            }
+            return new Promise((resolve, reject) => {
+              const body = new FormData();
+              body.append(file.name, file, file.name);
+              body.append("sha256", sha256);
+              const xhr = new XMLHttpRequest();
+              const onError = () => {
+                reject(new Error(xhr.responseText || "Error"));
+              };
+              ct === null || ct === void 0 ? void 0 : ct.registerForCancel(() => xhr.abort());
+              xhr.upload.addEventListener("progress", event => {
+                if (event.lengthComputable) {
+                  progress === null || progress === void 0 ? void 0 : progress(event.loaded / event.total);
+                }
+              });
+              xhr.upload.addEventListener("timeout", onError);
+              xhr.upload.addEventListener("error", onError);
+              xhr.upload.addEventListener("abort", onError);
+              xhr.addEventListener("timeout", onError);
+              xhr.addEventListener("abort", onError);
+              xhr.addEventListener("error", onError);
+              xhr.upload.addEventListener("progress", event => {
+                if (event.lengthComputable) {
+                  progress === null || progress === void 0 ? void 0 : progress(event.loaded / event.total);
+                }
+              });
+              xhr.addEventListener("load", () => {
+                if (xhr.status <= 300) {
+                  const r = Object.assign(Object.assign({}, JSON.parse(xhr.responseText)), {
+                    file
+                  });
+                  resolve(r);
+                }
+              });
+              let postUrl = "/api/upload";
+              const s = new URLSearchParams();
+              if (extra) {
+                for (const key in extra) {
+                  if (Object.prototype.hasOwnProperty.call(extra, key)) {
+                    const element = extra[key];
+                    if (element) {
+                      s.append(key, element);
+                    }
+                  }
+                }
+              }
+              if (file.webkitRelativePath) {
+                const folders = file.webkitRelativePath.split("/");
+                folders.pop();
+                if (folders.length) {
+                  const folder = folders.join("/");
+                  s.append("folder", folder);
+                }
+              }
+              postUrl += "?" + s.toString();
+              xhr.open("POST", postUrl, true);
+              xhr.send(body);
+            });
           });
         }
-        response() {
-          return fetch(this.request.url, this.request);
+        upload(files, extra, ct) {
+          const tasks = [];
+          const upload = {
+            total: 0,
+            tasks,
+            progress: 0,
+            error: ""
+          };
+          for (const file of files) {
+            upload.total += file.size;
+            const uploadFile = {
+              name: file.name,
+              error: "",
+              progress: 0
+            };
+            uploadFile.promise = this.run(() => __awaiter(this, void 0, void 0, function* () {
+              var _a, _b;
+              let lastError;
+              for (let i = 0; i < 3; i++) {
+                try {
+                  uploadFile.progress = 0.01;
+                  const r = yield this.uploadFile(file, extra, ct, n => uploadFile.progress = n);
+                  upload.progress += r.file.size;
+                  setTimeout(() => tasks.remove(uploadFile), 500);
+                  upload.error = "";
+                  lastError = null;
+                  return r;
+                } catch (error) {
+                  lastError = `${(_a = file.webkitRelativePath) !== null && _a !== void 0 ? _a : ""}/${file.name} failed to upload.\n${(_b = error.stack) !== null && _b !== void 0 ? _b : error}`;
+                  uploadFile.error = lastError;
+                }
+              }
+              if (lastError) {
+                upload.error += "\n" + lastError;
+              }
+            }));
+            tasks.push(uploadFile);
+          }
+          return upload;
         }
-        ensureSuccess(r) {
+      };
+      __decorate([Inject, __metadata("design:type", App)], LocalFileService.prototype, "app", void 0);
+      __decorate([Inject, __metadata("design:type", EntityService)], LocalFileService.prototype, "entityService", void 0);
+      LocalFileService = __decorate([DISingleton(), __metadata("design:paramtypes", [])], LocalFileService);
+      _export("default", LocalFileService);
+      FileUploadWindow = class FileUploadWindow extends PopupWindow {
+        constructor() {
+          super(...arguments);
+          this.parameters = {};
+        }
+        init() {
           return __awaiter(this, void 0, void 0, function* () {
-            if (r.status <= 300) {
-              return;
-            }
-            const type = r.headers.get("content-type");
-            if (/\/json/i.test(type)) {
-              const json = yield r.json();
-              throw new JsonError(`Failed for ${this.request.url}`, json);
+            this.title = "Uploading...";
+            this.closeWarning = "Are you sure you want to cancel the upload?";
+            this.bindEvent(window, "backButton", e => __awaiter(this, void 0, void 0, function* () {
+              var _a;
+              e.preventDefault();
+              (_a = e.stopImmediatePropagation) === null || _a === void 0 ? void 0 : _a.call(e);
+              e.stopPropagation();
+              yield this.requestCancel();
+            }), null, {
+              capture: true
+            });
+            const task = this.localFileService.upload(this.parameters.files, this.parameters.extra, this.cancelToken);
+            this.files = task.tasks;
+            this.footerRenderer = () => XNode.create("div", {
+              "data-layout": "command-row"
+            }, XNode.create("progress", {
+              min: 0,
+              max: task.total,
+              value: Bind.source(task, x => x.source.progress)
+            }));
+            this.render(XNode.create("div", {
+              "data-overflow": "auto",
+              "style-max-height": "500px",
+              "style-max-width": "400px"
+            }, XNode.create(AtomRepeater, {
+              "data-layout": "vertical-flex-stretch-items",
+              items: this.files,
+              itemRenderer: file => XNode.create("div", {
+                "data-attachment-file": "file"
+              }, XNode.create("div", {
+                "data-element": "file-name",
+                text: file.name
+              }), XNode.create("progress", {
+                "style-display": Bind.source(file, x => x.source.progress > 0),
+                min: 0,
+                max: 1,
+                value: Bind.source(file, x => x.source.progress)
+              }), XNode.create("div", {
+                "data-element": "error",
+                "data-color": "red",
+                text: Bind.source(file, x => x.source.error)
+              }))
+            })));
+            try {
+              const ct = new CancelToken();
+              this.registerDisposable({
+                dispose: () => {
+                  ct.cancel();
+                }
+              });
+              const tasks = this.files.map(x => x.promise);
+              const files = yield Promise.all(tasks);
+              const extra = this.parameters.extra;
+              this.close({
+                files,
+                extra
+              });
+            } catch (error) {
+              if (CancelToken.isCancelled(error)) {
+                this.cancel(error);
+                return;
+              }
+              yield PopupService.alert({
+                message: error
+              });
+              this.cancel(error);
             }
-            const text = yield r.text();
-            throw new Error(`Failed for ${this.request.url}\n${text}`);
           });
         }
-        append(r) {
-          return new FetchBuilder(Object.assign(Object.assign({}, this.request), r));
-        }
-      });
+      };
+      __decorate([InjectProperty, __metadata("design:type", LocalFileService)], FileUploadWindow.prototype, "localFileService", void 0);
     }
   };
 });
-//# sourceMappingURL=FetchBuilder.js.map
+//# sourceMappingURL=LocalFileService.js.map
 
-    AmdLoader.instance.setup("@web-atoms/core/dist/services/FetchBuilder");
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/services/files/LocalFileService");
 
-System.register(["tslib", "@web-atoms/core/dist/di/DISingleton", "@web-atoms/core/dist/di/Inject", "../../../../services/EntityService", "../../../../model/model", "@web-atoms/date-time/dist/DateTime", "../../../../common/Sql", "../../../../common/SocialMailApp", "@web-atoms/core/dist/services/FetchBuilder"], function (_export, _context) {
+System.register(["tslib", "@web-atoms/core/dist/di/DISingleton", "@web-atoms/core/dist/di/Inject", "../../../../services/EntityService", "../../../../model/model", "@web-atoms/date-time/dist/DateTime", "../../../../common/Sql", "../../../../common/SocialMailApp", "../../../../services/files/LocalFileService"], function (_export, _context) {
   "use strict";
 
-  var __awaiter, __decorate, __metadata, DISingleton, Inject, EntityService, AppFile, User, DateTime, Sql, SocialMailApp, FetchBuilder, hideActivityIndicator, CloudFileService;
+  var __awaiter, __decorate, __metadata, DISingleton, Inject, EntityService, AppFile, User, DateTime, Sql, SocialMailApp, LocalFileService, hideActivityIndicator, CloudFileService;
   return {
     setters: [function (_tslib) {
       __awaiter = _tslib.__awaiter;
@@ -18215,8 +18361,8 @@ System.register(["tslib", "@web-atoms/core/dist/di/DISingleton", "@web-atoms/cor
       Sql = _commonSql.Sql;
     }, function (_commonSocialMailApp) {
       SocialMailApp = _commonSocialMailApp.default;
-    }, function (_webAtomsCoreDistServicesFetchBuilder) {
-      FetchBuilder = _webAtomsCoreDistServicesFetchBuilder.default;
+    }, function (_servicesFilesLocalFileService) {
+      LocalFileService = _servicesFilesLocalFileService.default;
     }],
     execute: function () {
       hideActivityIndicator = true;
@@ -18372,7 +18518,7 @@ System.register(["tslib", "@web-atoms/core/dist/di/DISingleton", "@web-atoms/cor
           showDeleted = false,
           showFolder = true
         }) {
-          var _a;
+          var _a, _b;
           return __awaiter(this, void 0, void 0, function* () {
             const parentID = folder === null || folder === void 0 ? void 0 : folder.appFileID;
             if (!parentID) {
@@ -18407,6 +18553,12 @@ System.register(["tslib", "@web-atoms/core/dist/di/DISingleton", "@web-atoms/cor
             const results = [];
             for (const iterator of files) {
               if (!iterator.isFolder) {
+                if (accept && iterator.parentID === folder.appFileID) {
+                  const children = (_a = folder.children) !== null && _a !== void 0 ? _a : folder.children = [];
+                  if (!children.some(f => f.appFileID === iterator.appFileID)) {
+                    children.add(iterator);
+                  }
+                }
                 results.push(iterator);
                 continue;
               }
@@ -18416,13 +18568,16 @@ System.register(["tslib", "@web-atoms/core/dist/di/DISingleton", "@web-atoms/cor
                 fx.fileSize = iterator.fileSize;
                 continue;
               }
-              (_a = iterator.children) !== null && _a !== void 0 ? _a : iterator.children = [];
+              (_b = iterator.children) !== null && _b !== void 0 ? _b : iterator.children = [];
               folder.children.add(iterator);
               results.push(iterator);
             }
             return results;
           });
         }
+        children(parentID, name, sha256) {
+          return this.entityService.query(AppFile, "children", parentID, name, sha256);
+        }
         saveFile(fm) {
           return __awaiter(this, void 0, void 0, function* () {
             const {
@@ -18430,15 +18585,10 @@ System.register(["tslib", "@web-atoms/core/dist/di/DISingleton", "@web-atoms/cor
               content,
               parentID
             } = fm;
-            const sp = new URLSearchParams();
-            if (appFileID) {
-              sp.append("appFileID", appFileID);
-            }
-            if (parentID) {
-              sp.append("parentID", parentID);
-            }
-            const url = `/api/upload?${sp.toString()}`;
-            return FetchBuilder.post(url).form("file", content, content.name).responseAsJson();
+            return this.localFileService.uploadFile(content, {
+              appFileID,
+              parentID
+            });
           });
         }
         save(file) {
@@ -18450,6 +18600,7 @@ System.register(["tslib", "@web-atoms/core/dist/di/DISingleton", "@web-atoms/cor
         }
       };
       __decorate([Inject, __metadata("design:type", EntityService)], CloudFileService.prototype, "entityService", void 0);
+      __decorate([Inject, __metadata("design:type", LocalFileService)], CloudFileService.prototype, "localFileService", void 0);
       CloudFileService = __decorate([DISingleton()], CloudFileService);
       _export("default", CloudFileService);
     }
@@ -24486,309 +24637,6 @@ System.register(["tslib", "@web-atoms/core/dist/App", "@web-atoms/core/dist/core
 
     AmdLoader.instance.setup("@web-atoms/web-controls/dist/basic/UploadEvent");
 
-System.register(["tslib", "@web-atoms/core/dist/App", "@web-atoms/core/dist/core/types", "@web-atoms/core/dist/di/DISingleton", "@web-atoms/core/dist/di/Inject", "@web-atoms/core/dist/core/StringHelper", "@web-atoms/core/dist/style/styled", "@web-atoms/core/dist/web/services/PopupWindow", "@web-atoms/core/dist/core/InjectProperty", "@web-atoms/core/dist/core/XNode", "@web-atoms/web-controls/dist/basic/AtomRepeater", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/web/services/PopupService", "@web-atoms/entity/dist/models/TaskManager"], function (_export, _context) {
-  "use strict";
-
-  var __awaiter, __decorate, __metadata, App, CancelToken, DISingleton, Inject, StringHelper, styled, PopupWindow, InjectProperty, XNode, AtomRepeater, Bind, PopupService, TaskManager, FileUploadWindow, acceptDocumentAndMedia, LocalFileService;
-  return {
-    setters: [function (_tslib) {
-      __awaiter = _tslib.__awaiter;
-      __decorate = _tslib.__decorate;
-      __metadata = _tslib.__metadata;
-    }, function (_webAtomsCoreDistApp) {
-      App = _webAtomsCoreDistApp.App;
-    }, function (_webAtomsCoreDistCoreTypes) {
-      CancelToken = _webAtomsCoreDistCoreTypes.CancelToken;
-    }, function (_webAtomsCoreDistDiDISingleton) {
-      DISingleton = _webAtomsCoreDistDiDISingleton.default;
-    }, function (_webAtomsCoreDistDiInject) {
-      Inject = _webAtomsCoreDistDiInject.Inject;
-    }, function (_webAtomsCoreDistCoreStringHelper) {
-      StringHelper = _webAtomsCoreDistCoreStringHelper.StringHelper;
-    }, function (_webAtomsCoreDistStyleStyled) {
-      styled = _webAtomsCoreDistStyleStyled.default;
-    }, function (_webAtomsCoreDistWebServicesPopupWindow) {
-      PopupWindow = _webAtomsCoreDistWebServicesPopupWindow.default;
-    }, function (_webAtomsCoreDistCoreInjectProperty) {
-      InjectProperty = _webAtomsCoreDistCoreInjectProperty.default;
-    }, function (_webAtomsCoreDistCoreXNode) {
-      XNode = _webAtomsCoreDistCoreXNode.default;
-    }, function (_webAtomsWebControlsDistBasicAtomRepeater) {
-      AtomRepeater = _webAtomsWebControlsDistBasicAtomRepeater.default;
-    }, function (_webAtomsCoreDistCoreBind) {
-      Bind = _webAtomsCoreDistCoreBind.default;
-    }, function (_webAtomsCoreDistWebServicesPopupService) {
-      PopupService = _webAtomsCoreDistWebServicesPopupService.default;
-    }, function (_webAtomsEntityDistModelsTaskManager) {
-      TaskManager = _webAtomsEntityDistModelsTaskManager.default;
-    }],
-    execute: function () {
-      _export("acceptDocumentAndMedia", acceptDocumentAndMedia = ".doc, .docx, application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document, video/*, application/pdf, .pdf, .txt, audio/*, image/*, .csv, text/csv, application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, text/plain, text/html");
-      styled.css`
-        display: inline-grid;
-        grid-template-rows: auto auto auto;
-
-        & > [data-element=file-name] {
-            grid-row: 1;
-            overflow: hidden;
-            white-space: nowrap;
-            text-overflow: ellipsis;
-        }
-
-        & > progress {
-            grid-row: 2;
-            width: 100%;
-        }
-        & > [data-element=error] {
-            grid-row: 3;
-            width: 100%;
-        }
-
-    `.installGlobal("[data-attachment-file]");
-      LocalFileService = class LocalFileService extends TaskManager {
-        constructor() {
-          super();
-          document.body.addEventListener("uploadRequested", ce => {
-            const {
-              target,
-              detail: {
-                files,
-                extra,
-                uploadEvent
-              }
-            } = ce;
-            ce.preventDefault();
-            this.app.runAsync(() => __awaiter(this, void 0, void 0, function* () {
-              const detail = yield FileUploadWindow.showModal({
-                parameters: {
-                  files,
-                  extra
-                }
-              });
-              target.dispatchEvent(new CustomEvent(StringHelper.fromHyphenToCamel(uploadEvent), {
-                detail,
-                bubbles: true
-              }));
-            }));
-          });
-        }
-        uploadWithProgress(files, extra) {
-          return __awaiter(this, void 0, void 0, function* () {
-            const detail = yield FileUploadWindow.showModal({
-              parameters: {
-                files,
-                extra
-              }
-            });
-            return detail.files;
-          });
-        }
-        sha256(blob) {
-          return __awaiter(this, void 0, void 0, function* () {
-            const msgBuffer = yield blob.arrayBuffer();
-            const hashBuffer = yield crypto.subtle.digest('SHA-256', msgBuffer);
-            const hashArray = Array.from(new Uint8Array(hashBuffer));
-            const hashHex = hashArray.map(b => b.toString(16).padStart(2, '0')).join('');
-            return hashHex;
-          });
-        }
-        uploadFile(file, extra, ct, progress) {
-          return __awaiter(this, void 0, void 0, function* () {
-            const sha256 = yield this.sha256(file);
-            return new Promise((resolve, reject) => {
-              const body = new FormData();
-              body.append(file.name, file, file.name);
-              body.append("sha256", sha256);
-              const xhr = new XMLHttpRequest();
-              const onError = () => {
-                reject(new Error(xhr.responseText || "Error"));
-              };
-              ct === null || ct === void 0 ? void 0 : ct.registerForCancel(() => xhr.abort());
-              xhr.upload.addEventListener("progress", event => {
-                if (event.lengthComputable) {
-                  progress === null || progress === void 0 ? void 0 : progress(event.loaded / event.total);
-                }
-              });
-              xhr.upload.addEventListener("timeout", onError);
-              xhr.upload.addEventListener("error", onError);
-              xhr.upload.addEventListener("abort", onError);
-              xhr.addEventListener("timeout", onError);
-              xhr.addEventListener("abort", onError);
-              xhr.addEventListener("error", onError);
-              xhr.upload.addEventListener("progress", event => {
-                if (event.lengthComputable) {
-                  progress === null || progress === void 0 ? void 0 : progress(event.loaded / event.total);
-                }
-              });
-              xhr.addEventListener("load", () => {
-                if (xhr.status <= 300) {
-                  const r = Object.assign(Object.assign({}, JSON.parse(xhr.responseText)), {
-                    file
-                  });
-                  resolve(r);
-                }
-              });
-              let postUrl = "/api/upload";
-              const s = new URLSearchParams();
-              if (extra) {
-                if (typeof extra === "string") {
-                  extra = JSON.parse(extra);
-                }
-                for (const key in extra) {
-                  if (Object.prototype.hasOwnProperty.call(extra, key)) {
-                    const element = extra[key];
-                    if (element) {
-                      s.append(key, element);
-                    }
-                  }
-                }
-              }
-              if (file.webkitRelativePath) {
-                const folders = file.webkitRelativePath.split("/");
-                folders.pop();
-                if (folders.length) {
-                  const folder = folders.join("/");
-                  s.append("folder", folder);
-                }
-              }
-              postUrl += "?" + s.toString();
-              xhr.open("POST", postUrl, true);
-              xhr.send(body);
-            });
-          });
-        }
-        upload(files, extra, ct) {
-          const {
-            parentID
-          } = extra;
-          const tasks = [];
-          const upload = {
-            total: 0,
-            tasks,
-            progress: 0,
-            error: ""
-          };
-          for (const file of files) {
-            upload.total += file.size;
-            const uploadFile = {
-              name: file.name,
-              error: "",
-              progress: 0
-            };
-            uploadFile.promise = this.run(() => __awaiter(this, void 0, void 0, function* () {
-              var _a, _b;
-              let lastError;
-              for (let i = 0; i < 3; i++) {
-                try {
-                  uploadFile.progress = 0.01;
-                  const r = yield this.uploadFile(file, extra, ct, n => uploadFile.progress = n);
-                  upload.progress += r.file.size;
-                  setTimeout(() => tasks.remove(uploadFile), 500);
-                  upload.error = "";
-                  lastError = null;
-                  return r;
-                } catch (error) {
-                  lastError = `${(_a = file.webkitRelativePath) !== null && _a !== void 0 ? _a : ""}/${file.name} failed to upload.\n${(_b = error.stack) !== null && _b !== void 0 ? _b : error}`;
-                  uploadFile.error = lastError;
-                }
-              }
-              if (lastError) {
-                upload.error += "\n" + lastError;
-              }
-            }));
-            tasks.push(uploadFile);
-          }
-          return upload;
-        }
-      };
-      __decorate([Inject, __metadata("design:type", App)], LocalFileService.prototype, "app", void 0);
-      LocalFileService = __decorate([DISingleton(), __metadata("design:paramtypes", [])], LocalFileService);
-      _export("default", LocalFileService);
-      FileUploadWindow = class FileUploadWindow extends PopupWindow {
-        constructor() {
-          super(...arguments);
-          this.parameters = {};
-        }
-        init() {
-          return __awaiter(this, void 0, void 0, function* () {
-            this.title = "Uploading...";
-            this.closeWarning = "Are you sure you want to cancel the upload?";
-            this.bindEvent(window, "backButton", e => __awaiter(this, void 0, void 0, function* () {
-              var _a;
-              e.preventDefault();
-              (_a = e.stopImmediatePropagation) === null || _a === void 0 ? void 0 : _a.call(e);
-              e.stopPropagation();
-              yield this.requestCancel();
-            }), null, {
-              capture: true
-            });
-            const task = this.localFileService.upload(this.parameters.files, this.parameters.extra, this.cancelToken);
-            this.files = task.tasks;
-            this.footerRenderer = () => XNode.create("div", {
-              "data-layout": "command-row"
-            }, XNode.create("progress", {
-              min: 0,
-              max: task.total,
-              value: Bind.source(task, x => x.source.progress)
-            }));
-            this.render(XNode.create("div", {
-              "data-overflow": "auto",
-              "style-max-height": "500px",
-              "style-max-width": "400px"
-            }, XNode.create(AtomRepeater, {
-              "data-layout": "vertical-flex-stretch-items",
-              items: this.files,
-              itemRenderer: file => XNode.create("div", {
-                "data-attachment-file": "file"
-              }, XNode.create("div", {
-                "data-element": "file-name",
-                text: file.name
-              }), XNode.create("progress", {
-                "style-display": Bind.source(file, x => x.source.progress > 0),
-                min: 0,
-                max: 1,
-                value: Bind.source(file, x => x.source.progress)
-              }), XNode.create("div", {
-                "data-element": "error",
-                "data-color": "red",
-                text: Bind.source(file, x => x.source.error)
-              }))
-            })));
-            try {
-              const ct = new CancelToken();
-              this.registerDisposable({
-                dispose: () => {
-                  ct.cancel();
-                }
-              });
-              const tasks = this.files.map(x => x.promise);
-              const files = yield Promise.all(tasks);
-              const extra = this.parameters.extra;
-              this.close({
-                files,
-                extra
-              });
-            } catch (error) {
-              if (CancelToken.isCancelled(error)) {
-                this.cancel(error);
-                return;
-              }
-              yield PopupService.alert({
-                message: error
-              });
-              this.cancel(error);
-            }
-          });
-        }
-      };
-      __decorate([InjectProperty, __metadata("design:type", LocalFileService)], FileUploadWindow.prototype, "localFileService", void 0);
-    }
-  };
-});
-//# sourceMappingURL=LocalFileService.js.map
-
-    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/services/files/LocalFileService");
-
 System.register(["tslib", "@web-atoms/core/dist/core/XNode", "@web-atoms/web-controls/dist/html-editor/InlineHtmlEditor", "@web-atoms/web-controls/dist/html-editor/commands/Toolbar", "@web-atoms/web-controls/dist/html-editor/commands/Bold", "@web-atoms/web-controls/dist/html-editor/commands/Italic", "@web-atoms/web-controls/dist/html-editor/commands/Underline", "@web-atoms/web-controls/dist/html-editor/commands/StrikeThrough", "@web-atoms/web-controls/dist/html-editor/commands/Align", "@web-atoms/web-controls/dist/html-editor/commands/HorizontalRule", "@web-atoms/web-controls/dist/html-editor/commands/Separator", "@web-atoms/web-controls/dist/html-editor/commands/Headings", "@web-atoms/web-controls/dist/html-editor/commands/ChangeColor", "@web-atoms/web-controls/dist/html-editor/commands/ChangeFont", "@web-atoms/web-controls/dist/html-editor/commands/ChangeFontSize", "@web-atoms/web-controls/dist/html-editor/commands/NumberedList", "@web-atoms/web-controls/dist/html-editor/commands/UnorderedList", "@web-atoms/web-controls/dist/html-editor/commands/IndentLess", "@web-atoms/web-controls/dist/html-editor/commands/IndentMore", "@web-atoms/web-controls/dist/html-editor/commands/AddLink", "@web-atoms/web-controls/dist/html-editor/commands/Unlink", "@web-atoms/web-controls/dist/html-editor/commands/RemoveFormat", "@web-atoms/web-controls/dist/html-editor/commands/Source", "@web-atoms/web-controls/dist/basic/UploadEvent", "../../../services/files/LocalFileService", "@web-atoms/core/dist/web/controls/AtomControl", "@web-atoms/core/dist/core/InjectProperty", "@web-atoms/core/dist/core/StringHelper", "@web-atoms/core/dist/style/styled"], function (_export, _context) {
   "use strict";
 
@@ -30429,6 +30277,179 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
 
     AmdLoader.instance.setup("@social-mail/social-mail-client/dist/web/page/files/preview/image/PreviewImage");
 
+System.register(["tslib", "./http/JsonError"], function (_export, _context) {
+  "use strict";
+
+  var __awaiter, JsonError, FetchBuilder;
+  function buildUrl(strings, ...p) {
+    let r = "";
+    for (let index = 0; index < strings.length; index++) {
+      const element = strings[index];
+      r += element;
+      if (index < p.length) {
+        r += encodeURIComponent(p[index]);
+      }
+    }
+    return r;
+  }
+  _export({
+    buildUrl: buildUrl,
+    default: void 0
+  });
+  return {
+    setters: [function (_tslib) {
+      __awaiter = _tslib.__awaiter;
+    }, function (_httpJsonError) {
+      JsonError = _httpJsonError.default;
+    }],
+    execute: function () {
+      _export("default", FetchBuilder = class FetchBuilder {
+        static get(url) {
+          return this.method(url, "GET");
+        }
+        static put(url) {
+          return this.method(url, "PUT");
+        }
+        static post(url) {
+          return this.method(url, "POST");
+        }
+        static delete(url) {
+          return this.method(url, "DELETE");
+        }
+        static method(url, method) {
+          return new FetchBuilder({
+            url,
+            method
+          });
+        }
+        constructor(request) {
+          this.request = request;
+        }
+        cancelToken(cancelToken) {
+          const ac = new AbortController();
+          cancelToken.registerForCancel(() => ac.abort());
+          return this.signal(ac.signal);
+        }
+        signal(signal) {
+          return this.append({
+            signal
+          });
+        }
+        form(name, value, fileName) {
+          var _a;
+          const body = (_a = this.request.body) !== null && _a !== void 0 ? _a : new FormData();
+          if (fileName) {
+            if (typeof value === "string") {
+              throw new Error("value must be a blob with content type set correctly.");
+            }
+            body.append(name, value, fileName);
+          } else {
+            body.append(name, value);
+          }
+          return this.append({
+            body
+          });
+        }
+        jsonBody(body, encode = true) {
+          var _a;
+          if (encode) {
+            body = JSON.stringify(body);
+          }
+          const headers = (_a = this.request.headers) !== null && _a !== void 0 ? _a : {};
+          headers["content-type"] = "application/json";
+          return this.append({
+            body,
+            headers
+          });
+        }
+        header(name, value) {
+          var _a;
+          const headers = (_a = this.request.headers) !== null && _a !== void 0 ? _a : {};
+          headers[name] = value;
+          return this.append({
+            headers
+          });
+        }
+        path(name, value, encode = true) {
+          let url = this.request.url;
+          if (encode) {
+            value = encodeURIComponent(value);
+          }
+          url = url.replace(name, value);
+          return this.append({
+            url
+          });
+        }
+        query(name, value, encode = true) {
+          let url = this.request.url;
+          if (encode) {
+            value = encodeURIComponent(value);
+          }
+          name = encodeURIComponent(name);
+          if (url.indexOf("?") === -1) {
+            url += `?${name}=${value}`;
+          } else {
+            url += `&${name}=${value}`;
+          }
+          return this.append({
+            url
+          });
+        }
+        responseAsText(ensureSuccess = true) {
+          return __awaiter(this, void 0, void 0, function* () {
+            const r = yield this.response();
+            if (ensureSuccess) {
+              yield this.ensureSuccess(r);
+            }
+            return yield r.text();
+          });
+        }
+        responseAsBlob(ensureSuccess = true) {
+          return __awaiter(this, void 0, void 0, function* () {
+            const r = yield this.response();
+            if (ensureSuccess) {
+              yield this.ensureSuccess(r);
+            }
+            return yield r.blob();
+          });
+        }
+        responseAsJson(ensureSuccess = true) {
+          return __awaiter(this, void 0, void 0, function* () {
+            const r = yield this.response();
+            if (ensureSuccess) {
+              yield this.ensureSuccess(r);
+            }
+            return yield r.json();
+          });
+        }
+        response() {
+          return fetch(this.request.url, this.request);
+        }
+        ensureSuccess(r) {
+          return __awaiter(this, void 0, void 0, function* () {
+            if (r.status <= 300) {
+              return;
+            }
+            const type = r.headers.get("content-type");
+            if (/\/json/i.test(type)) {
+              const json = yield r.json();
+              throw new JsonError(`Failed for ${this.request.url}`, json);
+            }
+            const text = yield r.text();
+            throw new Error(`Failed for ${this.request.url}\n${text}`);
+          });
+        }
+        append(r) {
+          return new FetchBuilder(Object.assign(Object.assign({}, this.request), r));
+        }
+      });
+    }
+  };
+});
+//# sourceMappingURL=FetchBuilder.js.map
+
+    AmdLoader.instance.setup("@web-atoms/core/dist/services/FetchBuilder");
+
 System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "@web-atoms/core/dist/services/FetchBuilder", "@web-atoms/core/dist/core/XNode", "../../../../../common/controls/buttons/IconButton", "@web-atoms/core/dist/web/controls/AtomControl"], function (_export, _context) {
   "use strict";
 
@@ -34856,7 +34877,7 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
           return __awaiter(this, void 0, void 0, function* () {
             this.renderer = XNode.create("div", null, XNode.create("button", {
               "data-click-event": "create-template",
-              text: "Create"
+              text: "Create From Template"
             }));
           });
         }
@@ -35106,83 +35127,6 @@ System.register(["tslib", "@web-atoms/core/dist/core/XNode", "./TreeView", "@web
 
     AmdLoader.instance.setup("@social-mail/social-mail-client/dist/common/controls/tree/FileTreeView");
 
-System.register(["@web-atoms/core/dist/core/XNode", "@web-atoms/core/dist/web/controls/AtomControl", "@web-atoms/core/dist/style/styled"], function (_export, _context) {
-  "use strict";
-
-  var XNode, AtomControl, styled;
-  function Block({
-    className,
-    title,
-    factory
-  }) {
-    return () => {
-      return XNode.create("i", {
-        "data-html-editor-element": "block",
-        class: className,
-        title: title,
-        draggable: true,
-        "event-click": e => {
-          const editor = AtomControl.from(e.target);
-          editor.insertElement(factory(editor.htmlDocument));
-        },
-        "event-dragstart": e => {
-          const ne = factory(AtomControl.from(e.target).htmlDocument);
-          e.dataTransfer.setDragImage(ne, 0, 0);
-          e.dataTransfer.setData("text/html", ne.outerHTML);
-        }
-      });
-    };
-  }
-  _export("Block", Block);
-  return {
-    setters: [function (_webAtomsCoreDistCoreXNode) {
-      XNode = _webAtomsCoreDistCoreXNode.default;
-    }, function (_webAtomsCoreDistWebControlsAtomControl) {
-      AtomControl = _webAtomsCoreDistWebControlsAtomControl.AtomControl;
-    }, function (_webAtomsCoreDistStyleStyled) {
-      styled = _webAtomsCoreDistStyleStyled.default;
-    }],
-    execute: function () {
-      styled.css`
-        padding: 5px;
-        cursor: pointer;
-        &:hover {
-            background-color: #00800080;
-        }
-    `.installGlobal("[data-html-editor-element=block]");
-    }
-  };
-});
-//# sourceMappingURL=Block.js.map
-
-    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/Block");
-
-System.register(["./Block"], function (_export, _context) {
-  "use strict";
-
-  var Block, src, ImageBlock;
-  return {
-    setters: [function (_Block) {
-      Block = _Block.Block;
-    }],
-    execute: function () {
-      src = `data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAiIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3R5bGU9ImZpbGw6IHJnYmEoMCwwLDAsMC4xNSk7IHRyYW5zZm9ybTogc2NhbGUoMC43NSkiPgogICAgICAgIDxwYXRoIGQ9Ik04LjUgMTMuNWwyLjUgMyAzLjUtNC41IDQuNSA2SDVtMTYgMVY1YTIgMiAwIDAgMC0yLTJINWMtMS4xIDAtMiAuOS0yIDJ2MTRjMCAxLjEuOSAyIDIgMmgxNGMxLjEgMCAyLS45IDItMnoiPjwvcGF0aD4KICAgICAgPC9zdmc+`;
-      _export("ImageBlock", ImageBlock = Block({
-        className: "fas fa-image",
-        title: "Add Image",
-        factory: d => {
-          const img = d.createElement("img");
-          img.setAttribute("src", src);
-          return img;
-        }
-      }));
-    }
-  };
-});
-//# sourceMappingURL=ImageBlock.js.map
-
-    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/ImageBlock");
-
 System.register([], function (_export, _context) {
   "use strict";
 
@@ -35417,6 +35361,7 @@ System.register(["@web-atoms/core/dist/core/XNode", "@web-atoms/core/dist/style/
         color: #555555;
         padding: 5px;
         cursor: pointer;
+        max-width: 90%;
         &:not([data-disabled]):hover, &[data-disabled=false]:hover {
             background-color: #00800050;
         }
@@ -35483,23 +35428,95 @@ System.register(["@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/core/XN
 
     AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/toolbars/UndoRedoToolbar");
 
-System.register(["./Block"], function (_export, _context) {
+System.register(["@web-atoms/core/dist/core/XNode", "@web-atoms/core/dist/web/controls/AtomControl", "@web-atoms/core/dist/style/styled"], function (_export, _context) {
+  "use strict";
+
+  var XNode, AtomControl, styled;
+  function Block({
+    className,
+    title,
+    text,
+    rotate,
+    src,
+    factory
+  }) {
+    return () => {
+      const onClick = e => {
+        const editor = AtomControl.from(e.target);
+        const element = editor.buildXNode(factory());
+        editor.insertElement(element);
+      };
+      const onDragStart = e => {
+        const editor = AtomControl.from(e.target);
+        const ne = editor.buildXNode(factory());
+        e.dataTransfer.setDragImage(ne, 0, 0);
+        e.dataTransfer.setData("text/html", ne.outerHTML);
+      };
+      if (src) {
+        return XNode.create("img", {
+          "data-html-editor-element": "block",
+          class: className,
+          title: title,
+          src: src,
+          draggable: true,
+          text: text,
+          "event-click": onClick,
+          "event-dragstart": onDragStart
+        });
+      }
+      return XNode.create("i", {
+        "data-html-editor-element": "block",
+        class: className,
+        title: title,
+        draggable: true,
+        text: text,
+        "style-rotate": rotate ? "90deg" : void 0,
+        "event-click": onClick,
+        "event-dragstart": onDragStart
+      });
+    };
+  }
+  _export("Block", Block);
+  return {
+    setters: [function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_webAtomsCoreDistWebControlsAtomControl) {
+      AtomControl = _webAtomsCoreDistWebControlsAtomControl.AtomControl;
+    }, function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }],
+    execute: function () {
+      styled.css`
+        padding: 5px;
+        cursor: pointer;
+        &:hover {
+            background-color: #00800080;
+        }
+    `.installGlobal("[data-html-editor-element=block]");
+    }
+  };
+});
+//# sourceMappingURL=Block.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/Block");
+
+System.register(["@web-atoms/core/dist/core/XNode", "./Block"], function (_export, _context) {
   "use strict";
 
-  var Block, WrapGrid;
+  var XNode, Block, WrapGrid;
   return {
-    setters: [function (_Block) {
+    setters: [function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_Block) {
       Block = _Block.Block;
     }],
     execute: function () {
       _export("WrapGrid", WrapGrid = Block({
         className: "fa-duotone fa-grid-horizontal fa-rotate-90",
         title: "Wrap Grid",
-        factory: doc => {
-          const e = doc.createElement("div");
-          e.setAttribute("styler-layout", "wrap-list");
-          return e;
-        }
+        factory: () => XNode.create("div", {
+          "styler-layout": "wrap-list"
+        })
       }));
     }
   };
@@ -35726,7 +35743,25 @@ System.register(["@web-atoms/core/dist/style/styled", "@web-atoms/core/dist/core
         commandBgColor: "#F0F0F0",
         menuBgColor: "#808080",
         menuColor: "#F0F0F0",
-        linkColor: "blue"
+        linkColor: "blue",
+        primaryBackground: "#b372dd50",
+        primaryColor: "gray",
+        primaryAccent: "#6145a9c9",
+        primaryAccentText: "white",
+        primarySurface: "#FFFFFFA0",
+        primarySurfaceText: "gray",
+        secondaryBackground: "#00808050",
+        secondaryColor: "gray",
+        secondaryAccent: "blue",
+        secondaryAccentText: "white",
+        secondarySurface: "#00A0A080",
+        secondarySurfaceText: "gray",
+        tertiaryBackground: "#7b4fc596",
+        tertiaryColor: "gray",
+        tertiaryAccent: "blue",
+        tertiaryAccentText: "white",
+        tertiarySurface: "#0000A080",
+        tertiarySurfaceText: "gray"
       }));
       _export("sizeVarList", sizeVarList = [stylerVars.sizeTiny, stylerVars.sizeSmall, stylerVars.sizeSmaller, stylerVars.sizeDefault, stylerVars.sizeLarger, stylerVars.sizeLarge, stylerVars.relSizeXS, stylerVars.relSizeSmall, stylerVars.relSizeMedium, stylerVars.relSizeLarge, stylerVars.relSizeXL, stylerVars.relSize2XL, stylerVars.relSize3XL, stylerVars.relSize4XL, stylerVars.relSize5XL, stylerVars.relSize6XL, stylerVars.relSize7XL, stylerVars.relSizeFull, stylerVars.relSizeProse]);
       _export("colorVarList", colorVarList = [stylerVars.defaultColor, stylerVars.defaultTextColor, stylerVars.accentColor, stylerVars.accentTextColor, stylerVars.acceptColor, stylerVars.accentTextColor, stylerVars.borderColor, stylerVars.goColor, stylerVars.goTextColor, stylerVars.headerColor, stylerVars.headerTextColor, stylerVars.hoverColor, stylerVars.hoverTextColor, stylerVars.linkColor, stylerVars.noteColor, stylerVars.noteTextColor, stylerVars.rejectColor, stylerVars.rejectTextColor, stylerVars.selectionColor, stylerVars.selectionTextColor, stylerVars.stopColor, stylerVars.stopTextColor, stylerVars.warningColor, stylerVars.warningTextColor]);
@@ -35887,7 +35922,7 @@ System.register(["../../Styler"], function (_export, _context) {
 });
 //# sourceMappingURL=display.js.map
 
-    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layout/display");
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/display");
 
 System.register(["../../../Styler"], function (_export, _context) {
   "use strict";
@@ -35905,7 +35940,7 @@ System.register(["../../../Styler"], function (_export, _context) {
 });
 //# sourceMappingURL=flex.js.map
 
-    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layout/flex/flex");
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/flex/flex");
 
 System.register(["../../../Styler"], function (_export, _context) {
   "use strict";
@@ -35937,23 +35972,70 @@ System.register(["../../../Styler"], function (_export, _context) {
 });
 //# sourceMappingURL=itemsPosition.js.map
 
-    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layout/items-position/itemsPosition");
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/items-position/itemsPosition");
 
-System.register(["@web-atoms/core/dist/style/styled", "../../Styler"], function (_export, _context) {
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
   "use strict";
 
-  var styled, StylerProperty, stylerVars, svg, svgCross, stylerLayout;
+  var styled, stylerVars, layoutTextBox;
   return {
     setters: [function (_webAtomsCoreDistStyleStyled) {
       styled = _webAtomsCoreDistStyleStyled.default;
     }, function (_Styler) {
-      StylerProperty = _Styler.StylerProperty;
       stylerVars = _Styler.stylerVars;
     }],
     execute: function () {
-      svg = `<svg xmlns="http://www.w3.org/2000/svg" height="16" width="14" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M0 96C0 78.3 14.3 64 32 64H416c17.7 0 32 14.3 32 32s-14.3 32-32 32H32C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32H416c17.7 0 32 14.3 32 32s-14.3 32-32 32H32c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H416c17.7 0 32 14.3 32 32z"/></svg>`;
-      svgCross = `<svg xmlns="http://www.w3.org/2000/svg" height="16" width="12" viewBox="0 0 384 512"><!--!Font Awesome Pro 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.--><path class="fa-secondary" opacity=".4" d="M297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6z"/><path class="fa-primary" d=""/></svg>`;
-      _export("stylerLayout", stylerLayout = StylerProperty.create("styler-layout", {
+      _export("layoutTextBox", layoutTextBox = {
+        "text-box": styled.css`
+        display: flex;
+        flex-direction: row;
+        gap: ${stylerVars.sizeDefault};
+        padding: ${stylerVars.sizeDefault};
+        margin: ${stylerVars.sizeDefault};
+        border-radius: ${stylerVars.sizeDefault};
+        justify-items: center;
+        align-items: stretch;
+
+        & > p:empty:before {
+            background-color: #ddd;
+            color: #000;
+            font-size: 16px;
+            font-weight: bold;
+            font-family: 'Courier New', Courier, monospace;
+            height: 100%;
+            display: flex;
+            justify-items: center;
+            align-items: center;
+            min-height: 30px;
+            opacity: 0.3;
+            border-radius: 3px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            content: "Container";
+
+        }
+    `
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutTextBox.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutTextBox");
+
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
+  "use strict";
+
+  var styled, stylerVars, layoutWrapList;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      _export("layoutWrapList", layoutWrapList = {
         "wrap-list": styled.css`
         display: flex;
         flex-direction: column;
@@ -35961,6 +36043,7 @@ System.register(["@web-atoms/core/dist/style/styled", "../../Styler"], function
         gap: ${stylerVars.sizeDefault};
         padding: ${stylerVars.sizeDefault};
         margin: ${stylerVars.sizeDefault};
+        border-radius: ${stylerVars.sizeDefault};
         &:empty:before {
             background-color: #ddd;
             color: #000;
@@ -35979,31 +36062,366 @@ System.register(["@web-atoms/core/dist/style/styled", "../../Styler"], function
             text-overflow: ellipsis;
             content: "Container";
         }
-    `,
-        "column": styled.css`
+    `
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutWrapList.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutWrapList");
+
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
+  "use strict";
+
+  var styled, stylerVars, layoutImageBox;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      _export("layoutImageBox", layoutImageBox = {
+        "image-box": styled.css`
         display: flex;
         flex-direction: column;
-        flex-wrap: nowrap;
         gap: ${stylerVars.sizeDefault};
         padding: ${stylerVars.sizeDefault};
         margin: ${stylerVars.sizeDefault};
-    `,
+        border-radius: ${stylerVars.sizeDefault};
+        justify-items: center;
+        align-items: stretch;
+        contain: content;
+
+        @media (min-width: 600px) { 
+            & {
+                flex-direction: row;
+            }
+        }
+
+        & > img {
+            align-self: center;
+        }
+
+        & > * {
+            padding: ${stylerVars.sizeDefault};
+            flex: 1 1 100%;
+            max-width: 50%;
+        }
+
+        & > *:empty:before {
+            background-color: #ddd;
+            color: #000;
+            font-size: 16px;
+            font-weight: bold;
+            font-family: 'Courier New', Courier, monospace;
+            height: 100%;
+            display: flex;
+            justify-items: center;
+            align-items: center;
+            min-height: 30px;
+            opacity: 0.3;
+            border-radius: 3px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            content: "Container";
+        }
+    `
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutImageBox.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutImageBox");
+
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
+  "use strict";
+
+  var styled, stylerVars, layoutRightImageBox;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      _export("layoutRightImageBox", layoutRightImageBox = {
+        "right-image-box": styled.css`
+        display: flex;
+        flex-direction: column;
+        gap: ${stylerVars.sizeDefault};
+        padding: ${stylerVars.sizeDefault};
+        margin: ${stylerVars.sizeDefault};
+        border-radius: ${stylerVars.sizeDefault};
+        justify-items: center;
+        align-items: stretch;
+        contain: content;
+
+        @media (min-width: 600px) { 
+            & {
+                flex-direction: row-reverse;
+            }
+        }
+
+        & > * {
+            padding: ${stylerVars.sizeDefault};
+            flex: 1 1 100%;
+            max-width: 50%;
+        }
+
+        & > img {
+            align-self: center;
+        }
+
+        & > *:empty:before {
+            background-color: #ddd;
+            color: #000;
+            font-size: 16px;
+            font-weight: bold;
+            font-family: 'Courier New', Courier, monospace;
+            height: 100%;
+            display: flex;
+            justify-items: center;
+            align-items: center;
+            min-height: 30px;
+            opacity: 0.3;
+            border-radius: 3px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            content: "Container";
+        }
+    `
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutRightImageBox.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutRightImageBox");
+
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
+  "use strict";
+
+  var styled, stylerVars, layoutColumn2Box;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      _export("layoutColumn2Box", layoutColumn2Box = {
+        "columns-2": styled.css`
+        display: flex;
+        flex-wrap: wrap;
+        flex-direction: column;
+        gap: ${stylerVars.sizeDefault};
+        border-radius: ${stylerVars.sizeDefault};
+        justify-items: center;
+        align-items: stretch;
+        contain: content;
+
+        @media (min-width: 600px) { 
+            & {
+                flex-direction: row;
+                flex-wrap: nowrap;
+            }
+            & > * {
+                width: 50%;
+                max-width: 50%;
+            }
+        }
+        & > *:empty:before {
+            background-color: #ddd;
+            color: #000;
+            font-size: 16px;
+            font-weight: bold;
+            font-family: 'Courier New', Courier, monospace;
+            height: 100%;
+            display: flex;
+            justify-items: center;
+            align-items: center;
+            min-height: 30px;
+            opacity: 0.3;
+            border-radius: 3px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            content: "Container";
+
+        }
+
+`
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutColumn2Box.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutColumn2Box");
+
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
+  "use strict";
+
+  var styled, stylerVars, layoutColumn;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      _export("layoutColumn", layoutColumn = {
+        "column": styled.css`
+        display: flex;
+        flex-direction: column;
+        gap: ${stylerVars.sizeDefault};
+        padding: ${stylerVars.sizeDefault};
+        border-radius: ${stylerVars.sizeDefault};
+        justify-items: center;
+        align-items: stretch;
+
+        & > * {
+            padding: ${stylerVars.sizeDefault};
+            flex: 1 1 100%;
+        }
+
+        & > *:empty:before {
+            background-color: #ddd;
+            color: #000;
+            font-size: 16px;
+            font-weight: bold;
+            font-family: 'Courier New', Courier, monospace;
+            height: 100%;
+            display: flex;
+            justify-items: center;
+            align-items: center;
+            min-height: 30px;
+            opacity: 0.3;
+            border-radius: 3px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            content: "Container";
+        }
+    `
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutColumn.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutColumn");
+
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
+  "use strict";
+
+  var styled, stylerVars, layoutRow;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      _export("layoutRow", layoutRow = {
         "row": styled.css`
         display: flex;
         flex-direction: row;
-        flex-wrap: nowrap;
+        flex-wrap: wrap;
         gap: ${stylerVars.sizeDefault};
         padding: ${stylerVars.sizeDefault};
         margin: ${stylerVars.sizeDefault};
-    `,
+        border-radius: ${stylerVars.sizeDefault};
+        justify-items: center;
+        align-items: center;
+
+        & > * {
+            padding: ${stylerVars.sizeDefault};
+            flex: 1 1 100%;
+        }
+
+
+        @media (min-width: 600px) { 
+            & {
+                flex-direction: row;
+                flex-wrap: nowrap;
+            }
+        }
+        & > *:empty:before {
+            background-color: #ddd;
+            color: #000;
+            font-size: 16px;
+            font-weight: bold;
+            font-family: 'Courier New', Courier, monospace;
+            height: 100%;
+            display: flex;
+            justify-items: center;
+            align-items: center;
+            min-height: 30px;
+            opacity: 0.3;
+            border-radius: 3px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            content: "Container";
+        }
+      `
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutRow.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutRow");
+
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
+  "use strict";
+
+  var styled, stylerVars, layoutBox;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      _export("layoutBox", layoutBox = {
         "block": styled.css`
         display: block;
         padding: ${stylerVars.sizeDefault};
         margin: ${stylerVars.sizeDefault};
-    `,
+    `
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutBlock.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutBlock");
+
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
+  "use strict";
+
+  var styled, stylerVars, layoutNavBar;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      _export("layoutNavBar", layoutNavBar = {
         "nav-bar": styled.css`
         display: flex;
         padding: ${stylerVars.sizeSmall};
+        padding-left: ${stylerVars.sizeLarge};
+        padding-right: ${stylerVars.sizeLarge};
+        border-radius: ${stylerVars.sizeDefault};
         margin: ${stylerVars.sizeDefault};
         border-radius: ${stylerVars.sizeLarge};
         align-items: center;
@@ -36012,16 +36430,41 @@ System.register(["@web-atoms/core/dist/style/styled", "../../Styler"], function
             margin-block-start: 0;
             margin-block-end: 0;
         }
-    `,
+    `
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutNavBar.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutNavBar");
+
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
+  "use strict";
+
+  var styled, stylerVars, svg, svgCross, layoutFloatingNavBar;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      svg = `<svg xmlns="http://www.w3.org/2000/svg" height="16" width="14" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M0 96C0 78.3 14.3 64 32 64H416c17.7 0 32 14.3 32 32s-14.3 32-32 32H32C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32H416c17.7 0 32 14.3 32 32s-14.3 32-32 32H32c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H416c17.7 0 32 14.3 32 32z"/></svg>`;
+      svgCross = `<svg xmlns="http://www.w3.org/2000/svg" height="16" width="12" viewBox="0 0 384 512"><!--!Font Awesome Pro 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.--><path class="fa-secondary" opacity=".4" d="M297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6z"/><path class="fa-primary" d=""/></svg>`;
+      _export("layoutFloatingNavBar", layoutFloatingNavBar = {
         "floating-nav-bar": styled.css`
         display: flex;
         padding: ${stylerVars.sizeSmall};
+        padding-left: ${stylerVars.sizeLarge};
+        padding-right: ${stylerVars.sizeLarge};
         margin: ${stylerVars.sizeDefault};
         position: sticky;
         top: ${stylerVars.sizeDefault};
         border-radius: ${stylerVars.sizeLarge};
         align-items: center;
         justify-content: space-between;
+        z-index: 20;
         & > h1, & > h2, & > h3, & > h5, & > h6 {
             margin-block-start: 0;
             margin-block-end: 0;
@@ -36077,13 +36520,320 @@ System.register(["@web-atoms/core/dist/style/styled", "../../Styler"], function
             
         }
     `
-      }));
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutFloatingNavBar.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutFloatingNavBar");
+
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
+  "use strict";
+
+  var styled, stylerVars, layoutColumn3Box;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      _export("layoutColumn3Box", layoutColumn3Box = {
+        "columns-3": styled.css`
+        display: flex;
+        flex-wrap: wrap;
+        flex-direction: column;
+        gap: ${stylerVars.sizeDefault};
+        border-radius: ${stylerVars.sizeDefault};
+        justify-items: center;
+        align-items: stretch;
+        contain: content;
+
+        @media (min-width: 600px) { 
+            & {
+                flex-direction: row;
+                flex-wrap: nowrap;
+            }
+            & > * {
+                width: 33%;
+                max-width: 33%;
+            }
+        }
+        & > *:empty:before {
+            background-color: #ddd;
+            color: #000;
+            font-size: 16px;
+            font-weight: bold;
+            font-family: 'Courier New', Courier, monospace;
+            height: 100%;
+            display: flex;
+            justify-items: center;
+            align-items: center;
+            min-height: 30px;
+            opacity: 0.3;
+            border-radius: 3px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            content: "Container";
+
+        }
+    
+    `
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutColumn3Box.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutColumn3Box");
+
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
+  "use strict";
+
+  var styled, stylerVars, layoutImageCard;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      _export("layoutImageCard", layoutImageCard = {
+        "image-card": styled.css`
+        display: grid;
+        margin: ${stylerVars.sizeDefault};
+        border-radius: ${stylerVars.sizeDefault};
+        grid-template-columns: 1fr;
+        grid-template-rows: auto 1fr 1fr;
+        justify-items: stretch;
+        align-items: stretch;
+        contain: content;
+
+        & > h4 {
+            max-width: 100%;
+            padding: ${stylerVars.sizeDefault};
+            grid-column: 1;
+            grid-row: 1;
+            margin-top: 0;
+            margin-bottom: 0;
+        }
+
+        & > img {
+            padding: ${stylerVars.sizeDefault};
+            margin: ${stylerVars.sizeDefault};
+            align-self: center;
+            max-width: 100%;
+            grid-column: 1;
+            grid-row: 2;
+        }
+        & > section {
+            max-width: 100%;
+            margin: ${stylerVars.sizeDefault};
+            padding: ${stylerVars.sizeDefault};
+            border-radius: ${stylerVars.sizeDefault};
+            grid-column: 1;
+            grid-row: 3;
+        }
+
+        @media (min-width: 600px) { 
+            & {
+                grid-template-columns: 1fr 1fr;
+                grid-template-rows: auto 1fr;
+            }
+
+            & > h4 {
+                max-width: 100%;
+                grid-column: 1 / span 2;
+                grid-row: 1;
+            }
+
+            & > img {
+                padding: ${stylerVars.sizeDefault};
+                max-width: 100%;
+                grid-column: 1;
+                grid-row: 2;
+            }
+            & > section {
+                max-width: 100%;
+                grid-column: 2;
+                grid-row: 2;
+            }
+        }
+
+        & > section:empty:before {
+            background-color: #ddd;
+            color: #000;
+            font-size: 16px;
+            font-weight: bold;
+            font-family: 'Courier New', Courier, monospace;
+            height: 100%;
+            display: flex;
+            justify-items: center;
+            align-items: center;
+            min-height: 30px;
+            opacity: 0.3;
+            border-radius: 3px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            content: "Container";
+        }
+        & > h4:empty:before {
+            background-color: #ddd;
+            color: #000;
+            font-size: 16px;
+            font-weight: bold;
+            font-family: 'Courier New', Courier, monospace;
+            height: 100%;
+            display: flex;
+            justify-items: center;
+            align-items: center;
+            min-height: 30px;
+            opacity: 0.3;
+            border-radius: 3px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            content: "Title";
+        }
+    `
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutImageCard.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutImageCard");
+
+System.register(["@web-atoms/core/dist/style/styled", "../../../Styler"], function (_export, _context) {
+  "use strict";
+
+  var styled, stylerVars, layoutCard;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      _export("layoutCard", layoutCard = {
+        "card": styled.css`
+        display: grid;
+        margin: ${stylerVars.sizeDefault};
+        border-radius: ${stylerVars.sizeDefault};
+        grid-template-columns: 1fr;
+        grid-template-rows: auto 1fr;
+        justify-items: stretch;
+        align-items: stretch;
+        contain: content;
+
+        & > h4 {
+            max-width: 100%;
+            padding: ${stylerVars.sizeDefault};
+            grid-column: 1;
+            grid-row: 1;
+            margin-top: 0;
+            margin-bottom: 0;
+        }
+
+        & > section {
+            max-width: 100%;
+            margin: ${stylerVars.sizeDefault};
+            padding: ${stylerVars.sizeDefault};
+            border-radius: ${stylerVars.sizeDefault};
+            grid-column: 1;
+            grid-row: 3;
+        }
+
+        & > section:empty:before {
+            background-color: #ddd;
+            color: #000;
+            font-size: 16px;
+            font-weight: bold;
+            font-family: 'Courier New', Courier, monospace;
+            height: 100%;
+            display: flex;
+            justify-items: center;
+            align-items: center;
+            min-height: 30px;
+            opacity: 0.3;
+            border-radius: 3px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            content: "Container";
+        }
+        & > h4:empty:before {
+            background-color: #ddd;
+            color: #000;
+            font-size: 16px;
+            font-weight: bold;
+            font-family: 'Courier New', Courier, monospace;
+            height: 100%;
+            display: flex;
+            justify-items: center;
+            align-items: center;
+            min-height: 30px;
+            opacity: 0.3;
+            border-radius: 3px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            content: "Title";
+        }
+    `
+      });
+    }
+  };
+});
+//# sourceMappingURL=layoutCard.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/blocks/layoutCard");
+
+System.register(["../../Styler", "./blocks/layoutTextBox", "./blocks/layoutWrapList", "./blocks/layoutImageBox", "./blocks/layoutRightImageBox", "./blocks/layoutColumn2Box", "./blocks/layoutColumn", "./blocks/layoutRow", "./blocks/layoutBlock", "./blocks/layoutNavBar", "./blocks/layoutFloatingNavBar", "./blocks/layoutColumn3Box", "./blocks/layoutImageCard", "./blocks/layoutCard"], function (_export, _context) {
+  "use strict";
+
+  var StylerProperty, layoutTextBox, layoutWrapList, layoutImageBox, layoutRightImageBox, layoutColumn2Box, layoutColumn, layoutRow, layoutBox, layoutNavBar, layoutFloatingNavBar, layoutColumn3Box, layoutImageCard, layoutCard, stylerLayout;
+  return {
+    setters: [function (_Styler) {
+      StylerProperty = _Styler.StylerProperty;
+    }, function (_blocksLayoutTextBox) {
+      layoutTextBox = _blocksLayoutTextBox.layoutTextBox;
+    }, function (_blocksLayoutWrapList) {
+      layoutWrapList = _blocksLayoutWrapList.layoutWrapList;
+    }, function (_blocksLayoutImageBox) {
+      layoutImageBox = _blocksLayoutImageBox.layoutImageBox;
+    }, function (_blocksLayoutRightImageBox) {
+      layoutRightImageBox = _blocksLayoutRightImageBox.layoutRightImageBox;
+    }, function (_blocksLayoutColumn2Box) {
+      layoutColumn2Box = _blocksLayoutColumn2Box.layoutColumn2Box;
+    }, function (_blocksLayoutColumn) {
+      layoutColumn = _blocksLayoutColumn.layoutColumn;
+    }, function (_blocksLayoutRow) {
+      layoutRow = _blocksLayoutRow.layoutRow;
+    }, function (_blocksLayoutBlock) {
+      layoutBox = _blocksLayoutBlock.layoutBox;
+    }, function (_blocksLayoutNavBar) {
+      layoutNavBar = _blocksLayoutNavBar.layoutNavBar;
+    }, function (_blocksLayoutFloatingNavBar) {
+      layoutFloatingNavBar = _blocksLayoutFloatingNavBar.layoutFloatingNavBar;
+    }, function (_blocksLayoutColumn3Box) {
+      layoutColumn3Box = _blocksLayoutColumn3Box.layoutColumn3Box;
+    }, function (_blocksLayoutImageCard) {
+      layoutImageCard = _blocksLayoutImageCard.layoutImageCard;
+    }, function (_blocksLayoutCard) {
+      layoutCard = _blocksLayoutCard.layoutCard;
+    }],
+    execute: function () {
+      _export("stylerLayout", stylerLayout = StylerProperty.create("styler-layout", Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, layoutTextBox), layoutWrapList), layoutImageCard), layoutImageBox), layoutRightImageBox), layoutColumn2Box), layoutColumn3Box), layoutColumn), layoutRow), layoutBox), layoutNavBar), layoutFloatingNavBar), layoutCard)));
     }
   };
 });
 //# sourceMappingURL=layout.js.map
 
-    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layout/layout");
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/layouts/layout");
 
 System.register(["../Styler"], function (_export, _context) {
   "use strict";
@@ -36249,10 +36999,73 @@ System.register(["@web-atoms/core/dist/style/styled", "../Styler"], function (_e
 
     AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/stylerBackground");
 
-System.register(["./Styler", "./properties/stylerBorder", "./properties/layout/display", "./properties/layout/flex/flex", "./properties/layout/items-position/itemsPosition", "./properties/layout/layout", "./properties/stylerPosition", "./properties/stylerSizes", "./properties/stylerSpace", "./properties/text/stylerText", "./properties/stylerBackground"], function (_export, _context) {
+System.register(["@web-atoms/core/dist/style/styled", "../../Styler"], function (_export, _context) {
   "use strict";
 
-  var StylerVariable, stylerVars, stylerBorder, stylerDisplay, stylerFlexDirection, itemPositions, stylerLayout, stylerPosition, stylerSizes, stylerSpace, stylerText, stylerBackground, StylerSet, vars;
+  var styled, StylerProperty, stylerVars, stylerColorSets;
+  return {
+    setters: [function (_webAtomsCoreDistStyleStyled) {
+      styled = _webAtomsCoreDistStyleStyled.default;
+    }, function (_Styler) {
+      StylerProperty = _Styler.StylerProperty;
+      stylerVars = _Styler.stylerVars;
+    }],
+    execute: function () {
+      _export("stylerColorSets", stylerColorSets = StylerProperty.create("styler-colors", {
+        "primary": styled.css`
+        background-color: ${stylerVars.primaryBackground};
+        color: ${stylerVars.primaryColor};
+
+        & [styler-element=accent] {
+            background-color: ${stylerVars.primaryAccent};
+            color: ${stylerVars.primaryAccentText};
+        }
+
+        & [styler-element=surface] {
+            background-color: ${stylerVars.primarySurface};
+            color: ${stylerVars.primarySurfaceText};
+        }
+    `,
+        "secondary": styled.css`
+        background-color: ${stylerVars.secondaryBackground};
+        color: ${stylerVars.secondaryColor};
+
+        & [styler-element=accent] {
+            background-color: ${stylerVars.secondaryAccent};
+            color: ${stylerVars.secondaryAccentText};
+        }
+
+        & [styler-element=surface] {
+            background-color: ${stylerVars.secondarySurface};
+            color: ${stylerVars.secondarySurfaceText};
+        }
+    `,
+        "tertiary": styled.css`
+        background-color: ${stylerVars.tertiaryBackground};
+        color: ${stylerVars.tertiaryColor};
+
+        & [styler-element=accent] {
+            background-color: ${stylerVars.tertiaryAccent};
+            color: ${stylerVars.tertiaryAccentText};
+        }
+
+        & [styler-element=surface] {
+            background-color: ${stylerVars.tertiarySurface};
+            color: ${stylerVars.tertiarySurfaceText};
+        }
+    `
+      }));
+    }
+  };
+});
+//# sourceMappingURL=stylerColorSets.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/styler/properties/color-sets/stylerColorSets");
+
+System.register(["./Styler", "./properties/stylerBorder", "./properties/layouts/display", "./properties/layouts/flex/flex", "./properties/layouts/items-position/itemsPosition", "./properties/layouts/layout", "./properties/stylerPosition", "./properties/stylerSizes", "./properties/stylerSpace", "./properties/text/stylerText", "./properties/stylerBackground", "./properties/color-sets/stylerColorSets"], function (_export, _context) {
+  "use strict";
+
+  var StylerVariable, stylerVars, stylerBorder, stylerDisplay, stylerFlexDirection, itemPositions, stylerLayout, stylerPosition, stylerSizes, stylerSpace, stylerText, stylerBackground, stylerColorSets, StylerSet, vars;
   _export("StylerSet", void 0);
   return {
     setters: [function (_Styler) {
@@ -36260,14 +37073,14 @@ System.register(["./Styler", "./properties/stylerBorder", "./properties/layout/d
       stylerVars = _Styler.stylerVars;
     }, function (_propertiesStylerBorder) {
       stylerBorder = _propertiesStylerBorder.stylerBorder;
-    }, function (_propertiesLayoutDisplay) {
-      stylerDisplay = _propertiesLayoutDisplay.stylerDisplay;
-    }, function (_propertiesLayoutFlexFlex) {
-      stylerFlexDirection = _propertiesLayoutFlexFlex.stylerFlexDirection;
-    }, function (_propertiesLayoutItemsPositionItemsPosition) {
-      itemPositions = _propertiesLayoutItemsPositionItemsPosition.itemPositions;
-    }, function (_propertiesLayoutLayout) {
-      stylerLayout = _propertiesLayoutLayout.stylerLayout;
+    }, function (_propertiesLayoutsDisplay) {
+      stylerDisplay = _propertiesLayoutsDisplay.stylerDisplay;
+    }, function (_propertiesLayoutsFlexFlex) {
+      stylerFlexDirection = _propertiesLayoutsFlexFlex.stylerFlexDirection;
+    }, function (_propertiesLayoutsItemsPositionItemsPosition) {
+      itemPositions = _propertiesLayoutsItemsPositionItemsPosition.itemPositions;
+    }, function (_propertiesLayoutsLayout) {
+      stylerLayout = _propertiesLayoutsLayout.stylerLayout;
     }, function (_propertiesStylerPosition) {
       stylerPosition = _propertiesStylerPosition.stylerPosition;
     }, function (_propertiesStylerSizes) {
@@ -36278,6 +37091,8 @@ System.register(["./Styler", "./properties/stylerBorder", "./properties/layout/d
       stylerText = _propertiesTextStylerText.stylerText;
     }, function (_propertiesStylerBackground) {
       stylerBackground = _propertiesStylerBackground.stylerBackground;
+    }, function (_propertiesColorSetsStylerColorSets) {
+      stylerColorSets = _propertiesColorSetsStylerColorSets.stylerColorSets;
     }],
     execute: function () {
       vars = [];
@@ -36292,6 +37107,7 @@ System.register(["./Styler", "./properties/stylerBorder", "./properties/layout/d
           this.vars = vars;
           this.properties = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({
             stylerLayout,
+            stylerColorSets,
             stylerDisplay,
             stylerFlexDirection
           }, stylerBorder), itemPositions), stylerText), stylerSizes), stylerSpace), stylerPosition), stylerBackground);
@@ -36338,6 +37154,9 @@ System.register(["@web-atoms/core/dist/core/XNode", "../controls/PropertyEditor"
     }), XNode.create(DropDownProperty, {
       label: "Display",
       property: properties.stylerDisplay
+    }), XNode.create(DropDownProperty, {
+      label: "Color Set",
+      property: properties.stylerColorSets
     }), XNode.create(DropDownProperty, {
       "style-display": BindEditor.oneWay(e => e.selection.currentStyle.display === "flex"),
       label: "Direction",
@@ -37022,10 +37841,307 @@ System.register(["@web-atoms/core/dist/core/AtomBinder"], function (_export, _co
 
     AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/editor/SelectedElement");
 
-System.register(["tslib", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/core/XNode", "@web-atoms/core/dist/core/sleep", "@web-atoms/core/dist/style/styled", "@web-atoms/core/dist/view-model/Action", "@web-atoms/core/dist/web/controls/AtomControl", "../blocks/ImageBlock", "../drag-drop/DragDropHelper", "../commands/CodeCommand", "../toolbars/UndoRedoToolbar", "../blocks/WrapGrid", "../toolbars/EditorToolbar", "../properties/Properties", "../styler/StylerSet", "./SelectedElement", "@web-atoms/core/dist/core/AtomBinder", "../styler/Styler"], function (_export, _context) {
+System.register([], function (_export, _context) {
   "use strict";
 
-  var __awaiter, __decorate, __metadata, Bind, XNode, sleep, styled, Action, AtomControl, ImageBlock, InstallDragDropHelper, CodeCommand, UndoRedoToolbar, WrapGrid, EditorToolbar, Properties, StylerSet, SelectedElement, AtomBinder, StylerVariable, HtmlPageEditor, desktopWidth, tabletWidth, mobileWidth;
+  var defaultImageSrc;
+  return {
+    setters: [],
+    execute: function () {
+      _export("defaultImageSrc", defaultImageSrc = `data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAiIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3R5bGU9ImZpbGw6IHJnYmEoMCwwLDAsMC4xNSk7IHRyYW5zZm9ybTogc2NhbGUoMC43NSkiPgogICAgICAgIDxwYXRoIGQ9Ik04LjUgMTMuNWwyLjUgMyAzLjUtNC41IDQuNSA2SDVtMTYgMVY1YTIgMiAwIDAgMC0yLTJINWMtMS4xIDAtMiAuOS0yIDJ2MTRjMCAxLjEuOSAyIDIgMmgxNGMxLjEgMCAyLS45IDItMnoiPjwvcGF0aD4KICAgICAgPC9zdmc+`);
+    }
+  };
+});
+//# sourceMappingURL=defaultImage.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/defaultImage");
+
+System.register(["@web-atoms/core/dist/core/XNode", "./Block", "./defaultImage"], function (_export, _context) {
+  "use strict";
+
+  var XNode, Block, defaultImageSrc, RightImageBox, ImageBox;
+  return {
+    setters: [function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_Block) {
+      Block = _Block.Block;
+    }, function (_defaultImage) {
+      defaultImageSrc = _defaultImage.defaultImageSrc;
+    }],
+    execute: function () {
+      _export("RightImageBox", RightImageBox = Block({
+        className: "material-symbols-outlined",
+        title: "Add Image Box with Image on Right",
+        text: "\uf864",
+        factory: () => XNode.create("section", {
+          "styler-layout": "image-box",
+          "styler-flex-direction": "row-reverse"
+        }, XNode.create("img", {
+          src: defaultImageSrc
+        }), XNode.create("section", null))
+      }));
+      _export("ImageBox", ImageBox = Block({
+        className: "material-symbols-outlined",
+        title: "Add Image Box",
+        text: "\uf863",
+        factory: () => XNode.create("section", {
+          "styler-layout": "image-box"
+        }, XNode.create("img", {
+          src: defaultImageSrc
+        }), XNode.create("section", null))
+      }));
+    }
+  };
+});
+//# sourceMappingURL=ImageBox.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/ImageBox");
+
+System.register(["@web-atoms/core/dist/core/XNode", "./Block", "@social-mail/social-mail-client/content/images/svg/html-editor/layouts/row.png"], function (_export, _context) {
+  "use strict";
+
+  var XNode, Block, row, RowBox;
+  return {
+    setters: [function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_Block) {
+      Block = _Block.Block;
+    }, function (_socialMailSocialMailClientContentImagesSvgHtmlEditorLayoutsRowPng) {
+      row = _socialMailSocialMailClientContentImagesSvgHtmlEditorLayoutsRowPng.default;
+    }],
+    execute: function () {
+      _export("RowBox", RowBox = Block({
+        title: "Add Row",
+        src: row,
+        factory: () => XNode.create("section", {
+          "styler-layout": "row"
+        }, XNode.create("section", null), XNode.create("section", null))
+      }));
+    }
+  };
+});
+//# sourceMappingURL=RowBox.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/RowBox");
+
+System.register(["@web-atoms/core/dist/core/XNode", "./Block", "@social-mail/social-mail-client/content/images/svg/html-editor/layouts/column.png", "@social-mail/social-mail-client/content/images/svg/html-editor/layouts/column-2.png", "@social-mail/social-mail-client/content/images/svg/html-editor/layouts/column-3.png"], function (_export, _context) {
+  "use strict";
+
+  var XNode, Block, column, column2, column3, ColumnBox, Columns2, Columns3;
+  return {
+    setters: [function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_Block) {
+      Block = _Block.Block;
+    }, function (_socialMailSocialMailClientContentImagesSvgHtmlEditorLayoutsColumnPng) {
+      column = _socialMailSocialMailClientContentImagesSvgHtmlEditorLayoutsColumnPng.default;
+    }, function (_socialMailSocialMailClientContentImagesSvgHtmlEditorLayoutsColumn2Png) {
+      column2 = _socialMailSocialMailClientContentImagesSvgHtmlEditorLayoutsColumn2Png.default;
+    }, function (_socialMailSocialMailClientContentImagesSvgHtmlEditorLayoutsColumn3Png) {
+      column3 = _socialMailSocialMailClientContentImagesSvgHtmlEditorLayoutsColumn3Png.default;
+    }],
+    execute: function () {
+      _export("ColumnBox", ColumnBox = Block({
+        title: "Add Single Column Box",
+        src: column,
+        factory: () => XNode.create("section", {
+          "styler-layout": "column"
+        }, XNode.create("section", null), XNode.create("section", null))
+      }));
+      _export("Columns2", Columns2 = Block({
+        title: "Add 2 Columns",
+        src: column2,
+        factory: () => XNode.create("section", {
+          "styler-layout": "columns-2"
+        }, XNode.create("section", null), XNode.create("section", null))
+      }));
+      _export("Columns3", Columns3 = Block({
+        title: "Add 3 Columns",
+        src: column3,
+        factory: () => XNode.create("section", {
+          "styler-layout": "columns-3"
+        }, XNode.create("section", null), XNode.create("section", null), XNode.create("section", null))
+      }));
+    }
+  };
+});
+//# sourceMappingURL=ColumnBox.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/ColumnBox");
+
+System.register(["@web-atoms/core/dist/core/XNode", "./Block", "./defaultImage", "@social-mail/social-mail-client/content/images/svg/html-editor/layouts/vertical-image-box.png"], function (_export, _context) {
+  "use strict";
+
+  var XNode, Block, defaultImageSrc, verticalImageBox, VerticalImageBox;
+  return {
+    setters: [function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_Block) {
+      Block = _Block.Block;
+    }, function (_defaultImage) {
+      defaultImageSrc = _defaultImage.defaultImageSrc;
+    }, function (_socialMailSocialMailClientContentImagesSvgHtmlEditorLayoutsVerticalImageBoxPng) {
+      verticalImageBox = _socialMailSocialMailClientContentImagesSvgHtmlEditorLayoutsVerticalImageBoxPng.default;
+    }],
+    execute: function () {
+      _export("VerticalImageBox", VerticalImageBox = Block({
+        className: "fas fa-image",
+        title: "Add Vertical Image Box",
+        src: verticalImageBox,
+        factory: () => XNode.create("section", {
+          "styler-layout": "vertical-image-box"
+        }, XNode.create("img", {
+          src: defaultImageSrc
+        }), XNode.create("section", null))
+      }));
+    }
+  };
+});
+//# sourceMappingURL=VerticalImageBox.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/VerticalImageBox");
+
+System.register(["@web-atoms/core/dist/core/XNode", "./Block", "./defaultImage"], function (_export, _context) {
+  "use strict";
+
+  var XNode, Block, defaultImageSrc, Image;
+  return {
+    setters: [function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_Block) {
+      Block = _Block.Block;
+    }, function (_defaultImage) {
+      defaultImageSrc = _defaultImage.defaultImageSrc;
+    }],
+    execute: function () {
+      _export("Image", Image = Block({
+        className: "fad fa-image",
+        title: "Add Photo",
+        factory: () => XNode.create("img", {
+          src: defaultImageSrc
+        })
+      }));
+    }
+  };
+});
+//# sourceMappingURL=Image.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/Image");
+
+System.register(["@web-atoms/core/dist/core/XNode", "./Block", "./defaultImage"], function (_export, _context) {
+  "use strict";
+
+  var XNode, Block, defaultImageSrc, ImageCard;
+  return {
+    setters: [function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_Block) {
+      Block = _Block.Block;
+    }, function (_defaultImage) {
+      defaultImageSrc = _defaultImage.defaultImageSrc;
+    }],
+    execute: function () {
+      _export("ImageCard", ImageCard = Block({
+        className: "fad fa-id-card",
+        title: "Add Image Card",
+        factory: () => XNode.create("section", {
+          "styler-layout": "image-card"
+        }, XNode.create("h4", null), XNode.create("img", {
+          src: defaultImageSrc
+        }), XNode.create("section", null))
+      }));
+    }
+  };
+});
+//# sourceMappingURL=ImageCard.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/ImageCard");
+
+System.register(["@web-atoms/core/dist/core/XNode", "./Block"], function (_export, _context) {
+  "use strict";
+
+  var XNode, Block, src, TextBox;
+  return {
+    setters: [function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_Block) {
+      Block = _Block.Block;
+    }],
+    execute: function () {
+      src = `data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAiIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3R5bGU9ImZpbGw6IHJnYmEoMCwwLDAsMC4xNSk7IHRyYW5zZm9ybTogc2NhbGUoMC43NSkiPgogICAgICAgIDxwYXRoIGQ9Ik04LjUgMTMuNWwyLjUgMyAzLjUtNC41IDQuNSA2SDVtMTYgMVY1YTIgMiAwIDAgMC0yLTJINWMtMS4xIDAtMiAuOS0yIDJ2MTRjMCAxLjEuOSAyIDIgMmgxNGMxLjEgMCAyLS45IDItMnoiPjwvcGF0aD4KICAgICAgPC9zdmc+`;
+      _export("TextBox", TextBox = Block({
+        className: "material-symbols-outlined",
+        title: "Add Text Box",
+        text: "\ue167",
+        factory: () => XNode.create("section", {
+          "styler-layout": "text-box"
+        }, XNode.create("p", null))
+      }));
+    }
+  };
+});
+//# sourceMappingURL=TextBox.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/TextBox");
+
+System.register(["@web-atoms/core/dist/core/XNode", "./Block", "@social-mail/social-mail-client/content/images/svg/html-editor/layouts/card.png"], function (_export, _context) {
+  "use strict";
+
+  var XNode, Block, card, Card;
+  return {
+    setters: [function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_Block) {
+      Block = _Block.Block;
+    }, function (_socialMailSocialMailClientContentImagesSvgHtmlEditorLayoutsCardPng) {
+      card = _socialMailSocialMailClientContentImagesSvgHtmlEditorLayoutsCardPng.default;
+    }],
+    execute: function () {
+      _export("Card", Card = Block({
+        title: "Add Card",
+        src: card,
+        factory: () => XNode.create("section", {
+          "styler-layout": "card"
+        }, XNode.create("h4", {
+          "styler-element": "accent"
+        }), XNode.create("section", {
+          "styler-element": "surface"
+        }))
+      }));
+    }
+  };
+});
+//# sourceMappingURL=Card.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/Card");
+
+System.register(["@web-atoms/core/dist/core/XNode", "./Block"], function (_export, _context) {
+  "use strict";
+
+  var XNode, Block, List;
+  return {
+    setters: [function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_Block) {
+      Block = _Block.Block;
+    }],
+    execute: function () {
+      _export("List", List = Block({
+        className: "fad fa-list",
+        title: "Add List",
+        factory: () => XNode.create("ul", null, XNode.create("li", null), XNode.create("li", null))
+      }));
+    }
+  };
+});
+//# sourceMappingURL=List.js.map
+
+    AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/blocks/List");
+
+System.register(["tslib", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/core/XNode", "@web-atoms/core/dist/core/sleep", "@web-atoms/core/dist/style/styled", "@web-atoms/core/dist/view-model/Action", "@web-atoms/core/dist/web/controls/AtomControl", "../drag-drop/DragDropHelper", "../commands/CodeCommand", "../toolbars/UndoRedoToolbar", "../blocks/WrapGrid", "../toolbars/EditorToolbar", "../properties/Properties", "../styler/StylerSet", "./SelectedElement", "@web-atoms/core/dist/core/AtomBinder", "../styler/Styler", "../blocks/ImageBox", "../blocks/RowBox", "../blocks/ColumnBox", "../blocks/VerticalImageBox", "../blocks/Image", "../blocks/ImageCard", "../blocks/TextBox", "../blocks/Card", "../blocks/List"], function (_export, _context) {
+  "use strict";
+
+  var __awaiter, __decorate, __metadata, Bind, XNode, sleep, styled, Action, AtomControl, InstallDragDropHelper, CodeCommand, UndoRedoToolbar, WrapGrid, EditorToolbar, Properties, StylerSet, SelectedElement, AtomBinder, StylerVariable, ImageBox, RightImageBox, RowBox, ColumnBox, Columns2, Columns3, VerticalImageBox, Image, ImageCard, TextBox, Card, List, HtmlPageEditor, desktopWidth, tabletWidth, mobileWidth;
   _export("default", void 0);
   return {
     setters: [function (_tslib) {
@@ -37044,8 +38160,6 @@ System.register(["tslib", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dis
       Action = _webAtomsCoreDistViewModelAction.default;
     }, function (_webAtomsCoreDistWebControlsAtomControl) {
       AtomControl = _webAtomsCoreDistWebControlsAtomControl.AtomControl;
-    }, function (_blocksImageBlock) {
-      ImageBlock = _blocksImageBlock.ImageBlock;
     }, function (_dragDropDragDropHelper) {
       InstallDragDropHelper = _dragDropDragDropHelper.InstallDragDropHelper;
     }, function (_commandsCodeCommand) {
@@ -37066,6 +38180,27 @@ System.register(["tslib", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dis
       AtomBinder = _webAtomsCoreDistCoreAtomBinder.AtomBinder;
     }, function (_stylerStyler) {
       StylerVariable = _stylerStyler.StylerVariable;
+    }, function (_blocksImageBox) {
+      ImageBox = _blocksImageBox.ImageBox;
+      RightImageBox = _blocksImageBox.RightImageBox;
+    }, function (_blocksRowBox) {
+      RowBox = _blocksRowBox.RowBox;
+    }, function (_blocksColumnBox) {
+      ColumnBox = _blocksColumnBox.ColumnBox;
+      Columns2 = _blocksColumnBox.Columns2;
+      Columns3 = _blocksColumnBox.Columns3;
+    }, function (_blocksVerticalImageBox) {
+      VerticalImageBox = _blocksVerticalImageBox.VerticalImageBox;
+    }, function (_blocksImage) {
+      Image = _blocksImage.Image;
+    }, function (_blocksImageCard) {
+      ImageCard = _blocksImageCard.ImageCard;
+    }, function (_blocksTextBox) {
+      TextBox = _blocksTextBox.TextBox;
+    }, function (_blocksCard) {
+      Card = _blocksCard.Card;
+    }, function (_blocksList) {
+      List = _blocksList.List;
     }],
     execute: function () {
       styled.css`
@@ -37294,7 +38429,7 @@ System.register(["tslib", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dis
               class: "fas fa-mobile-screen"
             })), XNode.create(UndoRedoToolbar, null), XNode.create(EditorToolbar, null, XNode.create(CodeCommand, null))), XNode.create(EditorToolbar, {
               "data-element": "left"
-            }, XNode.create(ImageBlock, null), XNode.create(WrapGrid, null)), XNode.create("div", {
+            }, XNode.create(TextBox, null), XNode.create(Image, null), XNode.create(WrapGrid, null), XNode.create(VerticalImageBox, null), XNode.create(ImageBox, null), XNode.create(RightImageBox, null), XNode.create(Card, null), XNode.create(ImageCard, null), XNode.create(RowBox, null), XNode.create(ColumnBox, null), XNode.create(Columns2, null), XNode.create(Columns3, null), XNode.create(List, null)), XNode.create("div", {
               "data-element": "editor",
               "style-max-width": Bind.oneWay(() => this.maxWidth > 768 ? "" : this.maxWidth + "px")
             }, XNode.create("div", {
@@ -37361,6 +38496,26 @@ System.register(["tslib", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dis
             }
           });
         }
+        buildXNode(node) {
+          const build = n => {
+            const e = this.htmlDocument.createElement(n.name);
+            if (n.attributes) {
+              for (const key in n.attributes) {
+                if (Object.prototype.hasOwnProperty.call(n.attributes, key)) {
+                  const element = n.attributes[key];
+                  e.setAttribute(key, element);
+                }
+              }
+            }
+            if (n.children) {
+              for (const iterator of n.children) {
+                e.appendChild(build(iterator));
+              }
+            }
+            return e;
+          };
+          return build(node);
+        }
         deleteElement() {
           var _a;
           return __awaiter(this, void 0, void 0, function* () {
@@ -37515,10 +38670,10 @@ System.register(["tslib", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dis
 
     AmdLoader.instance.setup("@social-mail/social-mail-client/dist/site-editor/editor/HtmlPageEditor");
 
-System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "@web-atoms/core/dist/core/XNode", "../../../../common/controls/tree/FileTreeView", "@web-atoms/web-controls/dist/basic/AtomRepeater", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/core/InjectProperty", "../service/CloudFileService", "@web-atoms/core/dist/style/styled", "../../../../common/controls/drag-drop/FilesDragDrop", "@web-atoms/core/dist/view-model/Action"], function (_export, _context) {
+System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "@web-atoms/core/dist/core/XNode", "../../../../common/controls/tree/FileTreeView", "@web-atoms/web-controls/dist/basic/AtomRepeater", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/core/InjectProperty", "../service/CloudFileService", "@web-atoms/core/dist/style/styled", "../../../../common/controls/drag-drop/FilesDragDrop", "@web-atoms/core/dist/view-model/Action", "@web-atoms/web-controls/dist/basic/UploadEvent"], function (_export, _context) {
   "use strict";
 
-  var __awaiter, __decorate, __metadata, PopupWindowPage, XNode, FolderTreeView, AtomRepeater, Bind, InjectProperty, CloudFileService, styled, FilesDragDrop, Action, ChooseMediaPage, css;
+  var __awaiter, __decorate, __metadata, PopupWindowPage, XNode, FolderTreeView, AtomRepeater, Bind, InjectProperty, CloudFileService, styled, FilesDragDrop, Action, UploadEvent, ChooseMediaPage, css;
   _export("default", void 0);
   return {
     setters: [function (_tslib) {
@@ -37545,6 +38700,8 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
       FilesDragDrop = _commonControlsDragDropFilesDragDrop.FilesDragDrop;
     }, function (_webAtomsCoreDistViewModelAction) {
       Action = _webAtomsCoreDistViewModelAction.default;
+    }, function (_webAtomsWebControlsDistBasicUploadEvent) {
+      UploadEvent = _webAtomsWebControlsDistBasicUploadEvent.default;
     }],
     execute: function () {
       css = styled.css`
@@ -37637,8 +38794,25 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
               }))
             })));
             this.footerRenderer = () => XNode.create("div", {
+              "data-layout": "frame-vertical-flex"
+            }, XNode.create("div", {
+              "data-layout": "row"
+            }, XNode.create("button", Object.assign({
+              "data-layout": "accent-icon-button"
+            }, UploadEvent.AttachUploadAction({
+              multiple: true,
+              extra: Bind.oneWay(() => {
+                var _a;
+                return JSON.stringify({
+                  parentID: (_a = this.selectedFolder) === null || _a === void 0 ? void 0 : _a.appFileID
+                });
+              }),
+              accept
+            })), XNode.create("i", {
+              class: "fas fa-upload"
+            }), "Upload")), XNode.create("div", {
               "style-display": Bind.oneWay(() => this.selectedFile !== null),
-              "data-layout": "command-row"
+              "data-layout": "row"
             }, XNode.create("input", {
               type: "range",
               min: "100",
@@ -37650,7 +38824,7 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
             }), XNode.create("button", {
               "data-click-event": "select-file",
               text: "Save"
-            }));
+            })));
           });
         }
         selectFile() {
@@ -37684,10 +38858,10 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
 
     AmdLoader.instance.setup("@social-mail/social-mail-client/dist/web/page/files/media/ChooseMediaPage");
 
-System.register(["tslib", "@web-atoms/core/dist/core/BindableProperty", "./HtmlPageEditor", "../../web/page/files/media/ChooseMediaPage", "@web-atoms/web-controls/dist/PageNavigator", "../styler/StylerSet", "@web-atoms/core/dist/core/InjectProperty", "../../web/page/files/service/CloudFileService", "@web-atoms/core/dist/services/FetchBuilder"], function (_export, _context) {
+System.register(["tslib", "@web-atoms/core/dist/core/BindableProperty", "./HtmlPageEditor", "../../web/page/files/media/ChooseMediaPage", "@web-atoms/web-controls/dist/PageNavigator", "../styler/StylerSet", "@web-atoms/core/dist/core/InjectProperty", "../../web/page/files/service/CloudFileService"], function (_export, _context) {
   "use strict";
 
-  var __awaiter, __decorate, __metadata, BindableProperty, HtmlPageEditor, ChooseMediaPage, PageNavigator, StylerSet, InjectProperty, CloudFileService, FetchBuilder, WebSitePageEditor;
+  var __awaiter, __decorate, __metadata, BindableProperty, HtmlPageEditor, ChooseMediaPage, PageNavigator, StylerSet, InjectProperty, CloudFileService, WebSitePageEditor;
   _export("default", void 0);
   return {
     setters: [function (_tslib) {
@@ -37708,8 +38882,6 @@ System.register(["tslib", "@web-atoms/core/dist/core/BindableProperty", "./HtmlP
       InjectProperty = _webAtomsCoreDistCoreInjectProperty.default;
     }, function (_webPageFilesServiceCloudFileService) {
       CloudFileService = _webPageFilesServiceCloudFileService.default;
-    }, function (_webAtomsCoreDistServicesFetchBuilder) {
-      FetchBuilder = _webAtomsCoreDistServicesFetchBuilder.default;
     }],
     execute: function () {
       _export("default", WebSitePageEditor = class WebSitePageEditor extends HtmlPageEditor {
@@ -37731,24 +38903,40 @@ System.register(["tslib", "@web-atoms/core/dist/core/BindableProperty", "./HtmlP
           });
         }
         setStylerSheet() {
-          var _a;
+          return __awaiter(this, void 0, void 0, function* () {
+            const stylerCSS = yield this.createFile("styler.css", StylerSet.instance.toString());
+            yield this.addStyleSheet(stylerCSS);
+            let vars = yield this.cloudFileService.children(this.folder.appFileID, "styles/vars.css").firstOrDefault();
+            if (!vars) {
+              vars = yield this.createFile("vars.css", `* {
+            }`);
+            }
+            yield this.addStyleSheet(vars);
+          });
+        }
+        addStyleSheet(file) {
           return __awaiter(this, void 0, void 0, function* () {
             const document = this.htmlDocument;
-            (_a = document.querySelector(`style[styler-style-sheet]`)) === null || _a === void 0 ? void 0 : _a.remove();
-            let link = document.querySelector(`link[rel=stylesheet][styler-style]`);
-            const css = StylerSet.instance.toString();
-            if (link) {
-              const text = yield FetchBuilder.get(link.href).responseAsText(false);
-              if (text === css) {
-                return;
+            const href = `/api/site/asset/download/${this.folder.appFileID}/${file.appFileID}/${file.fileContentID}/${file.name}`;
+            let link;
+            for (const iterator of Array.from(document.querySelectorAll(`link[rel="stylesheet"][styler-css]`))) {
+              if (iterator.getAttribute("styler-css") === file.name) {
+                link = iterator;
+                break;
               }
-            } else {
-              link = document.createElement("link");
-              link.rel = "stylesheet";
-              link.setAttribute("styler-style", "ref");
+            }
+            if (!link) {
+              link !== null && link !== void 0 ? link : link = document.createElement("link");
               document.head.appendChild(link);
+              link.rel = "stylesheet";
+              link.setAttribute("styler-css", file.name);
             }
-            const content = new File([css], "styler.css", {
+            link.href = href;
+          });
+        }
+        createFile(fileName, css) {
+          return __awaiter(this, void 0, void 0, function* () {
+            const content = new File([css], fileName, {
               type: "text/css"
             });
             const {
@@ -37759,7 +38947,7 @@ System.register(["tslib", "@web-atoms/core/dist/core/BindableProperty", "./HtmlP
               content
             });
             const file = yield this.cloudFileService.getFile(appFileID);
-            link.href = `/api/site/asset/download/${this.folder.appFileID}/${file.appFileID}/${file.fileContentID}/${file.name}.css`;
+            return file;
           });
         }
       });