# cloudscape-file-uploader

> File uploader for Cloudscape

Latest version **1.0.9** (published 2023-04-22) · MIT license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install cloudscape-file-uploader
pnpm add cloudscape-file-uploader
yarn add cloudscape-file-uploader
bun add cloudscape-file-uploader
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 1.0.9 |
| Published | 2023-04-22 |
| First published | 2023-02-16 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 17.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3 |
| Author | jasmaa |
| Maintainers | jasmaa |

## Links

- npm: https://www.npmjs.com/package/cloudscape-file-uploader
- Repository: https://github.com/jasmaa/cloudscape-file-uploader
- npm.io page: https://npm.io/package/cloudscape-file-uploader

## Dependencies (1)

- [styled-components](https://npm.io/package/styled-components.md) ^5.3.6

## Recent versions

- 1.0.9 (latest) — 2023-04-22
- 1.0.8 — 2023-04-16
- 1.0.7 — 2023-03-21
- 1.0.6 — 2023-02-21
- 1.0.5 — 2023-02-18
- 1.0.4 — 2023-02-18
- 1.0.3 — 2023-02-16
- 1.0.2 — 2023-02-16
- 1.0.1 — 2023-02-16
- 1.0.0 — 2023-02-16

## README

# Cloudscape File Uploader

**⚠️ THIS PACKAGE IS DEPRECATED. PLEASE USE THE [OFFICIAL COMPONENT](https://cloudscape.design/components/file-upload/?tabId=playground). ⚠️**

[![NPM version](https://img.shields.io/npm/v/cloudscape-file-uploader)](https://www.npmjs.com/package/cloudscape-file-uploader)
[![Build](https://img.shields.io/github/actions/workflow/status/jasmaa/cloudscape-file-uploader/build.yml)](https://github.com/jasmaa/cloudscape-file-uploader/actions/workflows/build.yml)
[![Codecov](https://img.shields.io/codecov/c/github/jasmaa/cloudscape-file-uploader)](https://app.codecov.io/gh/jasmaa/cloudscape-file-uploader)

A file uploader for Cloudscape following: https://cloudscape.design/components/fileupload/

![Screenshot of multiple file uploader](https://github.com/jasmaa/cloudscape-file-uploader/raw/main/docs/screenshot_01.png)

## Usage

Install the package and Cloudscape peer dependencies with npm:

```
npm install @cloudscape-design/components @cloudscape-design/design-tokens
npm install cloudscape-file-uploader
```

...or with Yarn

```
yarn add @cloudscape-design/components @cloudscape-design/design-tokens
yarn add cloudscape-file-uploader
```

Add `FileUploader` to project:

```jsx
import React, { useState } from "react";
import { FileUploader } from "cloudscape-file-uploader";

function App() {
  const [files, setFiles] = useState([]);
  const [errorText, setErrorText] = useState("");

  return (
    <FileUploader
      fileInputId="singleFileUpload"
      text="Choose a file to upload"
      label="Upload a file"
      errorText={errorText}
      files={files}
      onFilesUploaded={(uploadedFiles) => {
        if (uploadedFiles.length === 1) {
          setFiles1([...uploadedFiles]);
          setErrorText("");
        } else {
          setErrorText("An error occured.");
        }
      }}
    />
  );
}
```

See more [examples](./examples).

## Development

Install packages and build dist:

```
yarn install
yarn build
```

## Testing

Test with:

```
yarn test
```

Fix prettier with:

```
npx prettier --write .
```

Fix eslint with:

```
npx eslint --fix .
```

---
_Source: https://npm.io/package/cloudscape-file-uploader · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
