Added a few stubs

docs/Introduction.md

@@ -0,0 +1,3 @@
+# Hello!
+
+Whassup?

docs/configuration.md

@@ -0,0 +1,5 @@
+# Configuration
+
+Woo
+
+## Customising the theme

docs/installation.md

@@ -0,0 +1,3 @@
+# Installation
+
+Etc

docs/ui.md

@@ -0,0 +1 @@
+# UI?

src/components/Alert.js

@@ -0,0 +1,10 @@
+import React from "react";
+import PropTypes from "prop-types";
+
+const Alert = (props) => {
+  return <div className="alert">{props.children}</div>;
+};
+
+Alert.propTypes = {};
+
+export default Alert;

src/components/Badge.js

@@ -0,0 +1,10 @@
+import React from "react";
+import PropTypes from "prop-types";
+
+const Badge = (props) => {
+  return <div className="badge">{props.children}</div>;
+};
+
+Badge.propTypes = {};
+
+export default Badge;

src/components/Button.md

@@ -3,5 +3,5 @@ A very simple button
 ```jsx
 import { Button } from "westreact";
 
-<Button text="We Salute You!" />;
+<Button>We Salute You!</Button>;
 ```

src/components/form/NumberInput.js

@@ -0,0 +1,31 @@
+import React from "react";
+import PropTypes from "prop-types";
+
+const NumberInput = ({ value, min, max, step, onChange, placeholder }) => {
+  const handleChange = (e) => {
+    onChange(e.target.value);
+  };
+
+  return (
+    <input
+      type="number"
+      value={value}
+      min={min}
+      max={max}
+      step={step}
+      onChange={handleChange}
+      placeholder={placeholder}
+    />
+  );
+};
+
+NumberInput.propTypes = {
+  value: PropTypes.number.isRequired,
+  min: PropTypes.number,
+  max: PropTypes.number,
+  step: PropTypes.number.isRequired,
+  onChange: PropTypes.func.isRequired,
+  placeholder: PropTypes.string,
+};
+
+export default NumberInput;

src/components/form/NumberInput.md

@@ -0,0 +1,9 @@
+A simple number input
+
+```jsx
+import { useState } from "react";
+import { NumberInput } from "westreact";
+const [x, setX] = useState(0);
+
+<NumberInput value={x} onChange={setX} placeHolder="Set me" />;
+```

src/components/form/TextInput.js

@@ -0,0 +1,25 @@
+import React from "react";
+import PropTypes from "prop-types";
+
+const TextInput = ({ placeholder, onChange, value }) => {
+  const changeHandler = (e) => {
+    onChange(e.target.value);
+  };
+
+  return (
+    <input
+      type="text"
+      value={value}
+      onChange={changeHandler}
+      placeholder={placeholder}
+    />
+  );
+};
+
+TextInput.propTypes = {
+  onChange: PropTypes.func.isRequired,
+  placeholder: PropTypes.string,
+  value: PropTypes.string.isRequired,
+};
+
+export default TextInput;

src/components/form/TextInput.md

@@ -0,0 +1,9 @@
+A simple text input
+
+```jsx
+import { useState } from "react";
+import { TextInput } from "westreact";
+const [x, setX] = useState("");
+
+<TextInput value={x} onChange={setX} placeHolder="Set me" />;
+```

src/index.js

@@ -1 +1,5 @@
 export { default as Button } from "components/Button";
+export { default as Alert } from "components/Alert";
+export { default as Badge } from "components/Badge";
+export { default as TextInput } from "components/form/TextInput";
+export { default as NumberInput } from "components/form/NumberInput";