diff --git a/components/CodeExample.bs.js b/components/CodeExample.bs.js
index 687e410b..97f7369a 100644
--- a/components/CodeExample.bs.js
+++ b/components/CodeExample.bs.js
@@ -2,18 +2,25 @@
import * as Util from "../common/Util.bs.js";
import * as React from "react";
+import * as ReactDOMRe from "reason-react/src/ReactDOMRe.js";
+import * as Highlight from "highlight.js/lib/highlight";
function CodeExample(Props) {
- var children = Props.children;
- var match = Props.lang;
- var lang = match !== undefined ? match : /* Reason */825328612;
- var langStr = lang >= 825328612 ? "RE" : "ML";
+ var code = Props.code;
+ var lang = Props.lang;
+ var highlighted = Highlight.highlight(lang, code).value;
+ var children = ReactDOMRe.createElementVariadic("code", {
+ className: "hljs lang-" + lang,
+ dangerouslySetInnerHTML: {
+ __html: highlighted
+ }
+ }, /* array */[]);
return React.createElement("div", {
- className: "flex flex-col rounded-lg bg-main-black py-3 px-3 mt-10 overflow-x-auto"
+ className: "flex flex-col rounded-lg bg-main-black py-3 px-3 mt-10 overflow-x-auto text-lighter-grey"
}, React.createElement("div", {
className: "font-montserrat text-sm mb-3 font-bold text-primary-dark-10"
- }, Util.ReactStuff.s(langStr)), React.createElement("div", {
- className: "pl-3 text-base pb-4"
+ }, Util.ReactStuff.s(lang.toUpperCase())), React.createElement("div", {
+ className: "pl-5 text-base pb-4"
}, children));
}
diff --git a/components/CodeExample.re b/components/CodeExample.re
index b987ccc5..09fcc4f3 100644
--- a/components/CodeExample.re
+++ b/components/CodeExample.re
@@ -1,21 +1,28 @@
open Util.ReactStuff;
-type lang = [ | `Reason | `OCaml];
-
[@react.component]
-let make = (~children, ~lang=`Reason) => {
- let langStr =
- switch (lang) {
- | `Reason => "RE"
- | `OCaml => "ML"
- };
-
+let make = (~code: string, ~lang) => {
+ let highlighted = HighlightJs.(highlight(~lang, ~value=code)->valueGet);
+
+ let children =
+ ReactDOMRe.createElementVariadic(
+ "code",
+ ~props=
+ ReactDOMRe.objToDOMProps({
+ "className": "hljs lang-" ++ lang,
+ "dangerouslySetInnerHTML": {
+ "__html": highlighted,
+ },
+ }),
+ [||],
+ );
+
+
- langStr->s
-
-
- children
+ {Js.String2.toUpperCase(lang)->s}
+
children
;
};
diff --git a/components/CodeSignature.bs.js b/components/CodeSignature.bs.js
index 315e88f8..48e878a7 100644
--- a/components/CodeSignature.bs.js
+++ b/components/CodeSignature.bs.js
@@ -1,13 +1,18 @@
-import * as Util from "../common/Util.bs.js";
-import * as React from "react";
+import * as ReactDOMRe from "reason-react/src/ReactDOMRe.js";
+import * as Highlight from "highlight.js/lib/highlight";
function CodeSignature(Props) {
- var children = Props.children;
- return React.createElement("div", {
- className: "font-bold"
- }, Util.ReactStuff.s(children));
+ var code = Props.code;
+ var lang = Props.lang;
+ var highlighted = Highlight.highlight(lang, code).value;
+ return ReactDOMRe.createElementVariadic("code", {
+ className: "font-bold hljs lang-" + lang,
+ dangerouslySetInnerHTML: {
+ __html: highlighted
+ }
+ }, /* array */[]);
}
var make = CodeSignature;
@@ -16,4 +21,4 @@ export {
make ,
}
-/* Util Not a pure module */
+/* ReactDOMRe Not a pure module */
diff --git a/components/CodeSignature.re b/components/CodeSignature.re
index 7d715ad0..95a0a59a 100644
--- a/components/CodeSignature.re
+++ b/components/CodeSignature.re
@@ -1,6 +1,18 @@
open Util.ReactStuff;
[@react.component]
-let make = (~children) => {
-
children->s
;
+let make = (~code, ~lang) => {
+ let highlighted = HighlightJs.(highlight(~lang, ~value=code)->valueGet);
+
+ ReactDOMRe.createElementVariadic(
+ "code",
+ ~props=
+ ReactDOMRe.objToDOMProps({
+ "className": "font-bold hljs lang-" ++ lang,
+ "dangerouslySetInnerHTML": {
+ "__html": highlighted,
+ },
+ }),
+ [||],
+ );
};
diff --git a/components/Text.bs.js b/components/Text.bs.js
index e58caef5..135ae1f9 100644
--- a/components/Text.bs.js
+++ b/components/Text.bs.js
@@ -4,12 +4,9 @@ import * as Util from "../common/Util.bs.js";
import * as React from "react";
import * as Caml_obj from "bs-platform/lib/es6/caml_obj.js";
import * as Belt_List from "bs-platform/lib/es6/belt_List.js";
-import * as ReactDOMRe from "reason-react/src/ReactDOMRe.js";
-import * as Caml_option from "bs-platform/lib/es6/caml_option.js";
import * as CodeExample from "./CodeExample.bs.js";
import * as ReasonReact from "reason-react/src/ReasonReact.js";
import * as CodeSignature from "./CodeSignature.bs.js";
-import * as Highlight from "highlight.js/lib/highlight";
var inline = "no-underline border-b border-main-black hover:border-bs-purple text-inherit";
@@ -167,55 +164,27 @@ function Text$Md$Code(Props) {
} else {
lang = "re";
}
- var langClass = "lang-" + lang;
- var baseClass = langClass + " font-mono block leading-tight";
+ var baseClass = "font-mono block leading-tight";
var codeElement;
- var exit = 0;
- var exit$1 = 0;
- switch (lang) {
- case "re" :
- case "reason" :
- exit$1 = 2;
- break;
- default:
- exit = 1;
- }
- if (exit$1 === 2) {
- if (metastring !== undefined && metastring === "example") {
- var highlighted = Highlight.highlight(lang, children).value;
- var finalProps = Object.assign({
- className: baseClass + " hljs"
- }, {
- dangerouslySetInnerHTML: {
- __html: highlighted
- }
- });
- codeElement = ReactDOMRe.createElementVariadic("code", Caml_option.some(finalProps), /* array */[]);
- } else {
- exit = 1;
- }
- }
- if (exit === 1) {
- codeElement = ReactDOMRe.createElementVariadic("code", {
- className: baseClass
- }, children);
- }
if (metastring !== undefined) {
var metaSplits = Belt_List.fromArray(metastring.split(" "));
- if (Belt_List.has(metaSplits, "example", Caml_obj.caml_equal)) {
- return React.createElement(CodeExample.make, {
- children: codeElement
- });
- } else if (Belt_List.has(metaSplits, "sig", Caml_obj.caml_equal)) {
- return React.createElement(CodeSignature.make, {
- children: children
- });
- } else {
- return codeElement;
- }
+ codeElement = Belt_List.has(metaSplits, "example", Caml_obj.caml_equal) ? React.createElement(CodeExample.make, {
+ code: children,
+ lang: lang
+ }) : (
+ Belt_List.has(metaSplits, "sig", Caml_obj.caml_equal) ? React.createElement(CodeSignature.make, {
+ code: children,
+ lang: lang
+ }) : React.createElement("code", undefined, Util.ReactStuff.ate(children))
+ );
} else {
- return codeElement;
+ codeElement = React.createElement("code", {
+ className: baseClass
+ }, Util.ReactStuff.ate(children));
}
+ return React.createElement("div", {
+ className: baseClass
+ }, codeElement);
}
var Code = {
diff --git a/components/Text.re b/components/Text.re
index aec20cc9..40f9cd6a 100644
--- a/components/Text.re
+++ b/components/Text.re
@@ -140,59 +140,25 @@ module Md = {
| _ => "none"
}
};
- let langClass = "lang-" ++ lang;
- let baseClass = langClass ++ " font-mono block leading-tight";
-
- /* If there is a configured language for HLJS,
- we use the highlight function to highlight the code,
- which in this context is always a string parsed from
- the markdown, otherwise we will just pass children down
- without any modification */
+ let baseClass = "font-mono block leading-tight";
let codeElement =
- switch (lang, metastring) {
- | ("re", Some("example"))
- | ("reason", Some("example")) =>
- let highlighted =
- HighlightJs.(
- highlight(~lang, ~value=children->Obj.magic)->valueGet
- );
- let finalProps =
- Js.Obj.assign(
- {"className": baseClass ++ " hljs"},
- {
- "dangerouslySetInnerHTML": {
- "__html": highlighted,
- },
- },
- );
- ReactDOMRe.createElementVariadic(
- "code",
- ~props=ReactDOMRe.objToDOMProps(finalProps),
- [||],
- );
- | _ =>
- ReactDOMRe.createElementVariadic(
- "code",
- ~props=ReactDOMRe.objToDOMProps({"className": baseClass}),
- children,
- )
+ switch (metastring) {
+ | None =>
children->ate
+ | Some(metastring) =>
+ let metaSplits =
+ Js.String.split(" ", metastring)->Belt.List.fromArray;
+
+ if (Belt.List.has(metaSplits, "example", (==))) {
+
Obj.magic} lang />;
+ } else if (Belt.List.has(metaSplits, "sig", (==))) {
+ Obj.magic} lang />;
+ } else {
+ children->ate
;
+ };
};
- switch (metastring) {
- | None => codeElement
- | Some(metastring) =>
- let metaSplits =
- Js.String.split(" ", metastring)->Belt.List.fromArray;
-
- if (Belt.List.has(metaSplits, "example", (==))) {
- codeElement ;
- } else if (Belt.List.has(metaSplits, "sig", (==))) {
- children->Obj.magic ;
- } else {
- codeElement;
- };
- };
+ codeElement
;
};
};
diff --git a/pages/belt_docs/list.mdx b/pages/belt_docs/list.mdx
index 3542fcf4..58f131a7 100755
--- a/pages/belt_docs/list.mdx
+++ b/pages/belt_docs/list.mdx
@@ -534,6 +534,8 @@ let mapReverse2: (t('a), t('b), ('a, 'b) => 'c) => t('c);
Equivalent to: `zipBy(xs, ys, f)->reverse`
```re example
+
+mapReverse2([1,3,4]);
Belt.List.mapReverse2([1, 2, 3], [1, 2], (+)); /* [4, 2] */
````
diff --git a/styles/_hljs.css b/styles/_hljs.css
index 183740cb..f331c276 100644
--- a/styles/_hljs.css
+++ b/styles/_hljs.css
@@ -6,8 +6,6 @@ Docco style used in http://jashkenas.github.com/docco/ converted by Simon Madine
.hljs {
display: block;
overflow-x: auto;
- padding: 0.5em;
- @apply text-lighter-grey;
/*background: #f8f8ff;*/
}