Skip to content

Commit

Permalink
feat: add gist link icons and support github flavored md (#301)
Browse files Browse the repository at this point in the history
  • Loading branch information
@sehilyi
sehilyi authored Mar 2, 2021
1 parent 4906230 commit cd74497
Show file tree
Hide file tree
Showing 5 changed files with 185 additions and 7 deletions.
1 change: 1 addition & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -107,6 +107,7 @@
"react-router-dom": "^5.2.0",
"react-scripts": "3.4.1",
"react-split-pane": "^0.1.91",
"remark-gfm": "^1.0.0",
"strip-json-comments": "^3.1.1",
"style-loader": "^1.2.1",
"ts-jest": "^26.2.0",
Expand Down
5 changes: 5 additions & 0 deletions src/editor/editor.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -354,6 +354,7 @@ td {

.gist-title {
font-weight: normal;
margin-left: 10px;
}

.description {
Expand Down Expand Up @@ -438,6 +439,10 @@ td {
color: black;
}

.description-github-button {
cursor: pointer;
}

.hide-description-button {
font-size: 9px;
color: rgb(89, 89, 89);
Expand Down
26 changes: 22 additions & 4 deletions src/editor/editor.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import * as gosling from '../';
import React, { useRef, useState, useEffect, useCallback } from 'react';
import ReactMarkdown from 'react-markdown';
import gfm from 'remark-gfm';
import PubSub from 'pubsub-js';
import fetchJsonp from 'fetch-jsonp';
import EditorPanel from './editor-panel';
Expand Down Expand Up @@ -359,9 +360,17 @@ function Editor(props: any) {
Gosling.js Editor
{urlSpec && <small> Displaying a custom spec contained in URL</small>}
{gistTitle && !IS_SMALL_SCREEN && (
<span className="gist-title">
: <em>{gistTitle}</em>
</span>
<>
<span className="gist-title">{gistTitle}</span>
<span
title="Open GitHub Gist"
style={{ marginLeft: 10 }}
className="description-github-button"
onClick={() => window.open(`https://gist.github.com/${urlGist}`, '_blank')}
>
{getIconSVG(ICONS.UP_RIGHT, 14, 14)}
</span>
</>
)}
<select
style={{ maxWidth: IS_SMALL_SCREEN ? window.innerWidth - 180 : 'none' }}
Expand Down Expand Up @@ -699,8 +708,17 @@ function Editor(props: any) {
<button className="hide-description-button" onClick={closeDescription}>
Close
</button>
<br />
<br />
<span
title="Open GitHub Gist"
className="description-github-button"
onClick={() => window.open(`https://gist.github.com/${urlGist}`, '_blank')}
>
{getIconSVG(ICONS.UP_RIGHT, 14, 14)} Open GitHub Gist to see raw files.
</span>
</header>
{description && <ReactMarkdown source={description} />}
{description && <ReactMarkdown plugins={[gfm]} source={description} />}
</div>
</div>
</div>
Expand Down
21 changes: 21 additions & 0 deletions src/editor/icon.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,27 @@ export type ICON_INFO = {
};

export const ICONS: { [k: string]: ICON_INFO } = {
UP_RIGHT: {
width: 20,
height: 20,
viewBox: '0 0 16 16',
path: [
'M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z',
'M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'
],
stroke: 'none',
fill: 'currentColor'
},
ARCHIVE: {
width: 20,
height: 20,
viewBox: '0 0 16 16',
path: [
'M0 2a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1v7.5a2.5 2.5 0 0 1-2.5 2.5h-9A2.5 2.5 0 0 1 1 12.5V5a1 1 0 0 1-1-1V2zm2 3v7.5A1.5 1.5 0 0 0 3.5 14h9a1.5 1.5 0 0 0 1.5-1.5V5H2zm13-3H1v2h14V2zM5 7.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z'
],
stroke: 'none',
fill: 'currentColor'
},
INFO_CIRCLE: {
width: 20,
height: 20,
Expand Down
139 changes: 136 additions & 3 deletions yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7793,6 +7793,11 @@ escape-string-regexp@^1.0.2, escape-string-regexp@^1.0.5:
resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
integrity sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=

escape-string-regexp@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz#14ba83a5d373e3d311e5afca29cf5bfad965bf34"
integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==

escodegen@^1.11.0, escodegen@^1.14.1, escodegen@^1.9.1:
version "1.14.3"
resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.14.3.tgz#4e7b81fba61581dc97582ed78cab7f0e8d63f503"
Expand Down Expand Up @@ -12360,7 +12365,7 @@ long@^4.0.0:
resolved "https://registry.yarnpkg.com/long/-/long-4.0.0.tgz#9a7b71cfb7d361a194ea555241c92f7468d5bf28"
integrity sha512-XsP+KhQif4bjX1kbuSiySJFNAehNxgLb6hPRGJ9QsUr8ajHkuXGdrHmFUTUUXhDwVX2R5bY4JNZEwbUiMhV+MA==

longest-streak@^2.0.1:
longest-streak@^2.0.0, longest-streak@^2.0.1:
version "2.0.4"
resolved "https://registry.yarnpkg.com/longest-streak/-/longest-streak-2.0.4.tgz#b8599957da5b5dab64dee3fe316fa774597d90e4"
integrity sha512-vM6rUVCVUJJt33bnmHiZEvr7wPT78ztX7rojL+LW51bHtLh6HTjx84LA5W4+oa6aKEJA7jJu5LR6vQRBpA5DVg==
Expand Down Expand Up @@ -12490,6 +12495,13 @@ markdown-table@^1.1.0:
resolved "https://registry.yarnpkg.com/markdown-table/-/markdown-table-1.1.3.tgz#9fcb69bcfdb8717bfd0398c6ec2d93036ef8de60"
integrity sha512-1RUZVgQlpJSPWYbFSpmudq5nHY1doEIv89gBtF0s4gW1GF2XorxcA/70M5vq7rLv0a6mhOUccRsqkwhwLCIQ2Q==

markdown-table@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/markdown-table/-/markdown-table-2.0.0.tgz#194a90ced26d31fe753d8b9434430214c011865b"
integrity sha512-Ezda85ToJUBhM6WGaG6veasyym+Tbs3cMAw/ZhOPqXiYsr0jgocBV3j3nx+4lk47plLlIqjwuTm/ywVI+zjJ/A==
dependencies:
repeat-string "^1.0.0"

material-colors@^1.2.1:
version "1.2.6"
resolved "https://registry.yarnpkg.com/material-colors/-/material-colors-1.2.6.tgz#6d1958871126992ceecc72f4bcc4d8f010865f46"
Expand Down Expand Up @@ -12530,6 +12542,15 @@ mdast-util-definitions@^1.2.0:
dependencies:
unist-util-visit "^1.0.0"

mdast-util-find-and-replace@^1.1.0:
version "1.1.1"
resolved "https://registry.yarnpkg.com/mdast-util-find-and-replace/-/mdast-util-find-and-replace-1.1.1.tgz#b7db1e873f96f66588c321f1363069abf607d1b5"
integrity sha512-9cKl33Y21lyckGzpSmEQnIDjEfeeWelN5s1kUW1LwdB0Fkuq2u+4GdqcGEygYxJE8GVqCl0741bYXHgamfWAZA==
dependencies:
escape-string-regexp "^4.0.0"
unist-util-is "^4.0.0"
unist-util-visit-parents "^3.0.0"

mdast-util-from-markdown@^0.8.0:
version "0.8.5"
resolved "https://registry.yarnpkg.com/mdast-util-from-markdown/-/mdast-util-from-markdown-0.8.5.tgz#d1ef2ca42bc377ecb0463a987910dae89bd9a28c"
Expand All @@ -12541,6 +12562,48 @@ mdast-util-from-markdown@^0.8.0:
parse-entities "^2.0.0"
unist-util-stringify-position "^2.0.0"

mdast-util-gfm-autolink-literal@^0.1.0:
version "0.1.3"
resolved "https://registry.yarnpkg.com/mdast-util-gfm-autolink-literal/-/mdast-util-gfm-autolink-literal-0.1.3.tgz#9c4ff399c5ddd2ece40bd3b13e5447d84e385fb7"
integrity sha512-GjmLjWrXg1wqMIO9+ZsRik/s7PLwTaeCHVB7vRxUwLntZc8mzmTsLVr6HW1yLokcnhfURsn5zmSVdi3/xWWu1A==
dependencies:
ccount "^1.0.0"
mdast-util-find-and-replace "^1.1.0"
micromark "^2.11.3"

mdast-util-gfm-strikethrough@^0.2.0:
version "0.2.3"
resolved "https://registry.yarnpkg.com/mdast-util-gfm-strikethrough/-/mdast-util-gfm-strikethrough-0.2.3.tgz#45eea337b7fff0755a291844fbea79996c322890"
integrity sha512-5OQLXpt6qdbttcDG/UxYY7Yjj3e8P7X16LzvpX8pIQPYJ/C2Z1qFGMmcw+1PZMUM3Z8wt8NRfYTvCni93mgsgA==
dependencies:
mdast-util-to-markdown "^0.6.0"

mdast-util-gfm-table@^0.1.0:
version "0.1.6"
resolved "https://registry.yarnpkg.com/mdast-util-gfm-table/-/mdast-util-gfm-table-0.1.6.tgz#af05aeadc8e5ee004eeddfb324b2ad8c029b6ecf"
integrity sha512-j4yDxQ66AJSBwGkbpFEp9uG/LS1tZV3P33fN1gkyRB2LoRL+RR3f76m0HPHaby6F4Z5xr9Fv1URmATlRRUIpRQ==
dependencies:
markdown-table "^2.0.0"
mdast-util-to-markdown "~0.6.0"

mdast-util-gfm-task-list-item@^0.1.0:
version "0.1.6"
resolved "https://registry.yarnpkg.com/mdast-util-gfm-task-list-item/-/mdast-util-gfm-task-list-item-0.1.6.tgz#70c885e6b9f543ddd7e6b41f9703ee55b084af10"
integrity sha512-/d51FFIfPsSmCIRNp7E6pozM9z1GYPIkSy1urQ8s/o4TC22BZ7DqfHFWiqBD23bc7J3vV1Fc9O4QIHBlfuit8A==
dependencies:
mdast-util-to-markdown "~0.6.0"

mdast-util-gfm@^0.1.0:
version "0.1.2"
resolved "https://registry.yarnpkg.com/mdast-util-gfm/-/mdast-util-gfm-0.1.2.tgz#8ecddafe57d266540f6881f5c57ff19725bd351c"
integrity sha512-NNkhDx/qYcuOWB7xHUGWZYVXvjPFFd6afg6/e2g+SV4r9q5XUcCbV4Wfa3DLYIiD+xAEZc6K4MGaE/m0KDcPwQ==
dependencies:
mdast-util-gfm-autolink-literal "^0.1.0"
mdast-util-gfm-strikethrough "^0.2.0"
mdast-util-gfm-table "^0.1.0"
mdast-util-gfm-task-list-item "^0.1.0"
mdast-util-to-markdown "^0.6.1"

mdast-util-inject@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/mdast-util-inject/-/mdast-util-inject-1.1.0.tgz#db06b8b585be959a2dcd2f87f472ba9b756f3675"
Expand All @@ -12565,6 +12628,18 @@ mdast-util-to-hast@^3.0.0:
unist-util-visit "^1.1.0"
xtend "^4.0.1"

mdast-util-to-markdown@^0.6.0, mdast-util-to-markdown@^0.6.1, mdast-util-to-markdown@~0.6.0:
version "0.6.5"
resolved "https://registry.yarnpkg.com/mdast-util-to-markdown/-/mdast-util-to-markdown-0.6.5.tgz#b33f67ca820d69e6cc527a93d4039249b504bebe"
integrity sha512-XeV9sDE7ZlOQvs45C9UKMtfTcctcaj/pGwH8YLbMHoMOXNNCn2LsqVQOqrF1+/NU8lKDAqozme9SCXWyo9oAcQ==
dependencies:
"@types/unist" "^2.0.0"
longest-streak "^2.0.0"
mdast-util-to-string "^2.0.0"
parse-entities "^2.0.0"
repeat-string "^1.0.0"
zwitch "^1.0.0"

mdast-util-to-string@^1.0.0, mdast-util-to-string@^1.0.5:
version "1.1.0"
resolved "https://registry.yarnpkg.com/mdast-util-to-string/-/mdast-util-to-string-1.1.0.tgz#27055500103f51637bd07d01da01eb1967a43527"
Expand Down Expand Up @@ -12712,7 +12787,52 @@ microevent.ts@~0.1.1:
resolved "https://registry.yarnpkg.com/microevent.ts/-/microevent.ts-0.1.1.tgz#70b09b83f43df5172d0205a63025bce0f7357fa0"
integrity sha512-jo1OfR4TaEwd5HOrt5+tAZ9mqT4jmpNAusXtyfNzqVm9uiSYFZlKM1wYL4oU7azZW/PxQW53wM0S6OR1JHNa2g==

micromark@~2.11.0:
micromark-extension-gfm-autolink-literal@~0.5.0:
version "0.5.6"
resolved "https://registry.yarnpkg.com/micromark-extension-gfm-autolink-literal/-/micromark-extension-gfm-autolink-literal-0.5.6.tgz#406a58914d7a9cc6fb4cfafccc61a8ca36d7a12a"
integrity sha512-nHbR1NUOVhmlZNsnhE5B7WJzL7Xd8lc888z4AF27IpHMtO3NstclZmbrMI+AcdTPpO1wuGVwlK1Cnq+n8Sxlrw==
dependencies:
micromark "~2.11.3"

micromark-extension-gfm-strikethrough@~0.6.0:
version "0.6.3"
resolved "https://registry.yarnpkg.com/micromark-extension-gfm-strikethrough/-/micromark-extension-gfm-strikethrough-0.6.3.tgz#b46cc7ee6c21940dd35e46aa49a11a24f92aedd5"
integrity sha512-MKMoP9x2dsr1aeX46ibBwVf4Q6nJsi5aaUFTOMOID5VOLSxwl4CrqUV4OGFQd6AqhtzBJAxaV+N2trlTBtZDNQ==
dependencies:
micromark "~2.11.0"

micromark-extension-gfm-table@~0.4.0:
version "0.4.2"
resolved "https://registry.yarnpkg.com/micromark-extension-gfm-table/-/micromark-extension-gfm-table-0.4.2.tgz#24384ee9f9af1575295a0adf106d2e93f967a71f"
integrity sha512-AAzmj85XO1ydHYX0Lz52HGhcH2sZLm2AVvkwzELXWgZF6vGdq5yZ3CTByFRsqNUPyQBSIYFKLDAtc6KlnO42aw==
dependencies:
micromark "~2.11.0"

micromark-extension-gfm-tagfilter@~0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/micromark-extension-gfm-tagfilter/-/micromark-extension-gfm-tagfilter-0.3.0.tgz#d9f26a65adee984c9ccdd7e182220493562841ad"
integrity sha512-9GU0xBatryXifL//FJH+tAZ6i240xQuFrSL7mYi8f4oZSbc+NvXjkrHemeYP0+L4ZUT+Ptz3b95zhUZnMtoi/Q==

micromark-extension-gfm-task-list-item@~0.3.0:
version "0.3.3"
resolved "https://registry.yarnpkg.com/micromark-extension-gfm-task-list-item/-/micromark-extension-gfm-task-list-item-0.3.3.tgz#d90c755f2533ed55a718129cee11257f136283b8"
integrity sha512-0zvM5iSLKrc/NQl84pZSjGo66aTGd57C1idmlWmE87lkMcXrTxg1uXa/nXomxJytoje9trP0NDLvw4bZ/Z/XCQ==
dependencies:
micromark "~2.11.0"

micromark-extension-gfm@^0.3.0:
version "0.3.2"
resolved "https://registry.yarnpkg.com/micromark-extension-gfm/-/micromark-extension-gfm-0.3.2.tgz#def1fa3b743baee88a140a6821e12b09ed832563"
integrity sha512-ToQEpLkRgg7Tp8D3GM/SjZFPV0cCwWNxZmoEVIOQivOswRtPg7gg2WlCrtHhUWFNX+DgDjbq0iLOPGp4Y15oug==
dependencies:
micromark "~2.11.0"
micromark-extension-gfm-autolink-literal "~0.5.0"
micromark-extension-gfm-strikethrough "~0.6.0"
micromark-extension-gfm-table "~0.4.0"
micromark-extension-gfm-tagfilter "~0.3.0"
micromark-extension-gfm-task-list-item "~0.3.0"

micromark@^2.11.3, micromark@~2.11.0, micromark@~2.11.3:
version "2.11.4"
resolved "https://registry.yarnpkg.com/micromark/-/micromark-2.11.4.tgz#d13436138eea826383e822449c9a5c50ee44665a"
integrity sha512-+WoovN/ppKolQOFIAajxi7Lu9kInbPxFuTBVEavFcL8eAfVstoc5MocPmqBeAdBOJV00uaVjegzH4+MA0DN/uA==
Expand Down Expand Up @@ -16120,6 +16240,14 @@ relateurl@^0.2.7:
resolved "https://registry.yarnpkg.com/relateurl/-/relateurl-0.2.7.tgz#54dbf377e51440aca90a4cd274600d3ff2d888a9"
integrity sha1-VNvzd+UUQKypCkzSdGANP/LYiKk=

remark-gfm@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/remark-gfm/-/remark-gfm-1.0.0.tgz#9213643001be3f277da6256464d56fd28c3b3c0d"
integrity sha512-KfexHJCiqvrdBZVbQ6RopMZGwaXz6wFJEfByIuEwGf0arvITHjiKKZ1dpXujjH9KZdm1//XJQwgfnJ3lmXaDPA==
dependencies:
mdast-util-gfm "^0.1.0"
micromark-extension-gfm "^0.3.0"

remark-html@^8.0.0:
version "8.0.0"
resolved "https://registry.yarnpkg.com/remark-html/-/remark-html-8.0.0.tgz#9fcb859a6f3cb40f3ef15402950f1a62ec301b3a"
Expand Down Expand Up @@ -16249,7 +16377,7 @@ repeat-element@^1.1.2:
resolved "https://registry.yarnpkg.com/repeat-element/-/repeat-element-1.1.3.tgz#782e0d825c0c5a3bb39731f84efee6b742e6b1ce"
integrity sha512-ahGq0ZnV5m5XtZLMb+vP76kcAM5nkLqk0lpqAuojSKGgQtn4eRi4ZZGm2olo2zKFH+sMsWaqOCW1dqAnOru72g==

repeat-string@^1.5.0, repeat-string@^1.5.2, repeat-string@^1.5.4, repeat-string@^1.6.1:
repeat-string@^1.0.0, repeat-string@^1.5.0, repeat-string@^1.5.2, repeat-string@^1.5.4, repeat-string@^1.6.1:
version "1.6.1"
resolved "https://registry.yarnpkg.com/repeat-string/-/repeat-string-1.6.1.tgz#8dcae470e1c88abc2d600fff4a776286da75e637"
integrity sha1-jcrkcOHIirwtYA//Sndihtp15jc=
Expand Down Expand Up @@ -19855,3 +19983,8 @@ yocto-queue@^0.1.0:
version "0.1.0"
resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b"
integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==

zwitch@^1.0.0:
version "1.0.5"
resolved "https://registry.yarnpkg.com/zwitch/-/zwitch-1.0.5.tgz#d11d7381ffed16b742f6af7b3f223d5cd9fe9920"
integrity sha512-V50KMwwzqJV0NpZIZFwfOD5/lyny3WlSzRiXgA0G7VUnRlqttta1L6UQIHzd6EuBY/cHGfwTIck7w1yH6Q5zUw==

0 comments on commit cd74497

Please sign in to comment.