anthonycicc/reason-crossword-front
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Rescript 9.0, among other things

Browse source
This commit is contained in:
Anthony Cicchetti 2021-03-01 10:20:29 -05:00
parent 475a751046
commit d376646e5d
31 changed files with 790 additions and 1391 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
.node-version
View file

@ -1 +1 @@
15.5.0 15.9.0

4
bsconfig.json
View file

@ -9,14 +9,14 @@
}, },
"bsc-flags": ["-bs-super-errors", "-bs-no-version-header"], "bsc-flags": ["-bs-super-errors", "-bs-no-version-header"],
"package-specs": [{ "package-specs": [{
"module": "commonjs", "module": "es6-global",
"in-source": true "in-source": true
}], }],
"suffix": ".bs.js", "suffix": ".bs.js",
"namespace": true, "namespace": true,
"ppx-flags": ["decco/ppx"], "ppx-flags": ["decco/ppx"],
"bs-dependencies": [ "bs-dependencies": [
"reason-react", "@rescript/react",
"bs-moment", "bs-moment",
"bs-fetch", "bs-fetch",
"decco", "decco",

24
index.html
View file

@ -1,24 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ReasonReact Examples</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/picnic">
</head>
<body>
<div id="root" />
<script>
// stub a variable ReactJS checks. ReactJS assumes you're using a bundler, NodeJS or similar system that provides it the `process.env.NODE_ENV` variable.
window.process = {
env: {
NODE_ENV: 'development'
}
};
</script>
<!-- This is https://github.com/marijnh/moduleserve, the secret sauce that allows us not need to bundle things during development, and have instantaneous iteration feedback, without any hot-reloading or extra build pipeline needed. -->
<script src="/moduleserve/load.js" data-module="/src/Index.bs.js"></script>
<!-- Our little watcher. Super clean. Check it out! -->
<script src="/watcher.js"></script>
</body>
</html>

12
indexProduction.html
View file

@ -1,12 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ReasonReact Examples</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/picnic">
</head>
<body>
<div id="root" />
<script src="./dist/main.js"></script>
</body>
</html>

29
package.json
View file

@ -5,11 +5,10 @@
"build": "bsb -make-world", "build": "bsb -make-world",
"start": "bsb -make-world -w -ws _ ", "start": "bsb -make-world -w -ws _ ",
"clean": "bsb -clean-world", "clean": "bsb -clean-world",
"server": "moduleserve ./ --port 8000", "serve": "concurrently 'yarn start' 'yarn server' 'yarn webpack'",
"test": "echo \"Error: no test specified\" && exit 1", "server": "webpack serve",
"dev": "concurrently 'yarn start' 'yarn server'", "webpack": "webpack -w",
"build:dev": "webpack --config webpack.development.js", "webpack:production": "NODE_ENV=production webpack"
"build:prod": "webpack --config webpack.production.js"
}, },
"keywords": [ "keywords": [
"BuckleScript", "BuckleScript",
@ -24,22 +23,18 @@
"decco": "^1.3.0", "decco": "^1.3.0",
"moment": "^2.29.1", "moment": "^2.29.1",
"react": "^17.0.1", "react": "^17.0.1",
"react-datepicker": "^3.4.1",
"react-dom": "^17.0.1", "react-dom": "^17.0.1",
"react-datepicker": "^3.6.0",
"reason-promise": "^1.1.2", "reason-promise": "^1.1.2",
"reason-react": "^0.9.1", "@rescript/react": "^0.10.1"
"webpack": "^5.21.1",
"webpack-cli": "^4.5.0"
}, },
"devDependencies": { "devDependencies": {
"@babel/core": "^7.12.13", "bs-platform": "^9.0.1",
"@babel/preset-env": "^7.12.13", "concurrently": "^6.0.0",
"babel-loader": "^8.2.2", "html-webpack-plugin": "^5.2.0",
"bs-platform": "^8.4.2", "webpack": "^5.24.2",
"concurrently": "^5.3.0", "webpack-cli": "^4.5.0",
"moduleserve": "^0.9.1", "webpack-dev-server": "^3.11.2"
"webpack-dev-server": "^3.11.2",
"webpack-merge": "^5.7.3"
}, },
"resolutions": { "resolutions": {
"reason-crossword-front": "portal:/Users/anthonys/reason-crossword-front" "reason-crossword-front": "portal:/Users/anthonys/reason-crossword-front"

1
src/Actions.bs.js Normal file
View file

@ -0,0 +1 @@
/* This output is empty. Its source's type definitions, externals and/or unused code got optimized away. */

11
src/BlinkingGreeting/BlinkingGreeting.bs.js
View file

@ -1,7 +1,7 @@
'use strict';
var Curry = require("bs-platform/lib/js/curry.js");
var React = require("react"); import * as Curry from "../../node_modules/bs-platform/lib/es6/curry.js";
import * as React from "react";
function BlinkingGreeting(Props) { function BlinkingGreeting(Props) {
var children = Props.children; var children = Props.children;
@ -34,5 +34,8 @@ function BlinkingGreeting(Props) {
var make = BlinkingGreeting; var make = BlinkingGreeting;
exports.make = make; export {
make ,
}
/* react Not a pure module */ /* react Not a pure module */

4
src/BlinkingGreeting/BlinkingGreeting.re
View file

@ -16,9 +16,9 @@ let make = (~children) => {
let style = let style =
if (show) { if (show) {
ReactDOMRe.Style.make(~opacity="1", ~transition="opacity 1s", ()); ReactDOM.Style.make(~opacity="1", ~transition="opacity 1s", ());
} else { } else {
ReactDOMRe.Style.make(~opacity="0", ~transition="opacity 1s", ()); ReactDOM.Style.make(~opacity="0", ~transition="opacity 1s", ());
}; };
<div style> children </div>; <div style> children </div>;

15
src/Container/Container.bs.js
View file

@ -1,9 +1,9 @@
'use strict';
var React = require("react");
var Moment = require("moment"); import * as React from "react";
var UserEntry$ReasonReactExamples = require("../UserEntry/UserEntry.bs.js"); import * as Moment from "moment";
var DatePicker$ReasonReactExamples = require("../DatePicker/DatePicker.bs.js"); import * as UserEntry$ReasonReactExamples from "../UserEntry/UserEntry.bs.js";
import * as DatePicker$ReasonReactExamples from "../DatePicker/DatePicker.bs.js";
function Container(Props) { function Container(Props) {
var match = React.useReducer((function (param, action) { var match = React.useReducer((function (param, action) {
@ -30,5 +30,8 @@ function Container(Props) {
var make = Container; var make = Container;
exports.make = make; export {
make ,
}
/* react Not a pure module */ /* react Not a pure module */

13
src/DatePicker/DatePicker.bs.js
View file

@ -1,8 +1,8 @@
'use strict';
var Curry = require("bs-platform/lib/js/curry.js");
var React = require("react"); import * as Curry from "../../node_modules/bs-platform/lib/es6/curry.js";
var Moment = require("moment"); import * as React from "react";
import * as Moment from "moment";
function DatePicker(Props) { function DatePicker(Props) {
var currentDate = Props.currentDate; var currentDate = Props.currentDate;
@ -23,5 +23,8 @@ function DatePicker(Props) {
var make = DatePicker; var make = DatePicker;
exports.make = make; export {
make ,
}
/* react Not a pure module */ /* react Not a pure module */

25
src/Decode/Decode.bs.js Normal file
View file

@ -0,0 +1,25 @@
function mapDecodingError(x) {
if (x.TAG === /* Ok */0) {
return {
TAG: /* Ok */0,
_0: x._0
};
} else {
return {
TAG: /* Error */1,
_0: {
NAME: "DecodeError",
VAL: x._0
}
};
}
}
export {
mapDecodingError ,
}
/* No side effect */

88
src/Entities.bs.js Normal file
View file

@ -0,0 +1,88 @@
import * as Decco from "../node_modules/decco/src/Decco.bs.js";
import * as Js_dict from "../node_modules/bs-platform/lib/es6/js_dict.js";
import * as Js_json from "../node_modules/bs-platform/lib/es6/js_json.js";
import * as Belt_Option from "../node_modules/bs-platform/lib/es6/belt_Option.js";
function score_encode(v) {
return Js_dict.fromArray([
[
"name",
Decco.stringToJson(v.name)
],
[
"time",
Decco.stringToJson(v.time)
]
]);
}
function score_decode(v) {
var dict = Js_json.classify(v);
if (typeof dict === "number") {
return Decco.error(undefined, "Not an object", v);
}
if (dict.TAG !== /* JSONObject */2) {
return Decco.error(undefined, "Not an object", v);
}
var dict$1 = dict._0;
var name = Decco.stringFromJson(Belt_Option.getWithDefault(Js_dict.get(dict$1, "name"), null));
if (name.TAG === /* Ok */0) {
var time = Decco.stringFromJson(Belt_Option.getWithDefault(Js_dict.get(dict$1, "time"), null));
if (time.TAG === /* Ok */0) {
return {
TAG: /* Ok */0,
_0: {
name: name._0,
time: time._0
}
};
}
var e = time._0;
return {
TAG: /* Error */1,
_0: {
path: ".time" + e.path,
message: e.message,
value: e.value
}
};
}
var e$1 = name._0;
return {
TAG: /* Error */1,
_0: {
path: ".name" + e$1.path,
message: e$1.message,
value: e$1.value
}
};
}
function getName(score) {
return score.name;
}
function getTime(score) {
return score.time;
}
function score_api_response_encode(v) {
return Decco.arrayToJson(score_encode, v);
}
function score_api_response_decode(v) {
return Decco.arrayFromJson(score_decode, v);
}
export {
score_encode ,
score_decode ,
getName ,
getTime ,
score_api_response_encode ,
score_api_response_decode ,
}
/* No side effect */

9
src/ExampleStyles.bs.js
View file

@ -1,10 +1,13 @@
'use strict';
var reasonReactBlue = "#48a9dc"; var reasonReactBlue = "#48a9dc";
var style = "\n body {\n background-color: rgb(224, 226, 229);\n display: flex;\n flex-direction: column;\n align-items: center;\n }\n button {\n background-color: white;\n color: " + reasonReactBlue + ";\n box-shadow: 0 0 0 1px " + reasonReactBlue + ";\n border: none;\n padding: 8px;\n font-size: 16px;\n }\n button:active {\n background-color: " + reasonReactBlue + ";\n color: white;\n }\n .container {\n margin: 12px 0px;\n box-shadow: 0px 4px 16px rgb(200, 200, 200);\n width: 720px;\n border-radius: 12px;\n font-family: sans-serif;\n }\n .containerTitle {\n background-color: rgb(242, 243, 245);\n border-radius: 12px 12px 0px 0px;\n padding: 12px;\n font-weight: bold;\n }\n .containerContent {\n background-color: white;\n padding: 16px;\n border-radius: 0px 0px 12px 12px;\n }\n"; var style = "\n body {\n background-color: rgb(224, 226, 229);\n display: flex;\n flex-direction: column;\n align-items: center;\n }\n button {\n background-color: white;\n color: " + reasonReactBlue + ";\n box-shadow: 0 0 0 1px " + reasonReactBlue + ";\n border: none;\n padding: 8px;\n font-size: 16px;\n }\n button:active {\n background-color: " + reasonReactBlue + ";\n color: white;\n }\n .container {\n margin: 12px 0px;\n box-shadow: 0px 4px 16px rgb(200, 200, 200);\n width: 720px;\n border-radius: 12px;\n font-family: sans-serif;\n }\n .containerTitle {\n background-color: rgb(242, 243, 245);\n border-radius: 12px 12px 0px 0px;\n padding: 12px;\n font-weight: bold;\n }\n .containerContent {\n background-color: white;\n padding: 16px;\n border-radius: 0px 0px 12px 12px;\n }\n";
exports.reasonReactBlue = reasonReactBlue; export {
exports.style = style; reasonReactBlue ,
style ,
}
/* No side effect */ /* No side effect */

13
src/FetchedDogPictures/FetchedDogPictures.bs.js
View file

@ -1,8 +1,8 @@
'use strict';
var Curry = require("bs-platform/lib/js/curry.js");
var React = require("react"); import * as Curry from "../../node_modules/bs-platform/lib/es6/curry.js";
var Belt_Array = require("bs-platform/lib/js/belt_Array.js"); import * as React from "react";
import * as Belt_Array from "../../node_modules/bs-platform/lib/es6/belt_Array.js";
function FetchedDogPictures(Props) { function FetchedDogPictures(Props) {
var match = React.useState(function () { var match = React.useState(function () {
@ -62,5 +62,8 @@ function FetchedDogPictures(Props) {
var make = FetchedDogPictures; var make = FetchedDogPictures;
exports.make = make; export {
make ,
}
/* react Not a pure module */ /* react Not a pure module */

4
src/FetchedDogPictures/FetchedDogPictures.re
View file

@ -37,7 +37,7 @@ let make = () => {
}); });
<div <div
style={ReactDOMRe.Style.make( style={ReactDOM.Style.make(
~height="120px", ~height="120px",
~display="flex", ~display="flex",
~alignItems="center", ~alignItems="center",
@ -51,7 +51,7 @@ let make = () => {
dogs dogs
->Belt.Array.mapWithIndex((i, dog) => { ->Belt.Array.mapWithIndex((i, dog) => {
let imageStyle = let imageStyle =
ReactDOMRe.Style.make( ReactDOM.Style.make(
~height="120px", ~height="120px",
~width="100%", ~width="100%",
~marginRight=i === Js.Array.length(dogs) - 1 ? "0px" : "8px", ~marginRight=i === Js.Array.length(dogs) - 1 ? "0px" : "8px",

19
src/Index.bs.js
View file

@ -1,9 +1,16 @@
'use strict';
var React = require("react");
var ReactDOMRe = require("reason-react/src/legacy/ReactDOMRe.bs.js");
var Container$ReasonReactExamples = require("./Container/Container.bs.js");
ReactDOMRe.renderToElementWithId(React.createElement(Container$ReasonReactExamples.make, {}), "root"); import * as React from "react";
import * as ReactDom from "react-dom";
import * as Container$ReasonReactExamples from "./Container/Container.bs.js";
/* Not a pure module */ var root = document.querySelector("#root");
if (!(root == null)) {
ReactDom.render(React.createElement(Container$ReasonReactExamples.make, {}), root);
}
export {
}
/* root Not a pure module */

1
src/Index.re
View file

@ -1 +0,0 @@
ReactDOMRe.renderToElementWithId(<Container />, "root");

5
src/Index.res Normal file
View file

@ -0,0 +1,5 @@
switch ReactDOM.querySelector("#root") {
| Some(root) =>
ReactDOM.render(<Container />, root)
| None => ()
}

2
src/ReasonUsingJSUsingReason/ReactJSCard.js
View file

@ -2,7 +2,7 @@
// - A ReasonReact component, ReasonReactCard.re // - A ReasonReact component, ReasonReactCard.re
// - Used by a ReactJS component, ReactJSCard.js (this file) // - Used by a ReactJS component, ReactJSCard.js (this file)
// - ReactJSCard.js can be used by ReasonReact, through bindings in ReasonUsingJSUsingReason.re // - ReactJSCard.js can be used by ReasonReact, through bindings in ReasonUsingJSUsingReason.re
// - ReasonUsingJSUsingReason.re is used by Index.re // - ReasonUsingJSUsingReason.re is used by Index.res
var ReactDOM = require('react-dom'); var ReactDOM = require('react-dom');
var React = require('react'); var React = require('react');

9
src/ReasonUsingJSUsingReason/ReasonReactCard.bs.js
View file

@ -1,6 +1,6 @@
'use strict';
var React = require("react");
import * as React from "react";
function ReasonReactCard(Props) { function ReasonReactCard(Props) {
var style = Props.style; var style = Props.style;
@ -11,5 +11,8 @@ function ReasonReactCard(Props) {
var make = ReasonReactCard; var make = ReasonReactCard;
exports.make = make; export {
make ,
}
/* react Not a pure module */ /* react Not a pure module */

9
src/ReasonUsingJSUsingReason/ReasonUsingJSUsingReason.bs.js
View file

@ -1,8 +1,11 @@
'use strict';
var ReactJSCard = require("./ReactJSCard");
import * as ReactJSCard from "./ReactJSCard";
var make = ReactJSCard; var make = ReactJSCard;
exports.make = make; export {
make ,
}
/* make Not a pure module */ /* make Not a pure module */

21
src/ReducerFromReactJSDocs/ReducerFromReactJSDocs.bs.js
View file

@ -1,7 +1,7 @@
'use strict';
var Curry = require("bs-platform/lib/js/curry.js");
var React = require("react"); import * as Curry from "../../node_modules/bs-platform/lib/es6/curry.js";
import * as React from "react";
var leftButtonStyle = { var leftButtonStyle = {
width: "48px", width: "48px",
@ -55,10 +55,13 @@ function ReducerFromReactJSDocs(Props) {
var make = ReducerFromReactJSDocs; var make = ReducerFromReactJSDocs;
exports.leftButtonStyle = leftButtonStyle; export {
exports.rightButtonStyle = rightButtonStyle; leftButtonStyle ,
exports.containerStyle = containerStyle; rightButtonStyle ,
exports.initialState = initialState; containerStyle ,
exports.reducer = reducer; initialState ,
exports.make = make; reducer ,
make ,
}
/* react Not a pure module */ /* react Not a pure module */

6
src/ReducerFromReactJSDocs/ReducerFromReactJSDocs.re
View file

@ -2,9 +2,9 @@
// https://reactjs.org/docs/hooks-reference.html#usereducer // https://reactjs.org/docs/hooks-reference.html#usereducer
// A little extra we've put, because the ReactJS example has no styling // A little extra we've put, because the ReactJS example has no styling
let leftButtonStyle = ReactDOMRe.Style.make(~borderRadius="4px 0px 0px 4px", ~width="48px", ()); let leftButtonStyle = ReactDOM.Style.make(~borderRadius="4px 0px 0px 4px", ~width="48px", ());
let rightButtonStyle = ReactDOMRe.Style.make(~borderRadius="0px 4px 4px 0px", ~width="48px", ()); let rightButtonStyle = ReactDOM.Style.make(~borderRadius="0px 4px 4px 0px", ~width="48px", ());
let containerStyle = ReactDOMRe.Style.make(~display="flex", ~alignItems="center", ~justifyContent="space-between", ()); let containerStyle = ReactDOM.Style.make(~display="flex", ~alignItems="center", ~justifyContent="space-between", ());
// Record and variant need explicit declarations. // Record and variant need explicit declarations.
type state = {count: int}; type state = {count: int};

19
src/UserEntry/UserEntry.bs.js
View file

@ -1,11 +1,11 @@
'use strict';
var Curry = require("bs-platform/lib/js/curry.js");
var React = require("react"); import * as Curry from "../../node_modules/bs-platform/lib/es6/curry.js";
var Belt_Array = require("bs-platform/lib/js/belt_Array.js"); import * as React from "react";
var Belt_Option = require("bs-platform/lib/js/belt_Option.js"); import * as Belt_Array from "../../node_modules/bs-platform/lib/es6/belt_Array.js";
var Belt_Result = require("bs-platform/lib/js/belt_Result.js"); import * as Belt_Option from "../../node_modules/bs-platform/lib/es6/belt_Option.js";
var Entities$ReasonReactExamples = require("../Entities.bs.js"); import * as Belt_Result from "../../node_modules/bs-platform/lib/es6/belt_Result.js";
import * as Entities$ReasonReactExamples from "../Entities.bs.js";
function UserEntry(Props) { function UserEntry(Props) {
var name = Props.name; var name = Props.name;
@ -65,5 +65,8 @@ function UserEntry(Props) {
var make = UserEntry; var make = UserEntry;
exports.make = make; export {
make ,
}
/* react Not a pure module */ /* react Not a pure module */

11
src/index.html Normal file
View file

@ -0,0 +1,11 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Reason react starter</title>
</head>
<body>
<div id="root"></div>
<script src="./main.js"></script>
</body>
</html>

39
watcher.js
View file

@ -1,39 +0,0 @@
// This is our simple, robust watcher. It hooks into the BuckleScript build
// system to listen for build events.
// See package.json's `start` script and `./node_modules/.bin/bsb --help`
// Btw, if you change this file and reload the page, your browser cache
// _might_ not pick up the new version. If you're in Chrome, do Force Reload.
var websocketReloader;
var LAST_SUCCESS_BUILD_STAMP = localStorage.getItem('LAST_SUCCESS_BUILD_STAMP') || 0;
// package.json's `start` script's `bsb -ws _` means it'll pipe build events
// through a websocket connection to a default port of 9999. This is
// configurable, e.g. `-ws 5000`
var webSocketPort = 9999;
function setUpWebSocket() {
if (websocketReloader == null || websocketReloader.readyState !== 1) {
try {
websocketReloader = new WebSocket(`ws://${window.location.hostname}:${webSocketPort}`);
websocketReloader.onmessage = (message) => {
var newData = JSON.parse(message.data).LAST_SUCCESS_BUILD_STAMP;
if (newData > LAST_SUCCESS_BUILD_STAMP) {
LAST_SUCCESS_BUILD_STAMP = newData;
localStorage.setItem('LAST_SUCCESS_BUILD_STAMP', LAST_SUCCESS_BUILD_STAMP);
// Refresh the page! This will naturally re-run everything,
// including our moduleserve which will re-resolve all the modules.
// No stable build!
location.reload(true);
}
}
} catch (exn) {
console.error("The watcher tried to connect to web socket, but failed. Here's the message:");
console.error(exn);
}
}
};
setUpWebSocket();
setInterval(setUpWebSocket, 2000);

25
webpack.common.js
View file

@ -1,25 +0,0 @@
const path = require('path');
const DIST_DIR = path.resolve(__dirname, "dist");
const SRC_DIR = path.resolve(__dirname, "src");
module.exports = {
entry: {
main: SRC_DIR + '/Index.bs.js',
},
output: {
path: DIST_DIR,
filename: '[name].js',
publicPath: '/'
},
module: {
rules: [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
}
]
}
};

35
webpack.config.js Normal file
View file

@ -0,0 +1,35 @@
const path = require("path")
const HtmlWebpackPlugin = require("html-webpack-plugin")
const SRC_DIR = path.resolve(__dirname, "src");
const DIST_DIR = path.resolve(__dirname, "dist");
const isProd = process.env.NODE_ENV === "production"
module.exports = {
entry: {
main: SRC_DIR + '/Index.bs.js',
},
mode: isProd ? "production" : "development",
devtool: "source-map",
output: {
path: DIST_DIR,
filename: '[name].js',
publicPath: './',
},
plugins: [
new HtmlWebpackPlugin({
template: "src/index.html",
inject: false,
})
],
devServer: {
compress: true,
contentBase: DIST_DIR,
port: process.env.PORT || 8000,
historyApiFallback: true,
},
module: {
rules: [
]
}
}

13
webpack.development.js
View file

@ -1,13 +0,0 @@
const { merge } = require('webpack-merge');
const common = require('./webpack.common.js');
module.exports = merge(common, {
mode: 'development',
devtool: 'inline-source-map',
devServer: {
host: 'localhost',
port: 7000,
open: true,
},
watch: true
})

7
webpack.production.js
View file

@ -1,7 +0,0 @@
const { merge } = require('webpack-merge');
const common = require('./webpack.common.js');
module.exports = merge(common, {
mode: 'production',
devtool: 'source-map',
})

1706
yarn.lock
View file

File diff suppressed because it is too large Load diff