diff --git a/src/common-elements/linkify.ts b/src/common-elements/linkify.tsx
similarity index 60%
rename from src/common-elements/linkify.ts
rename to src/common-elements/linkify.tsx
index 4e49900c..24dec735 100644
--- a/src/common-elements/linkify.ts
+++ b/src/common-elements/linkify.tsx
@@ -1,5 +1,10 @@
+import * as React from 'react';
+
+import { StoreConsumer } from '../components/StoreBuilder';
import styled, { css } from '../styled-components';
+import { HistoryService } from '../services';
+
// tslint:disable-next-line
export const linkifyMixin = className => css`
${className} {
@@ -27,6 +32,42 @@ export const linkifyMixin = className => css`
}
`;
-export const ShareLink = styled.a`
+const isModifiedEvent = event =>
+ !!(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey);
+
+export class Link extends React.Component<{ to: string; className?: string; children?: any }> {
+ navigate = (history: HistoryService, event) => {
+ if (
+ !event.defaultPrevented && // onClick prevented default
+ event.button === 0 && // ignore everything but left clicks
+ !isModifiedEvent(event) // ignore clicks with modifier keys
+ ) {
+ event.preventDefault();
+ history.replace(this.props.to);
+ }
+ };
+
+ render() {
+ return (
+
+ {store => (
+
+ {this.props.children}
+
+ )}
+
+ );
+ }
+}
+
+const StyledShareLink = styled(Link)`
${linkifyMixin('&')};
`;
+
+export function ShareLink(props: { to: string }) {
+ return ;
+}
diff --git a/src/components/ContentItems/ContentItems.tsx b/src/components/ContentItems/ContentItems.tsx
index aa8c4376..8bfde5d9 100644
--- a/src/components/ContentItems/ContentItems.tsx
+++ b/src/components/ContentItems/ContentItems.tsx
@@ -72,7 +72,7 @@ export class SectionItem extends React.Component {
diff --git a/src/components/Operation/Operation.tsx b/src/components/Operation/Operation.tsx
index 2fa7f748..19ff6841 100644
--- a/src/components/Operation/Operation.tsx
+++ b/src/components/Operation/Operation.tsx
@@ -45,7 +45,7 @@ export class Operation extends React.Component {
-
+
{summary} {deprecated && Deprecated }
{options.pathInMiddlePanel && }
diff --git a/src/components/SecurityRequirement/SecurityRequirement.tsx b/src/components/SecurityRequirement/SecurityRequirement.tsx
index cba33f36..86ccb6bd 100644
--- a/src/components/SecurityRequirement/SecurityRequirement.tsx
+++ b/src/components/SecurityRequirement/SecurityRequirement.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
import styled from '../../styled-components';
-import { UnderlinedHeader } from '../../common-elements/headers';
+import { Link, UnderlinedHeader } from '../../common-elements/';
import { SecurityRequirementModel } from '../../services/models/SecurityRequirement';
import { linksCss } from '../Markdown/styled.elements';
@@ -70,7 +70,7 @@ export class SecurityRequirement extends React.PureComponent {
return (
- {scheme.id}
+ {scheme.id}
{scheme.scopes.length > 0 && ' ('}
{scheme.scopes.map(scope => {scope})}
{scheme.scopes.length > 0 && ') '}
diff --git a/src/components/SecuritySchemes/SecuritySchemes.tsx b/src/components/SecuritySchemes/SecuritySchemes.tsx
index 6af18621..08ca01fd 100644
--- a/src/components/SecuritySchemes/SecuritySchemes.tsx
+++ b/src/components/SecuritySchemes/SecuritySchemes.tsx
@@ -71,7 +71,7 @@ export class SecurityDefs extends React.PureComponent {
-
+
{scheme.id}