@pagopa/mui-italia
Version:
[Material-UI](https://mui.com/core/) theme inspired by [Bootstrap Italia](https://italia.github.io/bootstrap-italia/).
38 lines (37 loc) • 2.63 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.WithTruncatedFileName = exports.WithFile = exports.Error = exports.Loading = exports.Default = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = tslib_1.__importDefault(require("react"));
const _theme_1 = require("../../theme/index");
const SingleFileInput_1 = require("./SingleFileInput");
const componentMaxWidth = 900;
exports.default = {
title: "Components/SingleFileInput",
component: SingleFileInput_1.SingleFileInput,
parameters: {
chromatic: {
viewports: _theme_1.breakpointsChromaticValues.filter((resolution) => resolution <= componentMaxWidth),
},
},
};
const Default = () => {
const [file, setFile] = react_1.default.useState(null);
const handleSelect = (file) => {
setFile(file);
};
const handleRemove = () => {
setFile(null);
};
return ((0, jsx_runtime_1.jsx)(SingleFileInput_1.SingleFileInput, { label: "Document (required)", value: file, accept: ["image/png"], onFileSelected: handleSelect, onFileRemoved: handleRemove, dropzoneLabel: "Drag and drop your .png image here or", dropzoneButton: "upload a file", rejectedLabel: "File type not supported" }));
};
exports.Default = Default;
const Loading = () => ((0, jsx_runtime_1.jsx)(SingleFileInput_1.SingleFileInput, { label: "Document (required)", value: null, onFileSelected: () => { }, onFileRemoved: () => { }, dropzoneLabel: "", dropzoneButton: "", loading: true }));
exports.Loading = Loading;
const Error = () => ((0, jsx_runtime_1.jsx)(SingleFileInput_1.SingleFileInput, { label: "Document (required)", value: null, error: true, onFileSelected: () => { }, onFileRemoved: () => { }, dropzoneLabel: "Drag and drop your .png image here or", dropzoneButton: "upload a file" }));
exports.Error = Error;
const WithFile = () => ((0, jsx_runtime_1.jsx)(SingleFileInput_1.SingleFileInput, { label: "Document (required)", value: new File([], "test.png"), onFileSelected: () => { }, onFileRemoved: () => { }, dropzoneLabel: "Drag and drop your .png image here or", dropzoneButton: "upload a file" }));
exports.WithFile = WithFile;
const WithTruncatedFileName = () => ((0, jsx_runtime_1.jsx)(SingleFileInput_1.SingleFileInput, { label: "Document (required)", value: new File([], "Lorem ipsum dolor sit amet, consectetur adipiscing elit.docx"), onFileSelected: () => { }, onFileRemoved: () => { }, dropzoneLabel: "Drag and drop your .png image here or", dropzoneButton: "upload a file" }));
exports.WithTruncatedFileName = WithTruncatedFileName;