Add file-upload component

README.md

@@ -285,6 +285,22 @@ All components have to work on the below browsers:
 ----------
 </details>
 
+<details>
+	<summary>@gov.au/file-upload</summary>
+	<br><code>npm install @gov.au/file-upload</code><br>
+	<br>See the <a href="https://auds.service.gov.au/packages/file-upload/tests/site/">visual test file for file-upload</a>
+	<br>See the <a href="https://github.com/govau/design-system-components/blob/master/packages/file-upload/README.md">readme file for file-upload</a><br><br>
+	Dependencies:
+	<br>
+
+```shell
+├─ core
+└─ form
+   └─ core
+```
+----------
+</details>
+
 <details>
 	<summary>@gov.au/footer</summary>
 	<br><code>npm install @gov.au/footer</code><br>

packages/file-upload/CHANGELOG.md

@@ -0,0 +1,34 @@
+@gov.au/file-upload CHANGELOG
+======================
+
+> Part of the [gov.au components](https://github.com/govau/design-system-components/) ecosystem.
+
+
+## Contents
+
+* [Versions](#install)
+* [Release History](#release-history)
+
+
+----------------------------------------------------------------------------------------------------------------------------------------------------------------
+
+
+## Versions
+
+* [v0.1.0 - 💥 Initial version](#v010)
+
+
+----------------------------------------------------------------------------------------------------------------------------------------------------------------
+
+
+## Release History
+
+### v0.1.0
+
+- 💥 Initial version
+
+
+**[⬆ back to top](#contents)**
+
+
+# };

packages/file-upload/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 Commonwealth of Australia
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

packages/file-upload/README.md

@@ -0,0 +1,83 @@
+@gov.au/file-upload
+============
+
+> Select and upload a file
+
+
+## Contents
+
+* [Install](#install)
+* [Dependency graph](#dependency-graph)
+* [Tests](#tests)
+* [Release History](#release-history)
+* [License](#license)
+
+
+----------------------------------------------------------------------------------------------------------------------------------------------------------------
+
+
+## Install
+
+
+```shell
+yarn add @gov.au/file-upload
+```
+
+```shell
+npm install @gov.au/file-upload --save-dev
+```
+
+
+**[⬆ back to top](#contents)**
+
+
+----------------------------------------------------------------------------------------------------------------------------------------------------------------
+
+
+## Dependency graph
+
+```shell
+file-upload
+├─ core
+└─ form
+   └─ core
+```
+
+
+**[⬆ back to top](#contents)**
+
+
+----------------------------------------------------------------------------------------------------------------------------------------------------------------
+
+
+## Tests
+
+The visual test: https://auds.service.gov.au/packages/file-upload/tests/site/
+
+
+**[⬆ back to top](#contents)**
+
+
+----------------------------------------------------------------------------------------------------------------------------------------------------------------
+
+
+## Release History
+
+* v0.1.0 - 💥 Initial version
+
+
+**[⬆ back to top](#contents)**
+
+
+----------------------------------------------------------------------------------------------------------------------------------------------------------------
+
+
+## License
+
+Copyright (c) Commonwealth of Australia.
+Licensed under [MIT](https://raw.githubusercontent.com/govau/design-system-components/packages/core/master/LICENSE).
+
+
+**[⬆ back to top](#contents)**
+
+# };

packages/file-upload/package.json

@@ -0,0 +1,106 @@
+{
+	"name": "@gov.au/file-upload",
+	"version": "0.1.0",
+	"description": "Select and upload a file",
+	"keywords": [
+		"auds",
+		"pancake",
+		"pancake-module",
+		"sass",
+		"scss",
+		"css",
+		"gov.au",
+		"Commonwealth of Australia",
+		"design guide",
+		"design system"
+	],
+	"scripts": {
+		"postinstall": "pancake",
+		"test:a11y": "node ../../scripts/a11y.js",
+		"test:helper": "node ../../scripts/helper.js test",
+		"test": "npm-run-all --parallel test:*",
+		"prepublish": "npm run test:helper && npm run build:pre",
+		"build:pre": "node ../../scripts/helper.js precompile publish",
+		"build:js": "node ../../scripts/helper.js compile",
+		"build:react": "cd tests/react/ && webpack",
+		"build": "npm run build:pre && npm run build:js && npm run build:react",
+		"serve": "browser-sync tests --files \"tests/**/*.html, tests/**/*.css, tests/**/*.js\"",
+		"watch:js": "onchange \"src/js/*.js\" -- npm run build:js",
+		"watch:jsx": "onchange \"src/js/react.js\" \"tests/react/index.js\" -- npm run build",
+		"watch:sass": "onchange \"src/sass/*.scss\" \"tests/site/test.scss\" -- npm run build",
+		"watch": "npm run build && npm-run-all --parallel serve watch:*"
+	},
+	"pancake": {
+		"pancake-module": {
+			"version": "1.0.0",
+			"plugins": [
+				"@gov.au/pancake-sass",
+				"@gov.au/pancake-react",
+				"@gov.au/pancake-json"
+			],
+			"sass": {
+				"path": "lib/sass/_module.scss",
+				"sass-versioning": true
+			},
+			"react": {
+				"path": "lib/js/react.js"
+			}
+		}
+	},
+	"main": "lib/js/react.es5.js",
+	"dependencies": {
+		"@gov.au/pancake": "~1",
+		"@gov.au/pancake-sass": "~2",
+		"@gov.au/pancake-react": "~1",
+		"@gov.au/pancake-json": "~1",
+
+		"@gov.au/core": "^3.0.0",
+		"@gov.au/form": "^0.1.0"
+	},
+	"peerDependencies": {
+		"@gov.au/core": "^3.0.0",
+		"@gov.au/form": "^0.1.0"
+	},
+	"devDependencies": {
+		"@babel/core": "^7.3.4",
+		"babel-loader": "^8.0.5",
+		"@babel/preset-react": "^7.0.0",
+		"@babel/preset-env": "^7.3.4",
+		"browser-sync": "^2.26.3",
+		"npm-run-all": "^4.1.5",
+		"onchange": "^5.2.0",
+		"react": "^16.8.4",
+		"react-dom": "^16.8.4",
+		"webpack": "^4.29.6",
+		"webpack-cli": "^3.2.3"
+	},
+	"files": [
+		"lib/*"
+	],
+	"engines": {
+		"node": ">=0.12.0",
+		"npm": "^3.0.0"
+	},
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/govau/design-system-components.git"
+	},
+	"homepage": "https://designsystem.gov.au/components/file-upload",
+	"bugs": {
+		"url": "https://github.com/govau/design-system-components/issues",
+		"email": "[email protected]"
+	},
+	"author": {
+		"name": "Commonwealth of Australia, DTA",
+		"email": "[email protected]",
+		"url": "https://www.dta.gov.au/"
+	},
+	"contributors": [
+		{
+			"name": "Adam Zerella",
+			"email": "[email protected]",
+			"url": "https://adamzerella.com"
+		}
+	],
+	"license": "MIT"
+}

packages/file-upload/src/js/react.js

@@ -0,0 +1,44 @@
+/*! [replace-name] v[replace-version] */
+/***************************************************************************************************************************************************************
+ *
+ * file-upload function
+ *
+ * Select and upload a file
+ *
+ **************************************************************************************************************************************************************/
+
+import React from 'react';
+import PropTypes from 'prop-types';
+
+
+/**
+ * The file upload component
+ *
+ * @param  {string}  id               - The label ID, required
+ * @param  {string}  text             - Text of the label, required
+ * @param  {object}  attributeOptions - Any other attribute options
+ */
+const AUfileUpload = ( { id, text, ...attributeOptions } ) => (
+	<div className="au-form-group">
+		<label className="au-label" htmlFor={ id } { ...attributeOptions }>{ text }</label>
+		<input className="au-file-input" type="file" id={ id }></input>
+	</div>
+);
+
+
+AUfileUpload.propTypes = {
+	/**
+	 * The file input ID
+	 */
+	id: PropTypes.string.isRequired,
+	/**
+	 * The label text description
+	 */
+	text: PropTypes.string.isRequired,
+};
+
+
+AUfileUpload.defaultProps = {};
+
+
+export default AUfileUpload;

packages/file-upload/src/sass/_dependencies.scss

@@ -0,0 +1,6 @@
+//dependencies
+@import '../../../core/src/sass/_module.scss';
+@import '../../../form/src/sass/_module.scss';
+
+//this module
+@import '_module.scss';

packages/file-upload/src/sass/_globals.scss

@@ -0,0 +1,25 @@
+/*! [replace-name] v[replace-version] */
+
+//--------------------------------------------------------------------------------------------------------------------------------------------------------------
+// file-upload module globals
+// Select and upload a file
+//
+// Content:
+// - Sass versioning
+// - Global variables: none so far
+//--------------------------------------------------------------------------------------------------------------------------------------------------------------
+
+//--------------------------------------------------------------------------------------------------------------------------------------------------------------
+// SASS VERSIONING
+//--------------------------------------------------------------------------------------------------------------------------------------------------------------
+$name: "[replace-name]";
+$version: "[replace-version]";
+$dependencies: (
+	[replace-dependencies]
+);
+
+//--------------------------------------------------------------------------------------------------------------------------------------------------------------
+// GLOBAL VARIABLES
+//--------------------------------------------------------------------------------------------------------------------------------------------------------------
+
+// Boy it sure is quiet here.

packages/file-upload/src/sass/_module.scss

@@ -0,0 +1,16 @@
+//--------------------------------------------------------------------------------------------------------------------------------------------------------------
+// file-upload module
+// Select and upload a file
+//
+// Content:
+// - sass-versioning
+// - globals
+//--------------------------------------------------------------------------------------------------------------------------------------------------------------
+
+
+@import '_globals.scss';
+@import '_print.scss';
+
+.au-file-input {
+	@include AU-fontgrid( sm, 'nospace' );
+}

packages/file-upload/src/sass/_print.scss

@@ -0,0 +1,11 @@
+//--------------------------------------------------------------------------------------------------------------------------------------------------------------
+// file-upload module
+// Select and upload a file
+//
+// Content:
+// - print styles
+//--------------------------------------------------------------------------------------------------------------------------------------------------------------
+
+
+@media print {
+}