Renamed "bubble" to "message", added message group merging

1 files changed, 54 insertions, 0 deletions

diff --git a/tpl/objects/message.pug b/tpl/objects/message.pug
new file mode 100644
index 0000000..d644347
--- /dev/null
+++ b/tpl/objects/message.pug
@@ -0,0 +1,54 @@
+mixin message(user)
+    - const slots = {}
+
+    mixin slot(key)
+        - slots[key] = block
+
+    -
+        block ? block() : undefined
+
+        let classes = {
+            'o-message':                true,
+            'o-message--bubble':        attributes.bubble || !!attributes.theme,
+            'o-message--75':            attributes.compact,
+            'o-message--highlight':     attributes.highlight,
+            'l-message-group__message': attributes.group
+        }
+        if (attributes.class) {
+            classes[attributes.class] = true
+        }
+        if (attributes.theme) {
+            classes[attributes.theme] = true
+        }
+
+        let headerClasses = {
+            'o-message__header':           true,
+            'l-message-group__merge-hide': true,
+            'u-mb-50':                    !attributes.compact,
+        }
+
+    mixin content 
+        if slots.header
+            header(class=headerClasses)
+                - slots.header()
+        else if user
+            header(class=headerClasses)
+                strong= user
+        span.s-links.s-links--colored
+            - slots.body()
+        if slots.time
+            small.o-message__suffix
+                - slots.time()
+        if slots.footer
+            footer.o-message__footer
+                - slots.footer()
+
+    article(class=classes)
+        if user && attributes.avatar
+            .l-media.l-media--flush.l-flex--align-start
+                .l-media__block.u-mt-50.u-p-sticky-top
+                    +avatar= user.slice(0, 2)
+                .l-media__block.l-media__block--main
+                    +content
+        else
+            +content