{"action":"created","comment":{"url":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls/comments/185850565","pull_request_review_id":117324104,"id":185850565,"diff_hunk":"@@ -0,0 +1,100 @@\n+import React, {Component} from 'react';\n+import ComponentPage from './ComponentPage.js';\n+import HeaderBar from './HeaderBar.js';\n+import {MDCSnackbar} from '@material/snackbar/dist/mdc.snackbar';\n+\n+import './styles/SnackbarPage.scss';\n+\n+const SnackbarPage = () => {\n+  return (\n+    <div>\n+      <HeaderBar />\n+      <ComponentPage\n+        hero={<SnackbarHero />}\n+        title='Snackbar'\n+        description='Snackbars provide brief feedback about an operation through a message at the bottom of the screen.'\n+        designLink='https://material.io/guidelines/components/snackbars-toasts.html'\n+        docsLink='https://material.io/components/web/catalog/snackbars/'\n+        sourceLink='https://github.com/material-components/material-components-web/tree/master/packages/mdc-snackbar'\n+        demos={<SnackbarDemo />}\n+      />\n+    </div>\n+  );\n+};\n+\n+class SnackbarHero extends Component {\n+  render() {\n+    return (\n+      <div className='snackbar-hero'>\n+        <div className='mdc-snackbar mdc-snackbar--active'\n+            aria-live='assertive'\n+            aria-atomic='true'\n+            aria-hidden='true'>\n+          <div className='mdc-snackbar__text'>Message Sent</div>\n+          <div className='mdc-snackbar__action-wrapper'>\n+            <button type='button' className='mdc-snackbar__action-button'>Undo</button>\n+          </div>\n+        </div>\n+      </div>\n+    )\n+  }\n+}\n+\n+class SnackbarDemo extends Component {\n+  snackbarData = {message: 'Message Sent', actionHandler: () => {}, actionText: 'Undo'};\n+  \n+  initSnackbar = (snackbarEl, isStartAligned) => {\n+    isStartAligned ? \n+      this.startAlignedSnackbar = new MDCSnackbar(snackbarEl) : this.snackbar = new MDCSnackbar(snackbarEl);\n+  }\n+\n+  componentWillUnmount() {\n+    this.snackbar.destroy();\n+    this.startAlignedSnackbar.destroy();\n+  }\n+\n+  handleShowClick = () => {\n+    this.snackbar.show(this.snackbarData);\n+  }\n+\n+  handleShowStartAlignedClick = () => {\n+    this.startAlignedSnackbar.show(this.snackbarData);\n+  }\n+\n+  render() {\n+    return (\n+      <div>\n+        <h3 className='mdc-typography--subheading2'>Snackbars</h3>\n+        <button className='mdc-button mdc-button--raised snackbar-demo-button' onClick={this.handleShowClick}>\n+          Show snackbar\n+        </button>\n+        <button className='mdc-button mdc-button--raised snackbar-demo-button' \n+                onClick={this.handleShowStartAlignedClick}>\n+          Show start aligned\n+        </button>\n+        <div className='mdc-snackbar'\n+          aria-live='assertive'\n+          aria-atomic='true'\n+          aria-hidden='true'\n+          ref={this.initSnackbar}>\n+            <div className='mdc-snackbar__text'></div>\n+            <div className='mdc-snackbar__action-wrapper'>\n+              <button type='button' className='mdc-snackbar__action-button'></button>\n+            </div>\n+        </div>\n+        <div className='mdc-snackbar mdc-snackbar--align-start'\n+          aria-live='assertive'\n+          aria-atomic='true'\n+          aria-hidden='true'\n+          ref={startAlignedSnackbarEl => this.initSnackbar(startAlignedSnackbarEl, true /* isStartAligned */)}>","path":"src/SnackbarPage.js","position":89,"original_position":89,"commit_id":"cd80cc196f5c056b0bc02c1a82d9ae4c8293f339","original_commit_id":"cd80cc196f5c056b0bc02c1a82d9ae4c8293f339","user":{"login":"patrickrodee","id":5939574,"avatar_url":"https://avatars2.githubusercontent.com/u/5939574?v=4","gravatar_id":"","url":"https://api.github.com/users/patrickrodee","html_url":"https://github.com/patrickrodee","followers_url":"https://api.github.com/users/patrickrodee/followers","following_url":"https://api.github.com/users/patrickrodee/following{/other_user}","gists_url":"https://api.github.com/users/patrickrodee/gists{/gist_id}","starred_url":"https://api.github.com/users/patrickrodee/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/patrickrodee/subscriptions","organizations_url":"https://api.github.com/users/patrickrodee/orgs","repos_url":"https://api.github.com/users/patrickrodee/repos","events_url":"https://api.github.com/users/patrickrodee/events{/privacy}","received_events_url":"https://api.github.com/users/patrickrodee/received_events","type":"User","site_admin":false},"body":"I'd almost be tempted to make a simple `Snackbar` class with props just to improve code reuse and simplify these two examples. I don't think it's necessary but if there's time, it wouldn't hurt.","created_at":"2018-05-03T15:55:17Z","updated_at":"2018-05-03T15:55:29Z","html_url":"https://github.com/material-components/material-components-web-catalog/pull/97#discussion_r185850565","pull_request_url":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls/97","author_association":"CONTRIBUTOR","_links":{"self":{"href":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls/comments/185850565"},"html":{"href":"https://github.com/material-components/material-components-web-catalog/pull/97#discussion_r185850565"},"pull_request":{"href":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls/97"}}},"pull_request":{"url":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls/97","id":185603868,"html_url":"https://github.com/material-components/material-components-web-catalog/pull/97","diff_url":"https://github.com/material-components/material-components-web-catalog/pull/97.diff","patch_url":"https://github.com/material-components/material-components-web-catalog/pull/97.patch","issue_url":"https://api.github.com/repos/material-components/material-components-web-catalog/issues/97","number":97,"state":"open","locked":false,"title":"feat: Add snackbar page","user":{"login":"rlfriedman","id":3444060,"avatar_url":"https://avatars3.githubusercontent.com/u/3444060?v=4","gravatar_id":"","url":"https://api.github.com/users/rlfriedman","html_url":"https://github.com/rlfriedman","followers_url":"https://api.github.com/users/rlfriedman/followers","following_url":"https://api.github.com/users/rlfriedman/following{/other_user}","gists_url":"https://api.github.com/users/rlfriedman/gists{/gist_id}","starred_url":"https://api.github.com/users/rlfriedman/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/rlfriedman/subscriptions","organizations_url":"https://api.github.com/users/rlfriedman/orgs","repos_url":"https://api.github.com/users/rlfriedman/repos","events_url":"https://api.github.com/users/rlfriedman/events{/privacy}","received_events_url":"https://api.github.com/users/rlfriedman/received_events","type":"User","site_admin":false},"body":"Fixes #76","created_at":"2018-05-03T02:17:21Z","updated_at":"2018-05-03T15:55:29Z","closed_at":null,"merged_at":null,"merge_commit_sha":null,"assignee":null,"assignees":[],"requested_reviewers":[],"requested_teams":[],"labels":[],"milestone":null,"commits_url":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls/97/commits","review_comments_url":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls/97/comments","review_comment_url":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls/comments{/number}","comments_url":"https://api.github.com/repos/material-components/material-components-web-catalog/issues/97/comments","statuses_url":"https://api.github.com/repos/material-components/material-components-web-catalog/statuses/cd80cc196f5c056b0bc02c1a82d9ae4c8293f339","head":{"label":"material-components:feat/snackbar","ref":"feat/snackbar","sha":"cd80cc196f5c056b0bc02c1a82d9ae4c8293f339","user":{"login":"material-components","id":19478152,"avatar_url":"https://avatars3.githubusercontent.com/u/19478152?v=4","gravatar_id":"","url":"https://api.github.com/users/material-components","html_url":"https://github.com/material-components","followers_url":"https://api.github.com/users/material-components/followers","following_url":"https://api.github.com/users/material-components/following{/other_user}","gists_url":"https://api.github.com/users/material-components/gists{/gist_id}","starred_url":"https://api.github.com/users/material-components/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/material-components/subscriptions","organizations_url":"https://api.github.com/users/material-components/orgs","repos_url":"https://api.github.com/users/material-components/repos","events_url":"https://api.github.com/users/material-components/events{/privacy}","received_events_url":"https://api.github.com/users/material-components/received_events","type":"Organization","site_admin":false},"repo":{"id":121684159,"name":"material-components-web-catalog","full_name":"material-components/material-components-web-catalog","owner":{"login":"material-components","id":19478152,"avatar_url":"https://avatars3.githubusercontent.com/u/19478152?v=4","gravatar_id":"","url":"https://api.github.com/users/material-components","html_url":"https://github.com/material-components","followers_url":"https://api.github.com/users/material-components/followers","following_url":"https://api.github.com/users/material-components/following{/other_user}","gists_url":"https://api.github.com/users/material-components/gists{/gist_id}","starred_url":"https://api.github.com/users/material-components/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/material-components/subscriptions","organizations_url":"https://api.github.com/users/material-components/orgs","repos_url":"https://api.github.com/users/material-components/repos","events_url":"https://api.github.com/users/material-components/events{/privacy}","received_events_url":"https://api.github.com/users/material-components/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/material-components/material-components-web-catalog","description":"Catalog of Material Components for the web (MDC Web)","fork":false,"url":"https://api.github.com/repos/material-components/material-components-web-catalog","forks_url":"https://api.github.com/repos/material-components/material-components-web-catalog/forks","keys_url":"https://api.github.com/repos/material-components/material-components-web-catalog/keys{/key_id}","collaborators_url":"https://api.github.com/repos/material-components/material-components-web-catalog/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/material-components/material-components-web-catalog/teams","hooks_url":"https://api.github.com/repos/material-components/material-components-web-catalog/hooks","issue_events_url":"https://api.github.com/repos/material-components/material-components-web-catalog/issues/events{/number}","events_url":"https://api.github.com/repos/material-components/material-components-web-catalog/events","assignees_url":"https://api.github.com/repos/material-components/material-components-web-catalog/assignees{/user}","branches_url":"https://api.github.com/repos/material-components/material-components-web-catalog/branches{/branch}","tags_url":"https://api.github.com/repos/material-components/material-components-web-catalog/tags","blobs_url":"https://api.github.com/repos/material-components/material-components-web-catalog/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/material-components/material-components-web-catalog/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/material-components/material-components-web-catalog/git/refs{/sha}","trees_url":"https://api.github.com/repos/material-components/material-components-web-catalog/git/trees{/sha}","statuses_url":"https://api.github.com/repos/material-components/material-components-web-catalog/statuses/{sha}","languages_url":"https://api.github.com/repos/material-components/material-components-web-catalog/languages","stargazers_url":"https://api.github.com/repos/material-components/material-components-web-catalog/stargazers","contributors_url":"https://api.github.com/repos/material-components/material-components-web-catalog/contributors","subscribers_url":"https://api.github.com/repos/material-components/material-components-web-catalog/subscribers","subscription_url":"https://api.github.com/repos/material-components/material-components-web-catalog/subscription","commits_url":"https://api.github.com/repos/material-components/material-components-web-catalog/commits{/sha}","git_commits_url":"https://api.github.com/repos/material-components/material-components-web-catalog/git/commits{/sha}","comments_url":"https://api.github.com/repos/material-components/material-components-web-catalog/comments{/number}","issue_comment_url":"https://api.github.com/repos/material-components/material-components-web-catalog/issues/comments{/number}","contents_url":"https://api.github.com/repos/material-components/material-components-web-catalog/contents/{+path}","compare_url":"https://api.github.com/repos/material-components/material-components-web-catalog/compare/{base}...{head}","merges_url":"https://api.github.com/repos/material-components/material-components-web-catalog/merges","archive_url":"https://api.github.com/repos/material-components/material-components-web-catalog/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/material-components/material-components-web-catalog/downloads","issues_url":"https://api.github.com/repos/material-components/material-components-web-catalog/issues{/number}","pulls_url":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls{/number}","milestones_url":"https://api.github.com/repos/material-components/material-components-web-catalog/milestones{/number}","notifications_url":"https://api.github.com/repos/material-components/material-components-web-catalog/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/material-components/material-components-web-catalog/labels{/name}","releases_url":"https://api.github.com/repos/material-components/material-components-web-catalog/releases{/id}","deployments_url":"https://api.github.com/repos/material-components/material-components-web-catalog/deployments","created_at":"2018-02-15T21:20:24Z","updated_at":"2018-05-03T02:21:24Z","pushed_at":"2018-05-03T15:36:08Z","git_url":"git://github.com/material-components/material-components-web-catalog.git","ssh_url":"git@github.com:material-components/material-components-web-catalog.git","clone_url":"https://github.com/material-components/material-components-web-catalog.git","svn_url":"https://github.com/material-components/material-components-web-catalog","homepage":"","size":2928,"stargazers_count":10,"watchers_count":10,"language":"JavaScript","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":true,"forks_count":1,"mirror_url":null,"archived":false,"open_issues_count":16,"license":{"key":"apache-2.0","name":"Apache License 2.0","spdx_id":"Apache-2.0","url":"https://api.github.com/licenses/apache-2.0"},"forks":1,"open_issues":16,"watchers":10,"default_branch":"master"}},"base":{"label":"material-components:master","ref":"master","sha":"19024da6e54eb0e81779b8dd82da3b5270b2b5ed","user":{"login":"material-components","id":19478152,"avatar_url":"https://avatars3.githubusercontent.com/u/19478152?v=4","gravatar_id":"","url":"https://api.github.com/users/material-components","html_url":"https://github.com/material-components","followers_url":"https://api.github.com/users/material-components/followers","following_url":"https://api.github.com/users/material-components/following{/other_user}","gists_url":"https://api.github.com/users/material-components/gists{/gist_id}","starred_url":"https://api.github.com/users/material-components/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/material-components/subscriptions","organizations_url":"https://api.github.com/users/material-components/orgs","repos_url":"https://api.github.com/users/material-components/repos","events_url":"https://api.github.com/users/material-components/events{/privacy}","received_events_url":"https://api.github.com/users/material-components/received_events","type":"Organization","site_admin":false},"repo":{"id":121684159,"name":"material-components-web-catalog","full_name":"material-components/material-components-web-catalog","owner":{"login":"material-components","id":19478152,"avatar_url":"https://avatars3.githubusercontent.com/u/19478152?v=4","gravatar_id":"","url":"https://api.github.com/users/material-components","html_url":"https://github.com/material-components","followers_url":"https://api.github.com/users/material-components/followers","following_url":"https://api.github.com/users/material-components/following{/other_user}","gists_url":"https://api.github.com/users/material-components/gists{/gist_id}","starred_url":"https://api.github.com/users/material-components/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/material-components/subscriptions","organizations_url":"https://api.github.com/users/material-components/orgs","repos_url":"https://api.github.com/users/material-components/repos","events_url":"https://api.github.com/users/material-components/events{/privacy}","received_events_url":"https://api.github.com/users/material-components/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/material-components/material-components-web-catalog","description":"Catalog of Material Components for the web (MDC Web)","fork":false,"url":"https://api.github.com/repos/material-components/material-components-web-catalog","forks_url":"https://api.github.com/repos/material-components/material-components-web-catalog/forks","keys_url":"https://api.github.com/repos/material-components/material-components-web-catalog/keys{/key_id}","collaborators_url":"https://api.github.com/repos/material-components/material-components-web-catalog/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/material-components/material-components-web-catalog/teams","hooks_url":"https://api.github.com/repos/material-components/material-components-web-catalog/hooks","issue_events_url":"https://api.github.com/repos/material-components/material-components-web-catalog/issues/events{/number}","events_url":"https://api.github.com/repos/material-components/material-components-web-catalog/events","assignees_url":"https://api.github.com/repos/material-components/material-components-web-catalog/assignees{/user}","branches_url":"https://api.github.com/repos/material-components/material-components-web-catalog/branches{/branch}","tags_url":"https://api.github.com/repos/material-components/material-components-web-catalog/tags","blobs_url":"https://api.github.com/repos/material-components/material-components-web-catalog/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/material-components/material-components-web-catalog/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/material-components/material-components-web-catalog/git/refs{/sha}","trees_url":"https://api.github.com/repos/material-components/material-components-web-catalog/git/trees{/sha}","statuses_url":"https://api.github.com/repos/material-components/material-components-web-catalog/statuses/{sha}","languages_url":"https://api.github.com/repos/material-components/material-components-web-catalog/languages","stargazers_url":"https://api.github.com/repos/material-components/material-components-web-catalog/stargazers","contributors_url":"https://api.github.com/repos/material-components/material-components-web-catalog/contributors","subscribers_url":"https://api.github.com/repos/material-components/material-components-web-catalog/subscribers","subscription_url":"https://api.github.com/repos/material-components/material-components-web-catalog/subscription","commits_url":"https://api.github.com/repos/material-components/material-components-web-catalog/commits{/sha}","git_commits_url":"https://api.github.com/repos/material-components/material-components-web-catalog/git/commits{/sha}","comments_url":"https://api.github.com/repos/material-components/material-components-web-catalog/comments{/number}","issue_comment_url":"https://api.github.com/repos/material-components/material-components-web-catalog/issues/comments{/number}","contents_url":"https://api.github.com/repos/material-components/material-components-web-catalog/contents/{+path}","compare_url":"https://api.github.com/repos/material-components/material-components-web-catalog/compare/{base}...{head}","merges_url":"https://api.github.com/repos/material-components/material-components-web-catalog/merges","archive_url":"https://api.github.com/repos/material-components/material-components-web-catalog/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/material-components/material-components-web-catalog/downloads","issues_url":"https://api.github.com/repos/material-components/material-components-web-catalog/issues{/number}","pulls_url":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls{/number}","milestones_url":"https://api.github.com/repos/material-components/material-components-web-catalog/milestones{/number}","notifications_url":"https://api.github.com/repos/material-components/material-components-web-catalog/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/material-components/material-components-web-catalog/labels{/name}","releases_url":"https://api.github.com/repos/material-components/material-components-web-catalog/releases{/id}","deployments_url":"https://api.github.com/repos/material-components/material-components-web-catalog/deployments","created_at":"2018-02-15T21:20:24Z","updated_at":"2018-05-03T02:21:24Z","pushed_at":"2018-05-03T15:36:08Z","git_url":"git://github.com/material-components/material-components-web-catalog.git","ssh_url":"git@github.com:material-components/material-components-web-catalog.git","clone_url":"https://github.com/material-components/material-components-web-catalog.git","svn_url":"https://github.com/material-components/material-components-web-catalog","homepage":"","size":2928,"stargazers_count":10,"watchers_count":10,"language":"JavaScript","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":true,"forks_count":1,"mirror_url":null,"archived":false,"open_issues_count":16,"license":{"key":"apache-2.0","name":"Apache License 2.0","spdx_id":"Apache-2.0","url":"https://api.github.com/licenses/apache-2.0"},"forks":1,"open_issues":16,"watchers":10,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls/97"},"html":{"href":"https://github.com/material-components/material-components-web-catalog/pull/97"},"issue":{"href":"https://api.github.com/repos/material-components/material-components-web-catalog/issues/97"},"comments":{"href":"https://api.github.com/repos/material-components/material-components-web-catalog/issues/97/comments"},"review_comments":{"href":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls/97/comments"},"review_comment":{"href":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/material-components/material-components-web-catalog/pulls/97/commits"},"statuses":{"href":"https://api.github.com/repos/material-components/material-components-web-catalog/statuses/cd80cc196f5c056b0bc02c1a82d9ae4c8293f339"}},"author_association":"CONTRIBUTOR"}}
{"actor":{"display_login":"patrickrodee"}}