import { Meta, Story, Canvas, ArgsTable } from '@storybook/addon-docs';
import FileUploaderControlled from '../examples/FileUploaderControlled';

<Meta
  title="Components/File Uploader"
  component={FileUploaderControlled}
  decorators={[(storyFn) => <div className="input-story">{storyFn()}</div>]}
/>

# Input With Icon API

The API documentation of the Input type With Icon React component.
Learn more about the props and the CSS customization points.

## Import

```javascript
import { FileUploader } from '@useblu/ocean-react';
```

## Controlled

<Canvas>
  <Story
    name="controlled"
    parameters={{
      controls: { exclude: /^blocked*/ },
    }}
    args={{
      accept: 'image/*',
      maxFiles: 5,
    }}
    argTypes={{
      label: {
        accept: 'text',
      },
    }}
  >
    {(props) => <FileUploaderControlled id="input-with-icon" {...props} />}
  </Story>
</Canvas>
