Alexey Safronov
f3afd79a3f
# Conflicts: # packages/asc-web-common/components/AdvancedSelector/AdvancedSelector.js # packages/asc-web-common/components/AdvancedSelector/sub-components/Selector.js # packages/asc-web-common/components/FilterInput/sub-components/SortComboBox.js # packages/asc-web-common/components/PageLayout/index.js # packages/asc-web-common/store/SettingsStore.js # packages/asc-web-components/avatar-editor/sub-components/avatar-editor-body.js # packages/asc-web-components/combobox/index.js # packages/asc-web-components/context-menu/styled-context-menu.js # packages/asc-web-components/drop-down/index.js # packages/asc-web-components/link-with-dropdown/index.js # packages/asc-web-components/row/index.js # packages/asc-web-components/table-container/StyledTableContainer.js # packages/asc-web-components/table-container/TableHeaderCell.js # packages/asc-web-components/themes/dark.js # products/ASC.Files/Client/public/images/files.menu.svg # products/ASC.Files/Client/src/components/Article/Body/TreeFolders.js # products/ASC.Files/Client/src/components/Badges.js # products/ASC.Files/Client/src/components/QuickButtons.js # products/ASC.Files/Client/src/components/panels/NewFilesPanel/index.js # products/ASC.Files/Client/src/components/panels/OperationsPanel/index.js # products/ASC.Files/Client/src/components/panels/SelectFileDialog/AsideView.js # products/ASC.Files/Client/src/components/panels/SelectFileDialog/ModalView.js # products/ASC.Files/Client/src/components/panels/SharingPanel/index.js # products/ASC.Files/Client/src/components/panels/StyledPanels.js # products/ASC.Files/Client/src/components/panels/UploadPanel/FileRow.js # products/ASC.Files/Client/src/components/panels/UploadPanel/index.js # products/ASC.Files/Client/src/pages/Home/Section/Body/RowsView/FilesRowContent.js # products/ASC.Files/Client/src/pages/Home/Section/Body/RowsView/SimpleFilesRow.js # products/ASC.Files/Client/src/pages/Home/Section/Body/TableView/TableContainer.js # products/ASC.Files/Client/src/pages/Home/Section/Body/TableView/TableRow.js # products/ASC.Files/Client/src/pages/Home/Section/Body/TableView/sub-components/FileNameCell.js # products/ASC.Files/Client/src/pages/Home/Section/Filter/index.js # products/ASC.Files/Client/src/pages/Home/Section/Header/index.js # products/ASC.Files/Client/src/pages/Home/index.js # products/ASC.Files/Client/src/pages/VersionHistory/Section/Body/VersionRow.js # products/ASC.Files/Client/src/store/UploadDataStore.js # products/ASC.People/Client/public/images/people.menu.svg # products/ASC.People/Client/src/components/GroupSelector/index.js # products/ASC.People/Client/src/components/PeopleSelector/index.js # products/ASC.People/Client/src/pages/Home/Section/Body/RowView/userContent.js # products/ASC.People/Client/src/pages/Home/index.js # products/ASC.People/Client/src/pages/Profile/Section/Body/index.js # web/ASC.Web.Client/src/components/NavMenu/sub-components/header-nav.js # web/ASC.Web.Client/src/components/NavMenu/sub-components/header.js # web/ASC.Web.Client/src/components/NavMenu/sub-components/nav-item.js # web/ASC.Web.Client/src/components/NavMenu/sub-components/profile-menu.js # web/ASC.Web.Client/src/components/pages/Home/index.js |
||
---|---|---|
.. | ||
index.js | ||
main-button-mobile.stories.js | ||
README.md | ||
styled-main-button.js |
MainButtonMobile
Usage
import MainButtonMobile from "@appserver/components/main-button-mobile";
const actionOptions = [
{
key: "1",
label: "New document",
icon: "static/images/mobile.actions.document.react.svg",
},
{
key: "2",
label: "New presentation",
icon: "static/images/mobile.actions.presentation.react.svg",
},
];
const buttonOptions = [
{
key: "1",
label: "Import point",
},
{
key: "2",
label: "Import point",
},
];
const progressOptions = [
{
key: "1",
label: "Uploads",
percent: 30,
status: `8/10`,
open: true,
},
];
<MainButtonMobile
style={{
top: "90%",
left: "82%",
position: "fixed",
}}
manualWidth="320px"
title="Upload"
withButton={true}
actionOptions={actionOptions}
progressOptions={progressOptions}
isOpenButton={true}
buttonOptions={buttonOptions}
/>;
Props | Type | Required | Values | Default | Description |
---|---|---|---|---|---|
style |
obj , array |
- | - | - | Accepts css style |
actionOptions |
obj |
- | - | - | Options for drop down items |
progressOptions |
obj |
- | - | - | If you need display progress bar components |
buttonOptions |
obj |
- | - | - | Menu that opens by clicking on the button |
onUploadClick |
func |
- | - | - | The function that will be called after the button click |
withButton |
bool |
- | - | - | Show button inside drop down |
isOpenButton |
bool |
- | - | - | The parameter that is used with buttonOptions is needed to open the menu by clicking on the button |
title |
string |
- | - | The name of the button in the drop down | |
percent |
number |
- | - | - | Loading indicator |
manualWidth |
string |
- | - | - | Required if you need to specify the exact width of the drop down component |
opened |
bool |
- | - | - | Tells when the dropdown should be opened |
className |
string |
- | - | - | Accepts class |
onClose |
func |
- | - | - | if you need close drop down |