diff --git a/.eslintrc.js b/.eslintrc.js
index add372a0b..31146aefe 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -46,6 +46,7 @@ module.exports = {
"react/forbid-prop-types": 0,
"jsx-quotes": [2, "prefer-single"],
"jsx-a11y/href-no-hash": 0,
+ "jsx-a11y/aria-role": 0,
"import/prefer-default-export": 0,
"import/no-cycle": 0,
"camelcase": 0,
diff --git a/__tests__/__snapshots__/Storyshots.test.js.snap b/__tests__/__snapshots__/Storyshots.test.js.snap
index 78185ec1c..52cde22be 100644
--- a/__tests__/__snapshots__/Storyshots.test.js.snap
+++ b/__tests__/__snapshots__/Storyshots.test.js.snap
@@ -1,882 +1,316 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`Storyshots Avatar list Avatar 1`] = `
-
-
-
- Avatar by text
-
-
-
+
-
-
-
-
- Avatar by roomId
-
-
-
-
-
-
-
- Avatar by url
-
-
-
+
+
+`;
+
+exports[`Storyshots Avatar Avatar by roomId 1`] = `
+
+
+
-
-
-
-
- Avatar by path
-
-
-
-
-
-
-
- With ETag
-
-
-
+
+
+`;
+
+exports[`Storyshots Avatar Avatar by text 1`] = `
+
+
+
-
-
-
-
- Without ETag
-
-
-
-
-
-
-
- Emoji
-
-
-
+
+
+`;
+
+exports[`Storyshots Avatar Avatar by url 1`] = `
+
+
+
-
-
-
-
- Direct
-
-
-
-
-
-
-
- Channel
-
-
-
+
+
+`;
+
+exports[`Storyshots Avatar Channel 1`] = `
+
+
+
-
-
-
-
- Touchable
-
-
-
-
-
-
-
-
-
- Static
-
-
-
+
+
+`;
+
+exports[`Storyshots Avatar Children 1`] = `
+
+
+
-
-
-
-
- Custom borderRadius
-
-
-
-
-
-
-
+
+
- Children
-
-
-
-
-
-
+
+
+
+`;
+
+exports[`Storyshots Avatar Custom borderRadius 1`] = `
+
+
+
-
-
-
-
-
-
- Wrong server
-
-
+
+
+`;
+
+exports[`Storyshots Avatar Custom style 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots Avatar Direct 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots Avatar Emoji 1`] = `
+
+
-
+
-
-
-
-
- Custom style
-
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "absolute",
+ "right": 0,
+ "top": 0,
+ }
+ }
+ />
+
+
+`;
+
+exports[`Storyshots Avatar Static 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots Avatar Touchable 1`] = `
+
+
-
-
-
+ }
+ />
-
+
+`;
+
+exports[`Storyshots Avatar With ETag 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots Avatar Without ETag 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots Avatar Wrong server 1`] = `
+
+
+
+
+
`;
exports[`Storyshots BackgroundContainer basic 1`] = `
@@ -10450,16 +10205,2090 @@ exports[`Storyshots List with small font 1`] = `
`;
-exports[`Storyshots Markdown list Markdown 1`] = `
-
+
+
+
+
+
+ This is block quote
+
+
+
+
+
+
+ this is a normal line
+
+
+
+`;
+
+exports[`Storyshots Markdown Code 1`] = `
+
+
+
+ This is
+
+
+ inline code
+
+
+
+
+ Inline
+
+
+ code
+
+
+ has
+
+
+ back-ticks around
+
+
+ it.
+
+
+
+ Code block
+
+
+
+`;
+
+exports[`Storyshots Markdown Edited 1`] = `
+
+
+
+ This is edited
+
+
+ (
+ edited
+ )
+
+
+
+`;
+
+exports[`Storyshots Markdown Emoji 1`] = `
+
+
+
+ Unicode: 😃😇👍
+
+
+
+
+ Shortnames:
+
+
+ 😂
+
+
+ 👍
+
+
+
+
+ Custom emojis:
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 😃
+
+
+ 👍
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Markdown Hashtag 1`] = `
+
+
+
+ #test-channel
+
+
+
+
+
+ #unknown
+
+
+
+`;
+
+exports[`Storyshots Markdown Headers 1`] = `
+
+
+
+ Header 1
+
+
+
+
+ Header 2
+
+
+
+
+ Header 3
+
+
+
+
+ Header 4
+
+
+
+
+ Header 5
+
+
+
+
+ Header 6
+
+
+
+`;
+
+exports[`Storyshots Markdown Image 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots Markdown Links 1`] = `
+
+
+
+
+ Markdown link
+
+
+
+ :
+
+
+ [description](url)
+
+
+
+
+
+ Formatted Link
+
+
+
+ :
+
+
+ <url|description>
+
+
+
+`;
+
+exports[`Storyshots Markdown Lists 1`] = `
+
+
+
+
+ •
+
+
+
+
+
+ Open Source
+
+
+
+
+
+
+
+ •
+
+
+
+
+
+ Rocket.Chat
+
+
+
+
+
+ ◦
+
+
+
+
+
+ nodejs
+
+
+
+
+
+
+
+ ◦
+
+
+
+
+
+ ReactNative
+
+
+
+
+
+
+
+
+
+ 1.
+
+
+
+
+
+ Open Source
+
+
+
+
+
+
+
+ 2.
+
+
+
+
+
+ Rocket.Chat
+
+
+
+
+
+`;
+
+exports[`Storyshots Markdown Mentions 1`] = `
+
- Short Text
-
-
-
- This is Rocket.Chat
-
-
-
-
- Long Text
-
-
-
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
-
-
- Line Break Text
-
-
-
-
- a
-
-
-
-
-
-
- b
-
-
-
-
-
-
- c
-
-
-
-
-
-
-
-
-
-
- d
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- e
-
-
-
-
- Sequential empty spaces
-
-
-
-
- a b c
-
-
-
-
- Edited
-
-
-
-
- This is edited
-
-
- (
- edited
- )
-
-
-
-
- Preview
-
-
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+ rocket.cat
- a b c d e
-
-
- a b c
-
-
- @rocket.cat @name1 @all @here @unknown #general #unknown
-
-
- Testing: 😃 👍 :marioparty:
-
-
-
- Mentions
-
-
-
-
- rocket.cat
-
-
-
-
-
- name1
-
-
-
-
-
- all
-
-
-
-
-
- here
-
-
-
-
-
- @unknown
-
-
-
-
- Mentions with Real Name
-
-
-
-
- Rocket Cat
-
-
-
-
-
- Name
-
-
-
-
-
- all
-
-
-
-
-
- here
-
-
-
-
-
- @unknown
-
-
-
-
- Hashtag
-
-
-
-
- #test-channel
-
-
-
-
-
- #unknown
-
-
-
-
- Emoji
-
-
-
-
- Unicode: 😃😇👍
-
-
-
-
- Shortnames:
-
-
- 😂
-
-
- 👍
-
-
-
-
- Custom emojis:
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- 😃
-
-
- 👍
-
-
-
-
-
-
-
-
-
-
- Block Quote
-
-
-
-
-
-
-
- This is block quote
-
-
-
-
-
-
- this is a normal line
-
-
-
-
- Links
-
-
-
-
-
- Markdown link
-
-
-
- :
-
-
- [description](url)
-
-
-
-
-
- Formatted Link
-
-
-
- :
-
-
- <url|description>
-
-
-
-
- Image
-
-
-
-
-
-
-
- Headers
-
-
-
-
- Header 1
-
-
-
-
- Header 2
-
-
-
-
- Header 3
-
-
-
-
- Header 4
-
-
-
-
- Header 5
-
-
-
-
- Header 6
-
-
-
-
- Inline Code
-
-
-
-
- This is
-
-
- inline code
-
-
-
-
- Code Block
-
-
-
-
- Inline
-
-
- code
-
-
- has
-
-
- back-ticks around
-
-
- it.
-
-
-
- Code block
-
-
-
-
- Lists
-
-
-
-
-
- •
-
-
-
-
-
- Open Source
-
-
-
-
-
-
-
- •
-
-
-
-
-
- Rocket.Chat
-
-
-
-
-
- ◦
-
-
-
-
-
- nodejs
-
-
-
-
-
+
+
+
+ name1
+
+
-
-
- ◦
-
-
-
-
-
- ReactNative
-
-
-
-
-
-
-
-
- Numbered Lists
-
-
-
-
-
- 1.
-
-
-
-
-
- Open Source
-
-
-
-
-
+
-
-
- 2.
-
-
-
+
-
-
- Rocket.Chat
-
-
-
-
-
-
- Emphasis
-
-
+ >
+
+
+
+ here
+
+
+
+
-
- Strong emphasis, aka bold, with
-
-
- asterisks
-
-
- or
-
-
- underscores
-
+ @unknown
-
+
- Table
-
-
-
-
+
-
-
-
-
-
-
- First Header
-
-
-
-
-
-
- Second Header
-
-
-
-
-
-
-
-
- Content from cell 1
-
-
-
-
-
-
- Content from cell 2
-
-
-
-
-
-
-
-
- Content in the first column
-
-
-
-
-
-
- Content in the second column
-
-
-
-
-
-
-
-
+
+
+
+ Name
+
+
+
+
+
+ all
+
+
- Click to see full table
-
-
-
+ ],
+ ]
+ }
+ >
+
+
+
+ here
+
+
+
+
+
+ @unknown
+
+
`;
-exports[`Storyshots Message list message 1`] = `
+exports[`Storyshots Markdown Preview 1`] = `
+
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
+ a b c d e
+
+
+ a b c
+
+
+ @rocket.cat @name1 @all @here @unknown #general #unknown
+
+
+ Testing: 😃 👍 :marioparty:
+
+
+`;
+
+exports[`Storyshots Markdown Table 1`] = `
+
+
+
+
+
+
+
+
+
+ First Header
+
+
+
+
+
+
+ Second Header
+
+
+
+
+
+
+
+
+ Content from cell 1
+
+
+
+
+
+
+ Content from cell 2
+
+
+
+
+
+
+
+
+ Content in the first column
+
+
+
+
+
+
+ Content in the second column
+
+
+
+
+
+
+
+
+ Click to see full table
+
+
+
+`;
+
+exports[`Storyshots Markdown Text 1`] = `
+
+
+
+ This is Rocket.Chat
+
+
+
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
+
+
+ a
+
+
+
+
+
+
+ b
+
+
+
+
+
+
+ c
+
+
+
+
+
+
+
+
+
+
+ d
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ e
+
+
+
+
+ a b c
+
+
+
+
+ Strong emphasis, aka bold, with
+
+
+ asterisks
+
+
+ or
+
+
+ underscores
+
+
+
+`;
+
+exports[`Storyshots Message Archived 1`] = `
-
- Simple
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ This message is inside an archived room
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Basic 1`] = `
+
+
-
- Long message
-
-
- Grouped messages
-
+
+
+`;
+
+exports[`Storyshots Message Block Quote 1`] = `
+
+
-
-
- ...
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
-
- 10:00 AM
-
-
-
-
-
- Different user
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- This is the third message
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- This is the second message
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- This is the first message
-
-
-
-
-
-
-
-
-
- Without header
-
-
-
-
-
-
-
-
-
- Message
-
-
-
-
-
-
-
-
-
- With alias
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Diego Mello
- @
- diego.mello
+
+ Testing block quote
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+
+
+
+ Testing block quote
+
+
+
+
+
+
+ Testing block quote
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Broadcast 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Broadcasted message
+
+
+
+
+
+
+
+
+
+ Reply
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Colored attachments 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+
+
+
+ Field 1
+
+
+
+ Value 1
+
+
+
+
+
+ Field 2
+
+
+
+ Value 2
+
+
+
+
+
+
+
+
+
+
+
+ Field 1
+
+
+
+ Value 1
+
+
+
+
+
+ Field 2
+
+
+
+ Value 2
+
+
+
+
+
+
+
+
+
+
+
+ Field 1
+
+
+
+ Value 1
+
+
+
+
+
+ Field 2
+
+
+
+ Value 2
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Custom fields 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+
+ rocket.cat
+
+
+
+
+ Custom fields
+
+
+
+
+
+ Field 1
+
+
+
+ Value 1
+
+
+
+
+
+ Field 2
+
+
+
+ Value 2
+
+
+
+
+
+ Field 3
+
+
+
+ Value 3
+
+
+
+
+
+ Field 4
+
+
+
+ Value 4
+
+
+
+
+
+ Field 5
+
+
+
+ Value 5
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Custom style 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Message
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Date and Unread separators 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Fourth message
+
+
+
+
+
+
+
+
+
+
+ unread
+
+
+
+ November 10, 2017
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Third message
+
+
+
+
+
+
+
+
+
+
+ unread
+
+
+
+
+
+
+
+
+
+
+
+ Second message
+
+
+
@@ -16413,7 +18073,7 @@ exports[`Storyshots Message list message 1`] = `
Object {
"headers": undefined,
"priority": "high",
- "uri": "https://open.rocket.chat/avatar/Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.?format=png&size=36",
+ "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
}
}
style={
@@ -16489,26 +18149,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Diego Mello
-
- @
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
+ rocket.cat
- Message
+ Second message
@@ -16585,27 +18226,1636 @@ exports[`Storyshots Message list message 1`] = `
-
- Edited
-
+
+
+ November 10, 2017
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ First message
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Discussion 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+ Started a discussion:
+
+
+ This is a discussion
+
+
+
+
+
+
+
+ No messages yet
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+ Started a discussion:
+
+
+ This is a discussion
+
+
+
+
+
+
+
+ 1 message
+
+
+
+ November 10, 2017
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+ Started a discussion:
+
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
+
+
+
+
+
+ 10 messages
+
+
+
+ November 10, 2017
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+ Started a discussion:
+
+
+ This is a discussion
+
+
+
+
+
+
+
+ +999 messages
+
+
+
+ November 10, 2017
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Edited 1`] = `
+
+
-
+
+`;
+
+exports[`Storyshots Message Editing 1`] = `
+
+
+
- Encrypted
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Message being edited
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Emojis 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ 👊🤙👏
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ 👏
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ 🤙
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ 🤙
+
+
+
+
+
+ 🤙🤙
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Encrypted 1`] = `
+
+
-
- Block Quote
-
-
+
+`;
+
+exports[`Storyshots Message Error 1`] = `
+
+
+
+
-
+ >
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
- 10:00 AM
+ diego.mello
-
-
+ 10:00 AM
+
+
+
-
-
-
-
- Testing block quote
-
-
-
-
+
+
+
+
+
+ This message has error
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+
+
+
+
+
+ This message has error too
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Full name 1`] = `
+
+
- diego.mello
+ Diego Mello
-
-
-
-
-
- Testing block quote
-
-
-
-
- Testing block quote
+ Message
@@ -20280,27 +25622,1111 @@ exports[`Storyshots Message list message 1`] = `
-
+
+`;
+
+exports[`Storyshots Message Grouped messages 1`] = `
+
+
+
- Lists
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ ...
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Different user
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ This is the third message
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ This is the second message
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ This is the first message
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Ignored 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Message ignored. Tap to display it.
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Lists 1`] = `
+
+
-
- Numerated lists
-
-
- Numerated lists in separated messages
-
-
- Static avatar
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Message
-
-
-
-
-
-
-
-
-
- Full name
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Diego Mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Message
-
-
-
-
-
-
-
-
-
- Mentions
-
+
+
+`;
+
+exports[`Storyshots Message Mentions 1`] = `
+
+
-
- Emojis
-
+
+
+`;
+
+exports[`Storyshots Message Message with read receipt 1`] = `
+
+
- 👊🤙👏
-
-
-
-
-
-
-
-
-
- Single Emoji
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- 👏
-
-
-
-
-
-
-
-
-
- Custom Emojis
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Single Custom Emojis
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Normal Emoji + Custom Emojis
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- 🤙
-
-
-
-
-
-
-
-
-
-
-
-
- Four emoji
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- 🤙
-
-
-
-
-
- 🤙🤙
+ I'm fine!
@@ -24843,5818 +29116,6 @@ exports[`Storyshots Message list message 1`] = `
-
- Time format
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10 November 2017
-
-
-
-
-
- Testing
-
-
-
-
-
-
-
-
-
- Reactions
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Reactions
-
-
-
-
-
-
-
- 😂
-
-
- 3
-
-
-
-
-
-
-
-
-
- 13
-
-
-
-
-
-
- 🤔
-
-
- 1
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Multiple reactions
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Multiple Reactions
-
-
-
-
-
-
-
-
-
-
- 1
-
-
-
-
-
-
-
-
-
- 1
-
-
-
-
-
-
-
-
-
- 1
-
-
-
-
-
-
- ❤️
-
-
- 1
-
-
-
-
-
-
- 🐶
-
-
- 1
-
-
-
-
-
-
- 😀
-
-
- 1
-
-
-
-
-
-
- 😬
-
-
- 1
-
-
-
-
-
-
- 😁
-
-
- 1
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Intercalated users
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
- 10:00 AM
-
-
-
-
-
- Fourth message
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Third message
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
- 10:00 AM
-
-
-
-
-
- Second message
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- First message
-
-
-
-
-
-
-
-
-
- Date and Unread separators
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
- 10:00 AM
-
-
-
-
-
- Fourth message
-
-
-
-
-
-
-
-
-
-
- unread
-
-
-
- November 10, 2017
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Third message
-
-
-
-
-
-
-
-
-
-
- unread
-
-
-
-
-
-
-
-
-
-
-
- Second message
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
- 10:00 AM
-
-
-
-
-
- Second message
-
-
-
-
-
-
-
-
-
-
-
- November 10, 2017
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- First message
-
-
-
-
-
-
-
-
-
- With image
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
-
-
-
-
-
-
- This is a description
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
-
-
-
-
-
-
- This is a description
-
-
-
-
-
-
-
-
-
-
-
-
-
- With video
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
-
-
-
-
- This is a description
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- With audio
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
-
-
-
- 00:00
-
-
-
-
- This is a description
-
-
-
-
-
-
-
-
-
-
- First message
+ I'm fine!
@@ -30757,615 +29218,6 @@ exports[`Storyshots Message list message 1`] = `
-
-
-
-
-
-
-
-
-
-
-
-
- 00:00
-
-
-
-
- This is a description
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- 00:00
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- 00:00
-
-
-
-
-
-
-
-
- With file
-
-
-
-
-
-
- File.pdf
-
-
-
-
-
+
- This is a description
-
-
-
-
-
+ >
+ I'm fine!
+
+
+
+
+
+
@@ -31769,109 +29528,9 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
-
-
-
-
-
- File.pdf
-
-
-
-
-
+
- This is a description
-
-
-
-
-
+ >
+ I'm fine!
+
+
+
+
+
+
-
- Message with reply
-
+
+
+`;
+
+exports[`Storyshots Message Message with reply 1`] = `
+
+
I'm a very long long title and I'll break
-
- 10:00 AM
-
rocket.cat
-
- 10:00 AM
-
-
- Message with read receipt
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- I'm fine!
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- I'm fine!
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- I'm fine!
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- I'm fine!
-
-
-
-
-
-
-
-
-
-
-
-
- Message with thread
-
+
+
+`;
+
+exports[`Storyshots Message Message with thread 1`] = `
+
+
-
-
-
-
-
-
-
-
- Markdown: link block code
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- I'm fine!
-
-
-
-
-
-
-
-
+
+`;
+
+exports[`Storyshots Message Reactions 1`] = `
+
+
+
- Sequential thread messages following thread button
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Reactions
+
+
+
+
+
+
+
+ 😂
+
+
+ 1
+
+
+
+
+
+
+
+
+
+ 99
+
+
+
+
+
+
+ 🤔
+
+
+ 999
+
+
+
+
+
+
+ 🤔
+
+
+ 9999
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Multiple Reactions
+
+
+
+
+
+
+
+
+
+
+ 1
+
+
+
+
+
+
+
+
+
+ 1
+
+
+
+
+
+
+
+
+
+ 1
+
+
+
+
+
+
+ ❤️
+
+
+ 1
+
+
+
+
+
+
+ 🐶
+
+
+ 1
+
+
+
+
+
+
+ 😀
+
+
+ 1
+
+
+
+
+
+
+ 😬
+
+
+ 1
+
+
+
+
+
+
+ 😁
+
+
+ 1
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Sequential thread messages following thread button 1`] = `
+
+
-
- Sequential thread messages following thread reply
-
+
+
+`;
+
+exports[`Storyshots Message Sequential thread messages following thread reply 1`] = `
+
+
-
+
+`;
+
+exports[`Storyshots Message Static avatar 1`] = `
+
+
+
- Discussion
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Message
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message System messages 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ Message removed
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ has joined the channel
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ Message pinned
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ has left the channel
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ User rocket.cat removed by diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ User rocket.cat added by diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ User rocket.cat muted by diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ User rocket.cat unmuted by diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat was set admin by diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat is no longer admin by diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Room name changed to: New name by diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Room description changed to: new description by diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Room announcement changed to: new announcement by diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Room topic changed to: new topic by diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Room type changed to: public by diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ This room's encryption has been disabled by diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ This room's encryption has been enabled by diego.mello
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Temp 1`] = `
+
+
-
- Started a discussion:
-
-
+
+ Temp message
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message Time format 1`] = `
+
+
+
+
+
+
+
+
- This is a discussion
-
+
+
+
+
+
+
-
-
-
- No messages yet
+ diego.mello
+ >
+ 10 November 2017
+
+
+
+
+
+ Testing
+
+
+
+
+`;
+
+exports[`Storyshots Message Two short custom fields with markdown 1`] = `
+
+
-
- Started a discussion:
-
-
- This is a discussion
-
-
-
-
-
-
-
- 1 message
-
-
+
- November 10, 2017
+
+ Message
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+ >
+
+ rocket.cat
+
+
- diego.mello
+
+ Custom fields
+
-
-
- 10:00 AM
-
-
-
- Started a discussion:
-
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
-
-
-
-
-
- 10 messages
-
+
+
+ Field 1
+
+
+
+ Value 1
+
+
+
+
+
+ Field 2
+
+
+
+
+ Value 2
+
+
+
+
+
-
- November 10, 2017
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+ >
+
+ rocket.cat
+
+
- diego.mello
+
+ Custom fields 2
+
-
-
- 10:00 AM
-
-
-
- Started a discussion:
-
-
- This is a discussion
-
-
-
-
-
-
-
- +999 messages
-
+
+
+ Field 1
+
+
+
+ Value 1
+
+
+
+
+
+ Field 2
+
+
+
+ Value 2
+
+
+
+
-
- November 10, 2017
-
-
- URL
-
+
+
+`;
+
+exports[`Storyshots Message URL 1`] = `
+
+
-
+
+`;
+
+exports[`Storyshots Message With alias 1`] = `
+
+
+
- Custom fields
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Diego Mello
+
+ @
+ diego.mello
+
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Message
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Diego Mello
+
+ @
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Message
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message With audio 1`] = `
+
+
-
+
+
+
+
+
+
+ 00:00
+
+
+
+
-
- Message
-
+ This is a description
-
-
-
-
- rocket.cat
-
-
- 10:00 AM
-
-
-
-
+
- Custom fields
-
-
-
-
-
- Field 1
-
-
-
- Value 1
-
-
-
-
-
- Field 2
-
-
-
- Value 2
-
-
-
-
-
- Field 3
-
-
-
- Value 3
-
-
-
-
-
- Field 4
-
-
-
- Value 4
-
-
-
-
-
- Field 5
-
-
-
- Value 5
-
-
-
-
+ />
-
+
-
- Two short custom fields with markdown
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
- Message
+ First message
-
-
-
-
- rocket.cat
-
-
- 10:00 AM
-
-
-
-
- Custom fields
-
-
-
-
-
- Field 1
-
-
-
- Value 1
-
-
-
-
-
- Field 2
-
-
-
-
- Value 2
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
- 10:00 AM
-
-
-
-
- Custom fields 2
-
-
-
-
-
- Field 1
-
-
-
- Value 1
-
-
-
-
-
- Field 2
-
-
-
- Value 2
-
-
-
-
-
-
-
- Colored attachments
-
+
+
+
+
+
+
+
+
+
+
+
+ 00:00
+
+
+
+
+ This is a description
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 00:00
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 00:00
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message With file 1`] = `
+
+
-
-
-
- Field 1
-
-
-
- Value 1
-
-
-
-
-
- Field 2
-
-
-
- Value 2
-
-
-
-
+ File.pdf
+
+
-
-
-
+
+
-
-
- Field 1
-
-
-
- Value 1
-
-
-
-
-
- Field 2
-
-
-
- Value 2
-
-
-
-
+ }
+ />
-
-
+
+
+
+
+
+
+
+
+
+
-
-
-
-
- Field 1
-
-
-
- Value 1
-
-
-
-
-
- Field 2
-
-
-
- Value 2
-
-
-
-
-
-
+ "marginLeft": 46,
+ },
+ false,
+ ]
+ }
+ >
+
-
+
+ File.pdf
+
+
+
+
+
+
+ This is a description
+
+
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Message With image 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+
-
- Invalid color
-
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "absolute",
+ "right": 0,
+ "top": 0,
+ }
+ }
+ />
+
+
+ This is a description
+
+
@@ -42029,27 +43076,6 @@ exports[`Storyshots Message list message 1`] = `
-
- Broadcast
-
-
-
+
+ }
+ >
+
+
+
+
+
+
+
- Broadcasted message
-
-
-
-
-
-
-
-
-
- Reply
+ Array [
+ Object {},
+ Object {
+ "alignItems": "flex-start",
+ "flexDirection": "row",
+ "flexWrap": "wrap",
+ "justifyContent": "flex-start",
+ "marginBottom": 0,
+ "marginTop": 0,
+ },
+ ],
+ ]
+ }
+ >
+ This is a description
+
+
+
+
@@ -42373,27 +43428,19 @@ exports[`Storyshots Message list message 1`] = `
-
- Archived
-
+
+
+`;
+
+exports[`Storyshots Message With video 1`] = `
+
+
-
-
-
- This message is inside an archived room
-
-
-
-
-
-
-
-
-
- Error
-
-
-
-
-
-
-
-
-
-
-
-
-
+
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
+
-
-
- This message has error
+ This is a description
+
+
+
-
-
+ }
+ >
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
- diego.mello
+ 10:00 AM
-
- 10:00 AM
-
+
@@ -43057,8 +43972,8 @@ exports[`Storyshots Message list message 1`] = `
style={
Array [
Object {
- "color": "#f5455c",
- "fontSize": 18,
+ "color": "#ffffff",
+ "fontSize": 54,
},
undefined,
Object {
@@ -43070,323 +43985,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
-
-
-
-
-
-
-
- This message has error too
-
-
-
-
-
-
-
-
- Temp
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Temp message
-
+
@@ -43394,27 +43993,19 @@ exports[`Storyshots Message list message 1`] = `
-
- Editing
-
+
+
+`;
+
+exports[`Storyshots Message Without header 1`] = `
+
+
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Message being edited
-
-
-
-
-
-
-
-
-
- Removed
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- Message removed
-
-
-
-
-
-
-
-
- Joined
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- has joined the channel
-
-
-
-
-
-
-
-
- Room name changed
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Room name changed to: New name by diego.mello
-
-
-
-
-
-
-
- Message pinned
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- Message pinned
-
-
-
-
-
-
-
-
- Has left the channel
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- has left the channel
-
-
-
-
-
-
-
-
- User removed
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- User rocket.cat removed by diego.mello
-
-
-
-
-
-
-
- User added
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- User rocket.cat added by diego.mello
-
-
-
-
-
-
-
- User muted
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- User rocket.cat muted by diego.mello
-
-
-
-
-
-
-
- User unmuted
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- User rocket.cat unmuted by diego.mello
-
-
-
-
-
-
-
- Role added
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat was set admin by diego.mello
-
-
-
-
-
-
-
- Role removed
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat is no longer admin by diego.mello
-
-
-
-
-
-
-
- Changed description
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Room description changed to: new description by diego.mello
-
-
-
-
-
-
-
- Changed announcement
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Room announcement changed to: new announcement by diego.mello
-
-
-
-
-
-
-
- Changed topic
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Room topic changed to: new topic by diego.mello
-
-
-
-
-
-
-
- Changed type
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Room type changed to: public by diego.mello
-
-
-
-
-
-
-
- Toggle e2e encryption
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- This room's encryption has been disabled by diego.mello
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- This room's encryption has been enabled by diego.mello
-
-
-
-
-
-
-
- Ignored
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Message ignored. Tap to display it.
-
-
-
-
-
-
-
-
- Custom style
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
- Markdown emphasis
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Italic with single
-
-
- underscore
-
-
- or double
-
-
- underscores
-
-
- . Bold with single
-
-
- asterisk
-
-
- or double
-
-
- asterisks
-
-
- . Strikethrough with single
-
-
- Strikethrough
-
-
- or double
-
-
- Strikethrough
-
-
-
-
-
-
-
-
-
- Markdown headers
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- H1
-
-
-
-
- H2
-
-
-
-
- H3
-
-
-
-
- H4
-
-
-
-
- H5
-
-
-
-
- H6
-
-
-
-
-
-
-
-
-
- Markdown links
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Support
-
-
-
- Google
-
-
-
-
-
-
-
- I\`m an inline-style link
-
-
-
-
-
-
-
- https://google.com
-
-
-
-
-
-
-
-
-
-
- Starting with empty link
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- <- No link should render
-
-
-
-
-
-
-
-
-
- Markdown image
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
-
-
-
-
-
-
-
- Markdown code
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Inline
-
-
- code
-
-
- has
-
-
- back-ticks around
-
-
- it.
-
-
-
- Code block
-
-
-
-
-
-
-
-
-
- Markdown quote
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
-
-
- Quote
-
-
-
-
-
-
-
-
-
-
-
- Markdown table
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
-
-
-
-
-
- First Header
-
-
-
-
-
-
- Second Header
-
-
-
-
-
-
-
-
- Content from cell 1
-
-
-
-
-
-
- Content from cell 2
-
-
-
-
-
-
-
-
- Content in the first column
-
-
-
-
-
-
- Content in the second column
-
-
-
-
-
-
-
-
- Click to see full table
-
-
-
-
-
-
-
-
`;
-exports[`Storyshots RoomHeader icons 1`] = `
-Array [
-
-
-
-
-
-
-
-
-
- private channel
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- public channel
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- discussion
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- omnichannel
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- private team
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- public team
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- group dm
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- online dm
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- away dm
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- busy dm
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- loading dm
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- offline dm
-
-
-
-
-
- ,
-]
-`;
-
-exports[`Storyshots RoomHeader landscape 1`] = `
-Array [
-
-
-
-
-
-
-
-
-
- title
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- title
-
-
-
- subtitle
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
-
-
-
- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
-
-
-
-
- ,
-]
-`;
-
-exports[`Storyshots RoomHeader themes 1`] = `
-Array [
-
-
-
-
-
-
-
-
-
- title
-
-
-
- subtitle
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- title
-
-
-
- subtitle
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- title
-
-
-
- subtitle
-
-
-
-
- ,
-]
-`;
-
-exports[`Storyshots RoomHeader thread 1`] = `
-Array [
-
-
-
-
-
-
- title
-
-
-
-
-
-
-
- parent title
-
-
-
-
-
- ,
-
-
-
-
-
-
- markdown preview #3 4 5
-
-
-
-
-
-
-
- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
-
-
-
-
-
- ,
-]
-`;
-
-exports[`Storyshots RoomHeader title and subtitle 1`] = `
-Array [
-
-
-
-
-
-
-
-
-
- title
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
-
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- title
-
-
-
- subtitle
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- title
-
-
-
- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
-
-
-
- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
-
-
-
-
- ,
-]
-`;
-
-exports[`Storyshots RoomHeader typing 1`] = `
-Array [
-
-
-
-
-
-
-
-
-
- title
-
-
-
-
- user 1
-
-
- is typing
- ...
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- title
-
-
-
-
- user 1 and user 2
-
-
- are typing
- ...
-
-
-
-
- ,
-
-
-
-
-
-
-
-
-
- title
-
-
-
-
- user 1, user 2, user 3, user 4, user 5
-
-
- are typing
- ...
-
-
-
-
- ,
-]
-`;
-
-exports[`Storyshots RoomItem list roomitem 1`] = `
+exports[`Storyshots Room Item Alerts 1`] = `
-
- Basic
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
- User
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
-
-
-
-
-
-
-
- Type
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
- User status
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read
-
-
-
-
-
-
-
-
-
-
- Favorite
-
-
-
-
-
-
-
- Hide
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
-
-
-
-
- Alerts
-
-
+
+`;
+
+exports[`Storyshots Room Item Basic 1`] = `
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
- Last Message
-
+ "transform": Array [
+ Object {
+ "translateX": 0,
+ },
+ ],
+ }
+ }
+ >
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Room Item Last Message 1`] = `
+
+
`;
+exports[`Storyshots Room Item Type 1`] = `
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Room Item User 1`] = `
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Room Item User status 1`] = `
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Read
+
+
+
+
+
+
+
+
+
+
+ Favorite
+
+
+
+
+
+
+
+ Hide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots RoomHeader icons 1`] = `
+Array [
+
+
+
+
+
+
+
+
+
+ private channel
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ public channel
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ discussion
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ omnichannel
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ private team
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ public team
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ group dm
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ online dm
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ away dm
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ busy dm
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ loading dm
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ offline dm
+
+
+
+
+
+ ,
+]
+`;
+
+exports[`Storyshots RoomHeader landscape 1`] = `
+Array [
+
+
+
+
+
+
+
+
+
+ title
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ title
+
+
+
+ subtitle
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
+
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
+
+
+ ,
+]
+`;
+
+exports[`Storyshots RoomHeader themes 1`] = `
+Array [
+
+
+
+
+
+
+
+
+
+ title
+
+
+
+ subtitle
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ title
+
+
+
+ subtitle
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ title
+
+
+
+ subtitle
+
+
+
+
+ ,
+]
+`;
+
+exports[`Storyshots RoomHeader thread 1`] = `
+Array [
+
+
+
+
+
+
+ title
+
+
+
+
+
+
+
+ parent title
+
+
+
+
+
+ ,
+
+
+
+
+
+
+ markdown preview #3 4 5
+
+
+
+
+
+
+
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
+
+
+
+ ,
+]
+`;
+
+exports[`Storyshots RoomHeader title and subtitle 1`] = `
+Array [
+
+
+
+
+
+
+
+
+
+ title
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ title
+
+
+
+ subtitle
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ title
+
+
+
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
+
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
+
+
+ ,
+]
+`;
+
+exports[`Storyshots RoomHeader typing 1`] = `
+Array [
+
+
+
+
+
+
+
+
+
+ title
+
+
+
+
+ user 1
+
+
+ is typing
+ ...
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ title
+
+
+
+
+ user 1 and user 2
+
+
+ are typing
+ ...
+
+
+
+
+ ,
+
+
+
+
+
+
+
+
+
+ title
+
+
+
+
+ user 1, user 2, user 3, user 4, user 5
+
+
+ are typing
+ ...
+
+
+
+
+ ,
+]
+`;
+
exports[`Storyshots ServerItem content 1`] = `
Array [
`;
-exports[`Storyshots UiKitMessage list uikitmessage 1`] = `
-
-
+
-
-
- Section
-
-
- Section + Markdown List
-
-
- Section + Overflow
-
-
- Section + image
-
-
- Section + button
-
-
- Section + Select
-
-
- Section + DatePicker
-
-
- Section + Multi Select
-
-
- Image
-
-
- Context
-
-
- Action - Buttons
-
-
- Fields
-
-
- Action - Select
-
-
-
-
+ }
+ />
+
+
`;
-exports[`Storyshots UiKitModal list UiKitModal 1`] = `
-
-
+
+
+
+`;
+
+exports[`Storyshots UiKitMessage Context 1`] = `
+
+
+
-
-
- Modal - Section and Selects
-
-
+
+
+`;
+
+exports[`Storyshots UiKitMessage Fields 1`] = `
+
+
+
- Modal - Section Accessories
-
-
+
+
+`;
+
+exports[`Storyshots UiKitMessage Image 1`] = `
+
+
+
- Modal - Form Input
-
-
+
+
+`;
+
+exports[`Storyshots UiKitMessage Section + DatePicker 1`] = `
+
+
+
- Modal - Form TextArea
-
-
+
+
+`;
+
+exports[`Storyshots UiKitMessage Section + Markdown List 1`] = `
+
+
+
- Modal - Images
-
-
+
+
+`;
+
+exports[`Storyshots UiKitMessage Section + Multi Select 1`] = `
+
+
+
- Modal - Actions
-
-
+
+
+`;
+
+exports[`Storyshots UiKitMessage Section + Overflow 1`] = `
+
+
+
- Modal - Contexts and Dividers
-
-
+
+
+`;
+
+exports[`Storyshots UiKitMessage Section + Select 1`] = `
+
+
+
- Modal - Input with error
-
-
+
+
+`;
+
+exports[`Storyshots UiKitMessage Section + button 1`] = `
+
+
+
- Modal - Multilne with error
-
-
+
+
+`;
+
+exports[`Storyshots UiKitMessage Section + image 1`] = `
+
+
+
- Modal - DatePicker with error
-
-
-
-
+ }
+ />
+
+
+`;
+
+exports[`Storyshots UiKitMessage Section 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots UiKitModal Modal - Actions 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots UiKitModal Modal - Contexts and Dividers 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots UiKitModal Modal - DatePicker with error 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots UiKitModal Modal - Form Input 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots UiKitModal Modal - Form TextArea 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots UiKitModal Modal - Images 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots UiKitModal Modal - Input with error 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots UiKitModal Modal - Multilne with error 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots UiKitModal Modal - Section Accessories 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots UiKitModal Modal - Section and Selects 1`] = `
+
+
+
+
+
`;
exports[`Storyshots Unread Badge all 1`] = `
diff --git a/storybook/stories/Avatar.js b/storybook/stories/Avatar.js
index fb642728b..9943f832e 100644
--- a/storybook/stories/Avatar.js
+++ b/storybook/stories/Avatar.js
@@ -1,11 +1,10 @@
+/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';
-import { ScrollView, StyleSheet, View } from 'react-native';
-import PropTypes from 'prop-types';
+import { StyleSheet } from 'react-native';
+import { storiesOf } from '@storybook/react-native';
-import { themes } from '../../app/constants/colors';
import Avatar from '../../app/containers/Avatar/Avatar';
import Status from '../../app/containers/Status/Status';
-import StoriesSeparator from './StoriesSeparator';
import sharedStyles from '../../app/views/Styles';
const styles = StyleSheet.create({
@@ -16,125 +15,152 @@ const styles = StyleSheet.create({
const server = 'https://open.rocket.chat';
-const Separator = ({ title, theme }) => ;
-Separator.propTypes = {
- title: PropTypes.string,
- theme: PropTypes.string
-};
+const _theme = 'light';
-const AvatarStories = ({ theme }) => (
-
-
- (
+
+));
+
+stories.add('Avatar by roomId', () => (
+
+));
+
+stories.add('Avatar by url', () => (
+
+));
+
+stories.add('Avatar by path', () => (
+
+));
+
+stories.add('With ETag', () => (
+
+));
+
+stories.add('Without ETag', () => (
+
+));
+
+stories.add('Emoji', () => (
+ ({ name: 'troll', extension: 'jpg' })}
+ server={server}
+ size={56}
+ />
+));
+
+stories.add('Direct', () => (
+
+));
+
+stories.add('Channel', () => (
+
+));
+
+stories.add('Touchable', () => (
+ console.log('Pressed!')}
+ size={56}
+ />
+));
+
+stories.add('Static', () => (
+
+));
+
+stories.add('Avatar by roomId', () => (
+
+));
+
+stories.add('Custom borderRadius', () => (
+
+));
+
+stories.add('Children', () => (
+
+
-
-
-
-
-
-
-
-
-
-
-
- ({ name: 'troll', extension: 'jpg' })}
- server={server}
- size={56}
- />
-
-
-
-
-
- console.log('Pressed!')}
- size={56}
- />
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-);
-AvatarStories.propTypes = {
- theme: PropTypes.string
-};
-export default AvatarStories;
+
+));
+
+stories.add('Wrong server', () => (
+
+));
+
+stories.add('Custom style', () => (
+
+));
diff --git a/storybook/stories/Markdown.js b/storybook/stories/Markdown.js
index 92c969501..bffd5a2aa 100644
--- a/storybook/stories/Markdown.js
+++ b/storybook/stories/Markdown.js
@@ -1,14 +1,19 @@
-/* eslint-disable react/prop-types */
+/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';
import { ScrollView, StyleSheet, View } from 'react-native';
+import { storiesOf } from '@storybook/react-native';
import Markdown from '../../app/containers/markdown';
-import StoriesSeparator from './StoriesSeparator';
import { themes } from '../../app/constants/colors';
+
+const theme = 'light';
+
const styles = StyleSheet.create({
container: {
- marginHorizontal: 15
+ marginHorizontal: 15,
+ backgroundColor: themes[theme].backgroundColor,
+ marginVertical: 50
},
separator: {
marginHorizontal: 10,
@@ -37,258 +42,231 @@ const getCustomEmoji = (content) => {
return customEmoji;
};
-// eslint-disable-next-line arrow-body-style
-export default ({ theme }) => {
- return (
-
-
-
-
-
+const stories = storiesOf('Markdown', module);
-
-
-
-
+stories.add('Text', () => (
+
+
+
+
+
+
+
+));
-
-
-
-
+stories.add('Edited', () => (
+
+
+
+));
-
-
-
-
+stories.add('Preview', () => (
+
+
+
+
+
+
+
+));
-
-
-
-
+stories.add('Mentions', () => (
+
+
+
+
+));
-
-
-
-
-
-
-
-
+stories.add('Hashtag', () => (
+
+
+
+));
-
-
-
-
+stories.add('Emoji', () => (
+
+
+
+
+
+
+));
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- This is block quote
+stories.add('Block quote', () => (
+
+ This is block quote
this is a normal line`}
- theme={theme}
- />
-
+ theme={theme}
+ />
+
+));
-
-
-
-
-
+stories.add('Links', () => (
+
+
+
+
+));
-
-
-
-
-
-
-
-
-
-
-
-
-
+stories.add('Image', () => (
+
+
+
+));
-
-
-
-
+stories.add('Headers', () => (
+
+
+
+
+
+
+
+
+));
-
-
- (
+
+
+
-
+ theme={theme}
+ />
+
+));
-
-
-
-
+stories.add('Lists', () => (
+
+
+
+
+));
-
-
-
-
-
-
-
-
-
-
-
-
- (
+
+
-
-
- );
-};
+ theme={theme}
+ />
+
+));
diff --git a/storybook/stories/Message.js b/storybook/stories/Message.js
index 7be131dbc..82cfa1b03 100644
--- a/storybook/stories/Message.js
+++ b/storybook/stories/Message.js
@@ -1,21 +1,21 @@
+/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';
-import { ScrollView, StyleSheet } from 'react-native';
+import { StyleSheet, ScrollView } from 'react-native';
+import { Provider } from 'react-redux';
+import { storiesOf } from '@storybook/react-native';
// import moment from 'moment';
import MessageComponent from '../../app/containers/message/Message';
-import StoriesSeparator from './StoriesSeparator';
import messagesStatus from '../../app/constants/messagesStatus';
import MessageSeparator from '../../app/views/RoomView/Separator';
+import MessageContext from '../../app/containers/message/Context';
import { themes } from '../../app/constants/colors';
+import { store } from './index';
-let _theme = 'light';
+const _theme = 'light';
const styles = StyleSheet.create({
- separator: {
- marginTop: 30,
- marginBottom: 0
- }
});
const user = {
@@ -40,6 +40,26 @@ const getCustomEmoji = (content) => {
return customEmoji;
};
+const messageDecorator = story => (
+ {},
+ onLongPress: () => {},
+ reactionInit: () => {},
+ onErrorPress: () => {},
+ replyBroadcast: () => {},
+ onReactionPress: () => {},
+ onDiscussionPress: () => {},
+ onReactionLongPress: () => {},
+ threadBadgeColor: themes.light.tunreadColor
+ }}
+ >
+ {story()}
+
+);
+
const Message = props => (
(
/>
);
-// eslint-disable-next-line react/prop-types
-const Separator = ({ title, theme }) => ;
-// eslint-disable-next-line react/prop-types
-export default ({ theme }) => {
- _theme = theme;
- return (
-
-
-
+const stories = storiesOf('Message', module)
+ .addDecorator(story => {story()})
+ .addDecorator(story => {story()})
+ .addDecorator(messageDecorator);
-
-
+stories.add('Basic', () => (
+ <>
+
+
+
+));
-
-
-
-
-
-
+stories.add('Grouped messages', () => (
+ <>
+
+
+
+
+
+
+));
-
-
+stories.add('Without header', () => (
+
+));
-
-
-
+stories.add('With alias', () => (
+ <>
+
+
+
+));
-
-
+stories.add('Edited', () => (
+
+));
-
-
-
- (
+ <>
+
+
+ {}}
+ type='e2e'
+ />
+
+
+
+ alert('Error pressed')}
+ type='e2e'
+ />
+
+
+
+));
+
+stories.add('Block Quote', () => (
+ <>
+
+ Testing block quote\nTesting block quote'} />
+
+));
+
+stories.add('Lists', () => (
+ <>
+
+
+
+
+
+));
+
+stories.add('Static avatar', () => (
+
+));
+
+stories.add('Full name', () => (
+
+));
+
+stories.add('Mentions', () => (
+ <>
+
+
+
+));
+
+stories.add('Emojis', () => (
+ <>
+
+
+
+
+
+
+
+));
+
+stories.add('Time format', () => (
+
+));
+
+stories.add('Reactions', () => (
+ <>
+ {}}
+ />
+ {}}
+ />
+
+));
+
+stories.add('Date and Unread separators', () => (
+ <>
+
+
+
+
+
+
+
+
+
+));
+
+stories.add('With image', () => (
+ <>
+
+
+
+));
+
+stories.add('With video', () => (
+ <>
+
+
+
+));
+
+stories.add('With audio', () => (
+ <>
+
+
+
+
+
+
+));
+
+stories.add('With file', () => (
+ <>
+
+
+
+));
+
+stories.add('Message with reply', () => (
+ <>
+
+
+
+));
+
+stories.add('Message with read receipt', () => (
+ <>
+
+
+
+
+
+));
+
+stories.add('Message with thread', () => (
+ <>
+
+
+
+
+
+
+
+
+));
+
+stories.add('Sequential thread messages following thread button', () => (
+ <>
+
+
+
+
+
+));
+
+stories.add('Sequential thread messages following thread reply', () => (
+ <>
+
+
+
+
+
+));
+
+stories.add('Discussion', () => (
+ <>
+
+
+
+
+
+));
+
+stories.add('URL', () => (
+ <>
+
+
+
+
+));
+
+stories.add('Custom fields', () => (
+ <>
+ {}}
- type='e2e'
- />
-
-
-
- alert('Error pressed')}
- type='e2e'
- />
-
-
-
-
-
- Testing block quote\nTesting block quote'} />
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+ title: 'Field 5',
+ value: 'Value 5'
+ }]
+ }]}
+ />
+
+));
-
-
+stories.add('Two short custom fields with markdown', () => (
+
+));
-
-
+stories.add('Colored attachments', () => (
+
+));
-
-
+stories.add('Broadcast', () => (
+ alert('broadcast!')} />
+));
-
-
+stories.add('Archived', () => (
+
+));
-
-
+stories.add('Error', () => (
+ <>
+ alert('Error pressed')} />
+ alert('Error pressed')} isHeader={false} />
+
+));
-
-
+stories.add('Temp', () => (
+
+));
-
-
+stories.add('Editing', () => (
+
+));
-
- {}}
- />
+stories.add('System messages', () => (
+ <>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+));
-
- {}}
- />
+stories.add('Ignored', () => (
+
+));
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {/*
-
-
- */}
-
-
-
-
-
-
- {/*
-
-
- */}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- alert('broadcast!')} />
-
-
-
-
-
- alert('Error pressed')} />
- alert('Error pressed')} isHeader={false} />
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- );
-};
+stories.add('Custom style', () => (
+
+));
diff --git a/storybook/stories/RoomItem.js b/storybook/stories/RoomItem.js
index 819a149b2..d39e92082 100644
--- a/storybook/stories/RoomItem.js
+++ b/storybook/stories/RoomItem.js
@@ -1,15 +1,18 @@
+/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';
import { ScrollView, Dimensions } from 'react-native';
+import { storiesOf } from '@storybook/react-native';
+import { Provider } from 'react-redux';
// import moment from 'moment';
import { themes } from '../../app/constants/colors';
import RoomItemComponent from '../../app/presentation/RoomItem/RoomItem';
import { longText } from '../utils';
-import StoriesSeparator from './StoriesSeparator';
+import { store } from './index';
const baseUrl = 'https://open.rocket.chat';
const { width } = Dimensions.get('window');
-let _theme = 'light';
+const _theme = 'light';
const lastMessage = {
u: {
username: 'diego.mello'
@@ -22,7 +25,6 @@ const updatedAt = {
const RoomItem = props => (
(
/>
);
-// eslint-disable-next-line react/prop-types
-const Separator = ({ title }) => ;
+const stories = storiesOf('Room Item', module)
+ .addDecorator(story => {story()})
+ .addDecorator(story => {story()});
-// eslint-disable-next-line react/prop-types
-export default ({ theme }) => {
- _theme = theme;
- return (
-
-
-
-
-
-
+stories.add('Basic', () => (
+
+));
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+stories.add('User', () => (
+ <>
+
+
+
+));
-
-
-
-
-
-
-
-
-
-
-
-
+stories.add('Type', () => (
+ <>
+
+
+
+
+
+
+
+
+));
-
-
-
-
-
-
-
-
-
- );
-};
+stories.add('User status', () => (
+ <>
+
+
+
+
+
+
+
+));
+
+stories.add('Alerts', () => (
+ <>
+
+
+
+
+
+
+
+
+
+
+
+
+));
+
+stories.add('Last Message', () => (
+ <>
+
+
+
+
+
+
+
+
+));
diff --git a/storybook/stories/StoriesSeparator.js b/storybook/stories/StoriesSeparator.js
deleted file mode 100644
index a24fa1d04..000000000
--- a/storybook/stories/StoriesSeparator.js
+++ /dev/null
@@ -1,36 +0,0 @@
-import React from 'react';
-import { Text, StyleSheet } from 'react-native';
-import PropTypes from 'prop-types';
-
-import { themes } from '../../app/constants/colors';
-
-const styles = StyleSheet.create({
- separator: {
- marginVertical: 30,
- marginLeft: 10,
- fontSize: 20,
- fontWeight: '300'
- }
-});
-
-const Separator = ({ title, style, theme }) => (
-
- {title}
-
-);
-
-Separator.propTypes = {
- title: PropTypes.string.isRequired,
- theme: PropTypes.string,
- style: PropTypes.object
-};
-
-export default Separator;
diff --git a/storybook/stories/UiKitMessage.js b/storybook/stories/UiKitMessage.js
index 68d81adc6..4fa2865f8 100644
--- a/storybook/stories/UiKitMessage.js
+++ b/storybook/stories/UiKitMessage.js
@@ -1,11 +1,11 @@
+/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';
import { ScrollView, StyleSheet, SafeAreaView } from 'react-native';
+import { storiesOf } from '@storybook/react-native';
+import MessageContext from '../../app/containers/message/Context';
import { UiKitMessage } from '../../app/containers/UIKit';
-import StoriesSeparator from './StoriesSeparator';
-
-// eslint-disable-next-line react/prop-types
-const Separator = ({ title }) => ;
+import { themes } from '../../app/constants/colors';
const styles = StyleSheet.create({
container: {
@@ -17,426 +17,435 @@ const styles = StyleSheet.create({
}
});
-export default () => (
-
-
-
- {
- UiKitMessage([{
- type: 'section',
+const user = {
+ id: 'y8bd77ptZswPj3EW8',
+ username: 'diego.mello',
+ token: '79q6lH40W4ZRGLOshDiDiVlQaCc4f_lU9HNdHLAzuHz'
+};
+
+const baseUrl = 'https://open.rocket.chat';
+
+const messageDecorator = story => (
+ {},
+ onLongPress: () => {},
+ reactionInit: () => {},
+ onErrorPress: () => {},
+ replyBroadcast: () => {},
+ onReactionPress: () => {},
+ onDiscussionPress: () => {},
+ onReactionLongPress: () => {},
+ threadBadgeColor: themes.light.tunreadColor
+ }}
+ >
+ {story()}
+
+);
+
+const stories = storiesOf('UiKitMessage', module)
+ .addDecorator(story => {story()})
+ .addDecorator(story => {story()})
+ .addDecorator(messageDecorator);
+
+const Section = () => UiKitMessage([{
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'Section'
+ }
+}]);
+stories.add('Section', () => );
+
+const SectionMarkdownList = () => UiKitMessage([{
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: '*List*:\n1. Item'
+ }
+}]);
+stories.add('Section + Markdown List', () => );
+
+const SectionOverflow = () => UiKitMessage([
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'Section + Overflow'
+ },
+ accessory: {
+ type: 'overflow',
+ options: [
+ {
text: {
- type: 'mrkdwn',
- text: 'Section'
- }
- }])
- }
-
-
- {
- UiKitMessage([{
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: '*List*:\n1. Item'
- }
- }])
- }
-
-
- {
- UiKitMessage([
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: 'Section + Overflow'
- },
- accessory: {
- type: 'overflow',
- options: [
- {
- text: {
- type: 'plain_text',
- text: 'Option 1',
- emoji: true
- },
- value: 'value-0'
- },
- {
- text: {
- type: 'plain_text',
- text: 'Option 2',
- emoji: true
- },
- value: 'value-1'
- },
- {
- text: {
- type: 'plain_text',
- text: 'Option 3',
- emoji: true
- },
- value: 'value-2'
- },
- {
- text: {
- type: 'plain_text',
- text: 'Option 4',
- emoji: true
- },
- value: 'value-3'
- }
- ]
- }
- }
- ])
- }
-
-
- {
- UiKitMessage([{
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: 'Section + Image'
- },
- accessory: {
- type: 'image',
- imageUrl: 'https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artwork/master/Logos/icon-circle-256.png',
- altText: 'plants'
- }
- }])
- }
-
-
- {
- UiKitMessage([{
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: 'Section + button'
- },
- accessory: {
- type: 'button',
- text: {
- type: 'plain_text',
- text: 'button'
- }
- }
- }])
- }
-
-
- {
- UiKitMessage([{
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: 'Section + select'
- },
- accessory: {
- type: 'static_select',
- options: [
- {
- value: 1,
- text: {
- type: 'plain_text',
- text: 'button'
- }
- }, {
- value: 2,
- text: {
- type: 'plain_text',
- text: 'second button'
- }
- }]
- }
- }])
- }
-
-
- {
- UiKitMessage([{
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: 'Section + DatePicker'
- },
- accessory: {
- type: 'datepicker',
- initial_date: '1990-04-28',
- placeholder: {
- type: 'plain_text',
- text: 'Select a date',
- emoji: true
- }
- }
- }])
- }
-
-
- {
- UiKitMessage([{
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: 'Section + select'
- },
- accessory: {
- type: 'multi_static_select',
- options: [{
- text: {
- type: 'plain_text',
- text: 'button'
- },
- value: 1
- }, {
- text: {
- type: 'plain_text',
- text: 'opt 1'
- },
- value: 2
- }, {
- text: {
- type: 'plain_text',
- text: 'opt 2'
- },
- value: 3
- }, {
- text: {
- type: 'plain_text',
- text: 'opt 3'
- },
- value: 4
- }]
- }
- }])
- }
-
-
- {
- UiKitMessage([{
- type: 'image',
- title: {
type: 'plain_text',
- text: 'Example Image',
+ text: 'Option 1',
emoji: true
},
- imageUrl: 'https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artwork/master/Logos/icon-circle-256.png',
- altText: 'Example Image'
- }])
- }
-
-
- {
- UiKitMessage([{
- type: 'context',
- elements: [{
- type: 'image',
- title: {
- type: 'plain_text',
- text: 'Example Image',
- emoji: true
- },
- imageUrl: 'https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artwork/master/Logos/icon-circle-256.png',
- altText: 'Example Image'
+ value: 'value-0'
+ },
+ {
+ text: {
+ type: 'plain_text',
+ text: 'Option 2',
+ emoji: true
},
- {
- type: 'mrkdwn',
- text: 'context'
- }
- ]
- }])
- }
+ value: 'value-1'
+ },
+ {
+ text: {
+ type: 'plain_text',
+ text: 'Option 3',
+ emoji: true
+ },
+ value: 'value-2'
+ },
+ {
+ text: {
+ type: 'plain_text',
+ text: 'Option 4',
+ emoji: true
+ },
+ value: 'value-3'
+ }
+ ]
+ }
+ }
+]);
+stories.add('Section + Overflow', () => );
-
- {
- UiKitMessage([{
- type: 'actions',
- elements: [
- {
- type: 'button',
- text: {
- type: 'plain_text',
- emoji: true,
- text: 'Approve'
- },
- style: 'primary',
- value: 'click_me_123'
- },
- {
- type: 'button',
- text: {
- type: 'plain_text',
- emoji: true,
- text: 'Deny'
- },
- style: 'danger',
- value: 'click_me_123'
- },
- {
- type: 'button',
- text: {
- type: 'plain_text',
- emoji: true,
- text: 'Deny'
- },
- style: 'danger',
- value: 'click_me_123'
- },
- {
- type: 'button',
- text: {
- type: 'plain_text',
- emoji: true,
- text: 'Deny'
- },
- style: 'danger',
- value: 'click_me_123'
- },
- {
- type: 'button',
- text: {
- type: 'plain_text',
- emoji: true,
- text: 'Deny'
- },
- style: 'danger',
- value: 'click_me_123'
- },
- {
- type: 'button',
- text: {
- type: 'plain_text',
- emoji: true,
- text: 'Deny'
- },
- style: 'danger',
- value: 'click_me_123'
- },
- {
- type: 'button',
- text: {
- type: 'plain_text',
- emoji: true,
- text: 'Deny'
- },
- style: 'danger',
- value: 'click_me_123'
- }
- ]
- }])
- }
+const SectionImage = () => UiKitMessage([{
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'Section + Image'
+ },
+ accessory: {
+ type: 'image',
+ imageUrl: 'https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artwork/master/Logos/icon-circle-256.png',
+ altText: 'plants'
+ }
+}]);
+stories.add('Section + image', () => );
-
- {
- UiKitMessage([
- {
- type: 'section',
- fields: [
- {
- type: 'plain_text',
- text: '*this is plain_text text*',
- emoji: true
- },
- {
- type: 'plain_text',
- text: '*this is plain_text text*',
- emoji: true
- },
- {
- type: 'plain_text',
- text: '*this is plain_text text*',
- emoji: true
- },
- {
- type: 'plain_text',
- text: '*this is plain_text text*',
- emoji: true
- },
- {
- type: 'plain_text',
- text: '*this is plain_text text*',
- emoji: true
- }
- ]
- }])
- }
+const SectionButton = () => UiKitMessage([{
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'Section + button'
+ },
+ accessory: {
+ type: 'button',
+ text: {
+ type: 'plain_text',
+ text: 'button'
+ }
+ }
+}]);
+stories.add('Section + button', () => );
-
+const SectionSelect = () => UiKitMessage([{
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'Section + select'
+ },
+ accessory: {
+ type: 'static_select',
+ options: [
{
- UiKitMessage([{
- type: 'actions',
- elements: [
- {
- type: 'conversations_select',
- placeholder: {
- type: 'plain_text',
- text: 'Select a conversation',
- emoji: true
- }
- },
- {
- type: 'channels_select',
- placeholder: {
- type: 'plain_text',
- text: 'Select a channel',
- emoji: true
- }
- },
- {
- type: 'users_select',
- placeholder: {
- type: 'plain_text',
- text: 'Select a user',
- emoji: true
- }
- },
- {
- type: 'static_select',
- placeholder: {
- type: 'plain_text',
- text: 'Select an item',
- emoji: true
- },
- options: [
- {
- text: {
- type: 'plain_text',
- text: 'Excellent item 1',
- emoji: true
- },
- value: 'value-0'
- },
- {
- text: {
- type: 'plain_text',
- text: 'Fantastic item 2',
- emoji: true
- },
- value: 'value-1'
- },
- {
- text: {
- type: 'plain_text',
- text: 'Nifty item 3',
- emoji: true
- },
- value: 'value-2'
- },
- {
- text: {
- type: 'plain_text',
- text: 'Pretty good item 4',
- emoji: true
- },
- value: 'value-3'
- }
- ]
- }
- ]
- }])
+ value: 1,
+ text: {
+ type: 'plain_text',
+ text: 'button'
+ }
+ }, {
+ value: 2,
+ text: {
+ type: 'plain_text',
+ text: 'second button'
+ }
+ }]
+ }
+}]);
+stories.add('Section + Select', () => );
+
+const SectionDatePicker = () => UiKitMessage([{
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'Section + DatePicker'
+ },
+ accessory: {
+ type: 'datepicker',
+ initial_date: '1990-04-28',
+ placeholder: {
+ type: 'plain_text',
+ text: 'Select a date',
+ emoji: true
+ }
+ }
+}]);
+stories.add('Section + DatePicker', () => );
+
+const SectionMultiSelect = () => UiKitMessage([{
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'Section + select'
+ },
+ accessory: {
+ type: 'multi_static_select',
+ options: [{
+ text: {
+ type: 'plain_text',
+ text: 'button'
+ },
+ value: 1
+ }, {
+ text: {
+ type: 'plain_text',
+ text: 'opt 1'
+ },
+ value: 2
+ }, {
+ text: {
+ type: 'plain_text',
+ text: 'opt 2'
+ },
+ value: 3
+ }, {
+ text: {
+ type: 'plain_text',
+ text: 'opt 3'
+ },
+ value: 4
+ }]
+ }
+}]);
+stories.add('Section + Multi Select', () => );
+
+const Image = () => UiKitMessage([{
+ type: 'image',
+ title: {
+ type: 'plain_text',
+ text: 'Example Image',
+ emoji: true
+ },
+ imageUrl: 'https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artwork/master/Logos/icon-circle-256.png',
+ altText: 'Example Image'
+}]);
+stories.add('Image', () => );
+
+const Context = () => UiKitMessage([{
+ type: 'context',
+ elements: [{
+ type: 'image',
+ title: {
+ type: 'plain_text',
+ text: 'Example Image',
+ emoji: true
+ },
+ imageUrl: 'https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artwork/master/Logos/icon-circle-256.png',
+ altText: 'Example Image'
+ },
+ {
+ type: 'mrkdwn',
+ text: 'context'
+ }
+ ]
+}]);
+stories.add('Context', () => );
+
+const ActionButton = () => UiKitMessage([{
+ type: 'actions',
+ elements: [
+ {
+ type: 'button',
+ text: {
+ type: 'plain_text',
+ emoji: true,
+ text: 'Approve'
+ },
+ style: 'primary',
+ value: 'click_me_123'
+ },
+ {
+ type: 'button',
+ text: {
+ type: 'plain_text',
+ emoji: true,
+ text: 'Deny'
+ },
+ style: 'danger',
+ value: 'click_me_123'
+ },
+ {
+ type: 'button',
+ text: {
+ type: 'plain_text',
+ emoji: true,
+ text: 'Deny'
+ },
+ style: 'danger',
+ value: 'click_me_123'
+ },
+ {
+ type: 'button',
+ text: {
+ type: 'plain_text',
+ emoji: true,
+ text: 'Deny'
+ },
+ style: 'danger',
+ value: 'click_me_123'
+ },
+ {
+ type: 'button',
+ text: {
+ type: 'plain_text',
+ emoji: true,
+ text: 'Deny'
+ },
+ style: 'danger',
+ value: 'click_me_123'
+ },
+ {
+ type: 'button',
+ text: {
+ type: 'plain_text',
+ emoji: true,
+ text: 'Deny'
+ },
+ style: 'danger',
+ value: 'click_me_123'
+ },
+ {
+ type: 'button',
+ text: {
+ type: 'plain_text',
+ emoji: true,
+ text: 'Deny'
+ },
+ style: 'danger',
+ value: 'click_me_123'
+ }
+ ]
+}]);
+stories.add('Action - Buttons', () => );
+
+const Fields = () => UiKitMessage([
+ {
+ type: 'section',
+ fields: [
+ {
+ type: 'plain_text',
+ text: '*this is plain_text text*',
+ emoji: true
+ },
+ {
+ type: 'plain_text',
+ text: '*this is plain_text text*',
+ emoji: true
+ },
+ {
+ type: 'plain_text',
+ text: '*this is plain_text text*',
+ emoji: true
+ },
+ {
+ type: 'plain_text',
+ text: '*this is plain_text text*',
+ emoji: true
+ },
+ {
+ type: 'plain_text',
+ text: '*this is plain_text text*',
+ emoji: true
}
-
-
-);
+ ]
+ }]);
+stories.add('Fields', () => );
+
+const ActionSelect = () => UiKitMessage([{
+ type: 'actions',
+ elements: [
+ {
+ type: 'conversations_select',
+ placeholder: {
+ type: 'plain_text',
+ text: 'Select a conversation',
+ emoji: true
+ }
+ },
+ {
+ type: 'channels_select',
+ placeholder: {
+ type: 'plain_text',
+ text: 'Select a channel',
+ emoji: true
+ }
+ },
+ {
+ type: 'users_select',
+ placeholder: {
+ type: 'plain_text',
+ text: 'Select a user',
+ emoji: true
+ }
+ },
+ {
+ type: 'static_select',
+ placeholder: {
+ type: 'plain_text',
+ text: 'Select an item',
+ emoji: true
+ },
+ options: [
+ {
+ text: {
+ type: 'plain_text',
+ text: 'Excellent item 1',
+ emoji: true
+ },
+ value: 'value-0'
+ },
+ {
+ text: {
+ type: 'plain_text',
+ text: 'Fantastic item 2',
+ emoji: true
+ },
+ value: 'value-1'
+ },
+ {
+ text: {
+ type: 'plain_text',
+ text: 'Nifty item 3',
+ emoji: true
+ },
+ value: 'value-2'
+ },
+ {
+ text: {
+ type: 'plain_text',
+ text: 'Pretty good item 4',
+ emoji: true
+ },
+ value: 'value-3'
+ }
+ ]
+ }
+ ]
+}]);
+stories.add('Action - Select', () => );
+
+// stories.add('Section', () => UiKitMessage([{
+// type: 'section',
+// text: {
+// type: 'mrkdwn',
+// text: 'Section'
+// }
+// }]));
diff --git a/storybook/stories/UiKitModal.js b/storybook/stories/UiKitModal.js
index ddbfab6a6..2ec9e1da6 100644
--- a/storybook/stories/UiKitModal.js
+++ b/storybook/stories/UiKitModal.js
@@ -1,12 +1,12 @@
+/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';
import { ScrollView, StyleSheet, SafeAreaView } from 'react-native';
+import { storiesOf } from '@storybook/react-native';
import { UiKitModal, UiKitComponent } from '../../app/containers/UIKit';
import { KitContext, defaultContext } from '../../app/containers/UIKit/utils';
-import StoriesSeparator from './StoriesSeparator';
-
-// eslint-disable-next-line react/prop-types
-const Separator = ({ title }) => ;
+import MessageContext from '../../app/containers/message/Context';
+import { themes } from '../../app/constants/colors';
const styles = StyleSheet.create({
container: {
@@ -18,547 +18,566 @@ const styles = StyleSheet.create({
}
});
-export default () => (
-
-
-
- {
- UiKitModal([
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: '*Rocket.Chat is free, unlimited and open source* 🚀\nIf you have any doubt ask to @rocketcat'
- }
- },
- {
- type: 'divider'
- },
- {
- type: 'section',
- fields: [
- {
- type: 'mrkdwn',
- text: '*Text 1*\nDescription, Mussum Ipsum, cacilds vidis litro'
- },
- {
- type: 'mrkdwn',
- text: '*Text 2*\nDescription, Mussum Ipsum, cacilds vidis litro'
- }
- ]
- },
- {
- type: 'section',
- fields: [
- {
- type: 'mrkdwn',
- text: '*Text 3*\nDescription, Mussum Ipsum, cacilds vidis litro'
- },
- {
- type: 'mrkdwn',
- text: '*Text 4*\nDescription, Mussum Ipsum, cacilds vidis litro'
- }
- ]
- }
- ])
- }
+const user = {
+ id: 'y8bd77ptZswPj3EW8',
+ username: 'diego.mello',
+ token: '79q6lH40W4ZRGLOshDiDiVlQaCc4f_lU9HNdHLAzuHz'
+};
-
- {
- UiKitModal([
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: '*Bruno Quadros*,\nPlease review your details for your *travel expense*.\nExpense no. *DA921*.'
- },
- accessory: {
- type: 'image',
- imageUrl: 'https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artwork/master/Logos/icon-circle-256.png'
- }
- },
- {
- type: 'divider'
- },
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: '*Date:*\n11/02/2020'
- }
- },
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: '*Category:*\nTravel'
- }
- },
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: '*Cost:*\n$150.00 USD'
- }
- },
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: '*Notes:*\nWebSummit Conference'
- }
- }
- ])
- }
+const baseUrl = 'https://open.rocket.chat';
-
- {
- UiKitModal([
- {
- type: 'input',
- element: {
- type: 'plain_text_input'
- },
- label: {
- type: 'plain_text',
- text: 'Outgoing Title',
- emoji: true
- },
- hint: {
- type: 'plain_text',
- text: 'Pick something unique!',
- emoji: true
- }
- },
- {
- type: 'input',
- element: {
- type: 'datepicker',
- initial_date: '1990-04-28',
- placeholder: {
- type: 'plain_text',
- text: 'Select a date',
- emoji: true
- }
- },
- label: {
- type: 'plain_text',
- text: 'Set a date',
- emoji: true
- }
- },
- {
- type: 'input',
- element: {
- type: 'multi_static_select',
- options: [{
- text: {
- type: 'plain_text',
- text: 'John'
- },
- value: 1
- }, {
- text: {
- type: 'plain_text',
- text: 'Dog'
- },
- value: 2
- }]
- },
- label: {
- type: 'plain_text',
- text: 'Share with...',
- emoji: true
- }
- }
- ])
- }
+const messageDecorator = story => (
+ {},
+ onLongPress: () => {},
+ reactionInit: () => {},
+ onErrorPress: () => {},
+ replyBroadcast: () => {},
+ onReactionPress: () => {},
+ onDiscussionPress: () => {},
+ onReactionLongPress: () => {},
+ threadBadgeColor: themes.light.tunreadColor
+ }}
+ >
+ {story()}
+
+);
-
- {
- UiKitModal([
- {
- type: 'context',
- elements: [{
- type: 'mrkdwn',
- text: 'Task: ZOL-994'
- }]
- },
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: 'Update Spec final assets'
- },
- accessory: {
- type: 'button',
- text: {
- type: 'plain_text',
- text: 'Change'
- }
- }
- },
- {
- type: 'divider'
- },
- {
- type: 'input',
- element: {
- type: 'plain_text_input',
- multiline: true
- },
- placeholder: {
- type: 'plain_text',
- text: 'Write Something',
- emoji: true
- },
- label: {
- type: 'plain_text',
- text: 'Notes',
- emoji: true
- },
- hint: {
- type: 'plain_text',
- text: 'Please take the time to compose something short',
- emoji: true
- },
- description: {
- type: 'plain_text',
- text: 'Describe your update',
- emoji: true
- }
- }
- ])
- }
+const stories = storiesOf('UiKitModal', module)
+ .addDecorator(story => {story()})
+ .addDecorator(story => {story()})
+ .addDecorator(messageDecorator);
-
+const ModalSectionSelects = () => UiKitModal([
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: '*Rocket.Chat is free, unlimited and open source* 🚀\nIf you have any doubt ask to @rocketcat'
+ }
+ },
+ {
+ type: 'divider'
+ },
+ {
+ type: 'section',
+ fields: [
{
- UiKitModal([
- {
- type: 'image',
- title: {
- type: 'plain_text',
- text: 'Example Image',
- emoji: true
- },
- imageUrl: 'https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artwork/master/Logos/icon-circle-256.png',
- alt_text: 'Example Image'
- },
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: 'How could be the life in Mars?'
- }
- },
- {
- type: 'context',
- elements: [
- {
- type: 'image',
- imageUrl: 'https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artwork/master/Logos/icon-circle-256.png'
- },
- {
- type: 'mrkdwn',
- text: 'November 25, 2019'
- }
- ]
- },
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: '*Next stop, Mars!*\nMussum Ipsum, cacilds vidis litro abertis. Admodum accumsan disputationi eu sit. Vide electram sadipscing et per. Diuretics paradis num copo é motivis de denguis. Mais vale um bebadis conhecidiss, que um alcoolatra anonimis. Aenean aliquam molestie leo, vitae iaculis nisl.'
- }
- }
- ])
+ type: 'mrkdwn',
+ text: '*Text 1*\nDescription, Mussum Ipsum, cacilds vidis litro'
+ },
+ {
+ type: 'mrkdwn',
+ text: '*Text 2*\nDescription, Mussum Ipsum, cacilds vidis litro'
}
-
-
+ ]
+ },
+ {
+ type: 'section',
+ fields: [
{
- UiKitModal([{
- type: 'input',
- element: {
- type: 'plain_text_input'
- },
- label: {
- type: 'plain_text',
- text: 'Title',
- emoji: true
- }
+ type: 'mrkdwn',
+ text: '*Text 3*\nDescription, Mussum Ipsum, cacilds vidis litro'
+ },
+ {
+ type: 'mrkdwn',
+ text: '*Text 4*\nDescription, Mussum Ipsum, cacilds vidis litro'
+ }
+ ]
+ }
+]);
+stories.add('Modal - Section and Selects', () => );
+
+const ModalSectionAccessories = () => UiKitModal([
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: '*Bruno Quadros*,\nPlease review your details for your *travel expense*.\nExpense no. *DA921*.'
+ },
+ accessory: {
+ type: 'image',
+ imageUrl: 'https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artwork/master/Logos/icon-circle-256.png'
+ }
+ },
+ {
+ type: 'divider'
+ },
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: '*Date:*\n11/02/2020'
+ }
+ },
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: '*Category:*\nTravel'
+ }
+ },
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: '*Cost:*\n$150.00 USD'
+ }
+ },
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: '*Notes:*\nWebSummit Conference'
+ }
+ }
+]);
+stories.add('Modal - Section Accessories', () => );
+
+const ModalFormInput = () => UiKitModal([
+ {
+ type: 'input',
+ element: {
+ type: 'plain_text_input'
+ },
+ label: {
+ type: 'plain_text',
+ text: 'Outgoing Title',
+ emoji: true
+ },
+ hint: {
+ type: 'plain_text',
+ text: 'Pick something unique!',
+ emoji: true
+ }
+ },
+ {
+ type: 'input',
+ element: {
+ type: 'datepicker',
+ initial_date: '1990-04-28',
+ placeholder: {
+ type: 'plain_text',
+ text: 'Select a date',
+ emoji: true
+ }
+ },
+ label: {
+ type: 'plain_text',
+ text: 'Set a date',
+ emoji: true
+ }
+ },
+ {
+ type: 'input',
+ element: {
+ type: 'multi_static_select',
+ options: [{
+ text: {
+ type: 'plain_text',
+ text: 'John'
},
+ value: 1
+ }, {
+ text: {
+ type: 'plain_text',
+ text: 'Dog'
+ },
+ value: 2
+ }]
+ },
+ label: {
+ type: 'plain_text',
+ text: 'Share with...',
+ emoji: true
+ }
+ }
+]);
+stories.add('Modal - Form Input', () => );
+
+const ModalFormTextArea = () => UiKitModal([
+ {
+ type: 'context',
+ elements: [{
+ type: 'mrkdwn',
+ text: 'Task: ZOL-994'
+ }]
+ },
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'Update Spec final assets'
+ },
+ accessory: {
+ type: 'button',
+ text: {
+ type: 'plain_text',
+ text: 'Change'
+ }
+ }
+ },
+ {
+ type: 'divider'
+ },
+ {
+ type: 'input',
+ element: {
+ type: 'plain_text_input',
+ multiline: true
+ },
+ placeholder: {
+ type: 'plain_text',
+ text: 'Write Something',
+ emoji: true
+ },
+ label: {
+ type: 'plain_text',
+ text: 'Notes',
+ emoji: true
+ },
+ hint: {
+ type: 'plain_text',
+ text: 'Please take the time to compose something short',
+ emoji: true
+ },
+ description: {
+ type: 'plain_text',
+ text: 'Describe your update',
+ emoji: true
+ }
+ }
+]);
+stories.add('Modal - Form TextArea', () => );
+
+const ModalImages = () => UiKitModal([
+ {
+ type: 'image',
+ title: {
+ type: 'plain_text',
+ text: 'Example Image',
+ emoji: true
+ },
+ imageUrl: 'https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artwork/master/Logos/icon-circle-256.png',
+ alt_text: 'Example Image'
+ },
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'How could be the life in Mars?'
+ }
+ },
+ {
+ type: 'context',
+ elements: [
+ {
+ type: 'image',
+ imageUrl: 'https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artwork/master/Logos/icon-circle-256.png'
+ },
+ {
+ type: 'mrkdwn',
+ text: 'November 25, 2019'
+ }
+ ]
+ },
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: '*Next stop, Mars!*\nMussum Ipsum, cacilds vidis litro abertis. Admodum accumsan disputationi eu sit. Vide electram sadipscing et per. Diuretics paradis num copo é motivis de denguis. Mais vale um bebadis conhecidiss, que um alcoolatra anonimis. Aenean aliquam molestie leo, vitae iaculis nisl.'
+ }
+ }
+]);
+stories.add('Modal - Images', () => );
+
+const ModalActions = () => UiKitModal([{
+ type: 'input',
+ element: {
+ type: 'plain_text_input'
+ },
+ label: {
+ type: 'plain_text',
+ text: 'Title',
+ emoji: true
+ }
+},
+{
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'Details'
+ }
+},
+{
+ type: 'section',
+ accessory: {
+ type: 'static_select',
+ options: [
+ {
+ value: 1,
+ text: {
+ type: 'plain_text',
+ text: 'TypeL Task'
+ }
+ }, {
+ value: 2,
+ text: {
+ type: 'plain_text',
+ text: 'second button'
+ }
+ }]
+ }
+},
+{
+ type: 'section',
+ accessory: {
+ type: 'static_select',
+ options: [
+ {
+ value: 1,
+ text: {
+ type: 'plain_text',
+ text: 'Project: Space (winter)'
+ }
+ }, {
+ value: 2,
+ text: {
+ type: 'plain_text',
+ text: 'second button'
+ }
+ }]
+ }
+},
+{
+ type: 'section',
+ accessory: {
+ type: 'static_select',
+ options: [
+ {
+ value: 1,
+ text: {
+ type: 'plain_text',
+ text: 'Priority (optional)'
+ }
+ }, {
+ value: 2,
+ text: {
+ type: 'plain_text',
+ text: 'second button'
+ }
+ }]
+ }
+},
+{
+ type: 'section',
+ accessory: {
+ type: 'static_select',
+ options: [
+ {
+ value: 1,
+ text: {
+ type: 'plain_text',
+ text: 'Assinee (optional)'
+ }
+ }, {
+ value: 2,
+ text: {
+ type: 'plain_text',
+ text: 'second button'
+ }
+ }]
+ }
+},
+{
+ type: 'input',
+ element: {
+ type: 'plain_text_input',
+ multiline: true
+ },
+ placeholder: {
+ type: 'plain_text',
+ text: 'Write Something',
+ emoji: true
+ },
+ label: {
+ type: 'plain_text',
+ text: 'Description',
+ emoji: true
+ }
+}]);
+stories.add('Modal - Actions', () => );
+
+const ModalContextsDividers = () => UiKitModal([
+ {
+ type: 'context',
+ elements: [{
+ type: 'mrkdwn',
+ text: 'Due today'
+ }]
+ },
+ {
+ type: 'divider'
+ },
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'Finish interface componests (3 hours)'
+ },
+ accessory: {
+ blockId: 'overflow-1',
+ type: 'overflow',
+ options: [
{
- type: 'section',
text: {
- type: 'mrkdwn',
- text: 'Details'
- }
- },
- {
- type: 'section',
- accessory: {
- type: 'static_select',
- options: [
- {
- value: 1,
- text: {
- type: 'plain_text',
- text: 'TypeL Task'
- }
- }, {
- value: 2,
- text: {
- type: 'plain_text',
- text: 'second button'
- }
- }]
- }
- },
- {
- type: 'section',
- accessory: {
- type: 'static_select',
- options: [
- {
- value: 1,
- text: {
- type: 'plain_text',
- text: 'Project: Space (winter)'
- }
- }, {
- value: 2,
- text: {
- type: 'plain_text',
- text: 'second button'
- }
- }]
- }
- },
- {
- type: 'section',
- accessory: {
- type: 'static_select',
- options: [
- {
- value: 1,
- text: {
- type: 'plain_text',
- text: 'Priority (optional)'
- }
- }, {
- value: 2,
- text: {
- type: 'plain_text',
- text: 'second button'
- }
- }]
- }
- },
- {
- type: 'section',
- accessory: {
- type: 'static_select',
- options: [
- {
- value: 1,
- text: {
- type: 'plain_text',
- text: 'Assinee (optional)'
- }
- }, {
- value: 2,
- text: {
- type: 'plain_text',
- text: 'second button'
- }
- }]
- }
- },
- {
- type: 'input',
- element: {
- type: 'plain_text_input',
- multiline: true
+ type: 'plain_text',
+ text: 'Details',
+ emoji: true
},
+ value: 'value-0'
+ },
+ {
+ text: {
+ type: 'plain_text',
+ text: 'Remove',
+ emoji: true
+ },
+ value: 'value-1'
+ }
+ ]
+ }
+ },
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'English Class (1 hour)'
+ },
+ accessory: {
+ blockId: 'overflow-2',
+ type: 'overflow',
+ options: [
+ {
+ text: {
+ type: 'plain_text',
+ text: 'Details',
+ emoji: true
+ },
+ value: 'value-0'
+ },
+ {
+ text: {
+ type: 'plain_text',
+ text: 'Remove',
+ emoji: true
+ },
+ value: 'value-1'
+ }
+ ]
+ }
+ },
+ {
+ type: 'section',
+ text: {
+ type: 'mrkdwn',
+ text: 'Send an email to John (15min)'
+ },
+ accessory: {
+ blockId: 'overflow-3',
+ type: 'overflow',
+ options: [
+ {
+ text: {
+ type: 'plain_text',
+ text: 'Details',
+ emoji: true
+ },
+ value: 'value-0'
+ },
+ {
+ text: {
+ type: 'plain_text',
+ text: 'Remove',
+ emoji: true
+ },
+ value: 'value-1'
+ }
+ ]
+ }
+ }
+]);
+stories.add('Modal - Contexts and Dividers', () => );
+
+const ModalInputWithError = () => (
+
+
+
+);
+stories.add('Modal - Input with error', () => );
+
+const ModalMultilneWithError = () => (
+
+
+
+);
+stories.add('Modal - Multilne with error', () => );
+
+const ModalDatePickerWithError = () => (
+
+
- {
- UiKitModal([
- {
- type: 'context',
- elements: [{
- type: 'mrkdwn',
- text: 'Due today'
- }]
- },
- {
- type: 'divider'
- },
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: 'Finish interface componests (3 hours)'
- },
- accessory: {
- blockId: 'overflow-1',
- type: 'overflow',
- options: [
- {
- text: {
- type: 'plain_text',
- text: 'Details',
- emoji: true
- },
- value: 'value-0'
- },
- {
- text: {
- type: 'plain_text',
- text: 'Remove',
- emoji: true
- },
- value: 'value-1'
- }
- ]
- }
- },
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: 'English Class (1 hour)'
- },
- accessory: {
- blockId: 'overflow-2',
- type: 'overflow',
- options: [
- {
- text: {
- type: 'plain_text',
- text: 'Details',
- emoji: true
- },
- value: 'value-0'
- },
- {
- text: {
- type: 'plain_text',
- text: 'Remove',
- emoji: true
- },
- value: 'value-1'
- }
- ]
- }
- },
- {
- type: 'section',
- text: {
- type: 'mrkdwn',
- text: 'Send an email to John (15min)'
- },
- accessory: {
- blockId: 'overflow-3',
- type: 'overflow',
- options: [
- {
- text: {
- type: 'plain_text',
- text: 'Details',
- emoji: true
- },
- value: 'value-0'
- },
- {
- text: {
- type: 'plain_text',
- text: 'Remove',
- emoji: true
- },
- value: 'value-1'
- }
- ]
- }
- }
- ])
- }
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+ },
+ label: {
+ type: 'plain_text',
+ text: 'Label',
+ emoji: true
+ }
+ }]}
+ />
+
);
+stories.add('Modal - DatePicker with error', () => );
diff --git a/storybook/stories/index.js b/storybook/stories/index.js
index cd84085c1..20bfc4f25 100644
--- a/storybook/stories/index.js
+++ b/storybook/stories/index.js
@@ -1,37 +1,22 @@
/* eslint-disable import/no-extraneous-dependencies, import/no-unresolved, import/extensions */
-import React from 'react';
-import { Provider } from 'react-redux';
import { createStore, combineReducers } from 'redux';
-import { storiesOf } from '@storybook/react-native';
-import RoomItem from './RoomItem';
+import './RoomItem';
import './List';
import './ServerItem';
-import Message from './Message';
-import UiKitMessage from './UiKitMessage';
-import UiKitModal from './UiKitModal';
-import Markdown from './Markdown';
+import './Message';
+import './UiKitMessage';
+import './UiKitModal';
+import './Markdown';
import './HeaderButtons';
import './UnreadBadge';
import '../../app/views/ThreadMessagesView/Item.stories.js';
+import './Avatar';
import '../../app/containers/BackgroundContainer/index.stories.js';
import '../../app/containers/RoomHeader/RoomHeader.stories.js';
-import Avatar from './Avatar';
-// import RoomViewHeader from './RoomViewHeader';
-
-import MessageContext from '../../app/containers/message/Context';
-import { themes } from '../../app/constants/colors';
-
-// MessageProvider
-const baseUrl = 'https://open.rocket.chat';
-const user = {
- id: '',
- username: 'diego.mello',
- token: ''
-};
// Change here to see themed storybook
-const theme = 'light';
+export const theme = 'light';
const reducers = combineReducers({
settings: () => ({}),
@@ -52,47 +37,4 @@ const reducers = combineReducers({
meteor: () => ({ connected: true }),
activeUsers: () => ({ abc: { status: 'online', statusText: 'dog' } })
});
-const store = createStore(reducers);
-
-const messageDecorator = story => (
- {},
- onLongPress: () => {},
- reactionInit: () => {},
- onErrorPress: () => {},
- replyBroadcast: () => {},
- onReactionPress: () => {},
- onDiscussionPress: () => {},
- onReactionLongPress: () => {},
- threadBadgeColor: themes.light.tunreadColor
- }}
- >
- {story()}
-
-);
-
-storiesOf('RoomItem', module)
- .addDecorator(story => {story()})
- .add('list roomitem', () => );
-storiesOf('Message', module)
- .addDecorator(story => {story()})
- .addDecorator(messageDecorator)
- .add('list message', () => );
-
-storiesOf('UiKitMessage', module)
- .addDecorator(messageDecorator)
- .add('list uikitmessage', () => );
-storiesOf('UiKitModal', module)
- .addDecorator(messageDecorator)
- .add('list UiKitModal', () => );
-storiesOf('Markdown', module)
- .add('list Markdown', () => );
-storiesOf('Avatar', module)
- .add('list Avatar', () => );
-
-// FIXME: I couldn't make these pass on jest :(
-// storiesOf('RoomViewHeader', module)
-// .add('list', () => );
+export const store = createStore(reducers);