Skip to content

Commit

Permalink
run yarn format (#106)
Browse files Browse the repository at this point in the history
  • Loading branch information
manuelpuyol committed Feb 16, 2021
1 parent 55c105f commit e2b0859
Show file tree
Hide file tree
Showing 15 changed files with 909 additions and 891 deletions.
288 changes: 144 additions & 144 deletions src/components/Highlight.js
@@ -1,144 +1,144 @@
// @flow

import React, { Component, type Node } from "react";
import normalizeTokens from "../utils/normalizeTokens";
import themeToDict, { type ThemeDict } from "../utils/themeToDict";

import type {
Language,
Token,
LineInputProps,
LineOutputProps,
TokenInputProps,
TokenOutputProps,
RenderProps,
PrismLib,
PrismTheme
} from "../types";

type Props = {
Prism: PrismLib,
theme?: PrismTheme,
language: Language,
code: string,
children: (props: RenderProps) => Node
};

class Highlight extends Component<Props, *> {
prevTheme: PrismTheme | void;
prevLanguage: Language | void;
themeDict: ThemeDict | void;

getThemeDict = (props: Props) => {
if (
this.themeDict !== undefined &&
props.theme === this.prevTheme &&
props.language === this.prevLanguage
) {
return this.themeDict;
}

this.prevTheme = props.theme;
this.prevLanguage = props.language;

const themeDict = props.theme
? themeToDict(props.theme, props.language)
: undefined;
return (this.themeDict = themeDict);
};

getLineProps = ({
key,
className,
style,
line,
...rest
}: LineInputProps): LineOutputProps => {
const output: LineOutputProps = {
...rest,
className: "token-line",
style: undefined,
key: undefined
};

const themeDict = this.getThemeDict(this.props);
if (themeDict !== undefined) {
output.style = themeDict.plain;
}

if (style !== undefined) {
output.style =
output.style !== undefined ? { ...output.style, ...style } : style;
}

if (key !== undefined) output.key = key;
if (className) output.className += ` ${className}`;

return output;
};

getStyleForToken = ({ types, empty }: Token) => {
const typesSize = types.length;
const themeDict = this.getThemeDict(this.props);

if (themeDict === undefined) {
return undefined;
} else if (typesSize === 1 && types[0] === "plain") {
return empty ? { display: "inline-block" } : undefined;
} else if (typesSize === 1 && !empty) {
return themeDict[types[0]];
}

const baseStyle = empty ? { display: "inline-block" } : {};
// $FlowFixMe
const typeStyles = types.map(type => themeDict[type]);
return Object.assign(baseStyle, ...typeStyles);
};

getTokenProps = ({
key,
className,
style,
token,
...rest
}: TokenInputProps): TokenOutputProps => {
const output: TokenOutputProps = {
...rest,
className: `token ${token.types.join(" ")}`,
children: token.content,
style: this.getStyleForToken(token),
key: undefined
};

if (style !== undefined) {
output.style =
output.style !== undefined ? { ...output.style, ...style } : style;
}

if (key !== undefined) output.key = key;
if (className) output.className += ` ${className}`;

return output;
};

render() {
const { Prism, language, code, children } = this.props;

const themeDict = this.getThemeDict(this.props);

const grammar = Prism.languages[language];
const mixedTokens =
grammar !== undefined ? Prism.tokenize(code, grammar, language) : [code];
const tokens = normalizeTokens(mixedTokens);

return children({
tokens,
className: `prism-code language-${language}`,
style: themeDict !== undefined ? themeDict.root : {},
getLineProps: this.getLineProps,
getTokenProps: this.getTokenProps
});
}
}

export default Highlight;
// @flow

import React, { Component, type Node } from "react";
import normalizeTokens from "../utils/normalizeTokens";
import themeToDict, { type ThemeDict } from "../utils/themeToDict";

import type {
Language,
Token,
LineInputProps,
LineOutputProps,
TokenInputProps,
TokenOutputProps,
RenderProps,
PrismLib,
PrismTheme,
} from "../types";

type Props = {
Prism: PrismLib,
theme?: PrismTheme,
language: Language,
code: string,
children: (props: RenderProps) => Node,
};

class Highlight extends Component<Props, *> {
prevTheme: PrismTheme | void;
prevLanguage: Language | void;
themeDict: ThemeDict | void;

getThemeDict = (props: Props) => {
if (
this.themeDict !== undefined &&
props.theme === this.prevTheme &&
props.language === this.prevLanguage
) {
return this.themeDict;
}

this.prevTheme = props.theme;
this.prevLanguage = props.language;

const themeDict = props.theme
? themeToDict(props.theme, props.language)
: undefined;
return (this.themeDict = themeDict);
};

getLineProps = ({
key,
className,
style,
line,
...rest
}: LineInputProps): LineOutputProps => {
const output: LineOutputProps = {
...rest,
className: "token-line",
style: undefined,
key: undefined,
};

const themeDict = this.getThemeDict(this.props);
if (themeDict !== undefined) {
output.style = themeDict.plain;
}

if (style !== undefined) {
output.style =
output.style !== undefined ? { ...output.style, ...style } : style;
}

if (key !== undefined) output.key = key;
if (className) output.className += ` ${className}`;

return output;
};

getStyleForToken = ({ types, empty }: Token) => {
const typesSize = types.length;
const themeDict = this.getThemeDict(this.props);

if (themeDict === undefined) {
return undefined;
} else if (typesSize === 1 && types[0] === "plain") {
return empty ? { display: "inline-block" } : undefined;
} else if (typesSize === 1 && !empty) {
return themeDict[types[0]];
}

const baseStyle = empty ? { display: "inline-block" } : {};
// $FlowFixMe
const typeStyles = types.map((type) => themeDict[type]);
return Object.assign(baseStyle, ...typeStyles);
};

getTokenProps = ({
key,
className,
style,
token,
...rest
}: TokenInputProps): TokenOutputProps => {
const output: TokenOutputProps = {
...rest,
className: `token ${token.types.join(" ")}`,
children: token.content,
style: this.getStyleForToken(token),
key: undefined,
};

if (style !== undefined) {
output.style =
output.style !== undefined ? { ...output.style, ...style } : style;
}

if (key !== undefined) output.key = key;
if (className) output.className += ` ${className}`;

return output;
};

render() {
const { Prism, language, code, children } = this.props;

const themeDict = this.getThemeDict(this.props);

const grammar = Prism.languages[language];
const mixedTokens =
grammar !== undefined ? Prism.tokenize(code, grammar, language) : [code];
const tokens = normalizeTokens(mixedTokens);

return children({
tokens,
className: `prism-code language-${language}`,
style: themeDict !== undefined ? themeDict.root : {},
getLineProps: this.getLineProps,
getTokenProps: this.getTokenProps,
});
}
}

export default Highlight;
42 changes: 21 additions & 21 deletions src/themes/dracula.js
Expand Up @@ -7,65 +7,65 @@ import type { PrismTheme } from "../types";
var theme: PrismTheme = {
plain: {
color: "#F8F8F2",
backgroundColor: "#282A36"
backgroundColor: "#282A36",
},
styles: [
{
types: ["prolog", "constant", "builtin"],
style: {
color: "rgb(189, 147, 249)"
}
color: "rgb(189, 147, 249)",
},
},
{
types: ["inserted", "function"],
style: {
color: "rgb(80, 250, 123)"
}
color: "rgb(80, 250, 123)",
},
},
{
types: ["deleted"],
style: {
color: "rgb(255, 85, 85)"
}
color: "rgb(255, 85, 85)",
},
},
{
types: ["changed"],
style: {
color: "rgb(255, 184, 108)"
}
color: "rgb(255, 184, 108)",
},
},
{
types: ["punctuation", "symbol"],
style: {
color: "rgb(248, 248, 242)"
}
color: "rgb(248, 248, 242)",
},
},
{
types: ["string", "char", "tag", "selector"],
style: {
color: "rgb(255, 121, 198)"
}
color: "rgb(255, 121, 198)",
},
},
{
types: ["keyword", "variable"],
style: {
color: "rgb(189, 147, 249)",
fontStyle: "italic"
}
fontStyle: "italic",
},
},
{
types: ["comment"],
style: {
color: "rgb(98, 114, 164)"
}
color: "rgb(98, 114, 164)",
},
},
{
types: ["attr-name"],
style: {
color: "rgb(241, 250, 140)"
}
}
]
color: "rgb(241, 250, 140)",
},
},
],
};

export default theme;

0 comments on commit e2b0859

Please sign in to comment.