Repository: codypearce/material-bread Branch: master Commit: 3fe2be241965 Files: 1505 Total size: 2.8 MB Directory structure: gitextract_7xy2lsa9/ ├── .buckconfig ├── .eslintrc ├── .flowconfig ├── .gitattributes ├── .github/ │ ├── ISSUE_TEMPLATE/ │ │ ├── bug_report.md │ │ └── feature_request.md │ └── config.yml ├── .gitignore ├── .jest-test-results.json ├── .npmignore ├── .prettierrc ├── .storybook/ │ ├── addons.js │ ├── babel.config.js │ ├── config.js │ └── webpack.config.js ├── .travis.yml ├── .watchmanconfig ├── App.js ├── LICENSE ├── README.md ├── android/ │ ├── app/ │ │ ├── BUCK │ │ ├── build.gradle │ │ ├── build_defs.bzl │ │ ├── proguard-rules.pro │ │ └── src/ │ │ └── main/ │ │ ├── AndroidManifest.xml │ │ ├── java/ │ │ │ └── com/ │ │ │ └── materialbread/ │ │ │ ├── MainActivity.java │ │ │ └── MainApplication.java │ │ └── res/ │ │ └── values/ │ │ ├── strings.xml │ │ └── styles.xml │ ├── build.gradle │ ├── gradle/ │ │ └── wrapper/ │ │ ├── gradle-wrapper.jar │ │ └── gradle-wrapper.properties │ ├── gradle.properties │ ├── gradlew │ ├── gradlew.bat │ ├── keystores/ │ │ ├── BUCK │ │ └── debug.keystore.properties │ └── settings.gradle ├── app.json ├── babel.config.js ├── dist/ │ ├── Components/ │ │ ├── Appbar/ │ │ │ ├── Appbar.js │ │ │ ├── Appbar.stories.js │ │ │ ├── Appbar.styles.js │ │ │ ├── Searchbar/ │ │ │ │ ├── Searchbar.js │ │ │ │ ├── Searchbar.stories.js │ │ │ │ └── Searchbar.styles.js │ │ │ └── index.js │ │ ├── AppbarBottom/ │ │ │ ├── AppbarBottom.js │ │ │ ├── AppbarBottom.stories.js │ │ │ ├── AppbarBottom.styles.js │ │ │ ├── AppbarBottom.svg.js │ │ │ └── index.js │ │ ├── Avatar/ │ │ │ ├── Avatar.js │ │ │ ├── Avatar.stories.js │ │ │ ├── Avatar.styles.js │ │ │ └── index.js │ │ ├── Backdrop/ │ │ │ ├── BackLayer/ │ │ │ │ ├── BackLayer.js │ │ │ │ └── BackLayer.styles.js │ │ │ ├── Backdrop.js │ │ │ ├── Backdrop.stories.js │ │ │ ├── Backdrop.styles.js │ │ │ ├── FrontLayer/ │ │ │ │ ├── FrontLayer.js │ │ │ │ └── FrontLayer.styles.js │ │ │ ├── FrontLayerScrim/ │ │ │ │ ├── FrontLayerScrim.js │ │ │ │ └── FrontLayerScrim.styles.js │ │ │ ├── HeaderButton/ │ │ │ │ ├── HeaderButton.js │ │ │ │ └── HeaderButton.styles.js │ │ │ ├── index.js │ │ │ └── utils.js │ │ ├── Badge/ │ │ │ ├── Badge.js │ │ │ ├── Badge.stories.js │ │ │ ├── Badge.styles.js │ │ │ └── index.js │ │ ├── Banner/ │ │ │ ├── Banner.js │ │ │ ├── Banner.stories.js │ │ │ ├── Banner.styles.js │ │ │ └── index.js │ │ ├── BottomNavigation/ │ │ │ ├── BottomNavigation.js │ │ │ ├── BottomNavigation.stories.js │ │ │ ├── BottomNavigation.styles.js │ │ │ ├── BottomNavigationItem/ │ │ │ │ ├── BottomNavigationItem.js │ │ │ │ ├── BottomNavigationItem.stories.js │ │ │ │ ├── BottomNavigationItem.styles.js │ │ │ │ └── index.js │ │ │ └── index.js │ │ ├── Button/ │ │ │ ├── Button.js │ │ │ ├── Button.stories.js │ │ │ ├── Button.styles.js │ │ │ ├── ButtonBase/ │ │ │ │ └── ButtonBase.js │ │ │ ├── ContainedButton/ │ │ │ │ ├── ContainedButton.js │ │ │ │ └── ContainedButton.stories.js │ │ │ ├── FlatButton/ │ │ │ │ ├── FlatButton.js │ │ │ │ └── FlatButton.stories.js │ │ │ ├── OutlinedButton/ │ │ │ │ ├── OutlinedButton.js │ │ │ │ └── OutlinedButton.stories.js │ │ │ ├── TextButton/ │ │ │ │ ├── TextButton.js │ │ │ │ └── TextButton.stories.js │ │ │ └── index.js │ │ ├── Card/ │ │ │ ├── Card.js │ │ │ ├── Card.stories.js │ │ │ ├── Card.styles.js │ │ │ ├── CardActions/ │ │ │ │ ├── CardActions.js │ │ │ │ ├── CardActions.styles.js │ │ │ │ └── index.js │ │ │ ├── CardContent/ │ │ │ │ ├── CardContent.js │ │ │ │ ├── CardContent.styles.js │ │ │ │ └── index.js │ │ │ ├── CardHeader/ │ │ │ │ ├── CardHeader.js │ │ │ │ ├── CardHeader.styles.js │ │ │ │ └── index.js │ │ │ ├── CardMedia/ │ │ │ │ ├── CardMedia.js │ │ │ │ ├── CardMedia.styles.js │ │ │ │ └── index.js │ │ │ └── index.js │ │ ├── Checkbox/ │ │ │ ├── Checkbox.js │ │ │ ├── Checkbox.stories.js │ │ │ ├── Checkbox.styles.js │ │ │ └── index.js │ │ ├── Chip/ │ │ │ ├── Chip.js │ │ │ ├── Chip.stories.js │ │ │ ├── Chip.styles.js │ │ │ └── index.js │ │ ├── DataTable/ │ │ │ ├── DataTable.js │ │ │ ├── DataTable.stories.js │ │ │ ├── DataTable.styles.js │ │ │ ├── DataTableCell/ │ │ │ │ ├── DataTableCell.js │ │ │ │ ├── DataTableCell.stories.js │ │ │ │ ├── DataTableCell.styles.js │ │ │ │ └── index.js │ │ │ ├── DataTableHeader/ │ │ │ │ ├── DataTableHeader.js │ │ │ │ ├── DataTableHeader.stories.js │ │ │ │ ├── DataTableHeader.styles.js │ │ │ │ └── index.js │ │ │ ├── DataTablePagination/ │ │ │ │ ├── DataTablePagination.js │ │ │ │ ├── DataTablePagination.stories.js │ │ │ │ ├── DataTablePagination.styles.js │ │ │ │ └── index.js │ │ │ ├── DataTableRow/ │ │ │ │ ├── DataTableRow.js │ │ │ │ ├── DataTableRow.stories.js │ │ │ │ ├── DataTableRow.styles.js │ │ │ │ └── index.js │ │ │ └── index.js │ │ ├── Dialog/ │ │ │ ├── Dialog.js │ │ │ ├── Dialog.stories.js │ │ │ ├── Dialog.styles.js │ │ │ └── index.js │ │ ├── Divider/ │ │ │ ├── Divider.js │ │ │ ├── Divider.stories.js │ │ │ ├── Divider.styles.js │ │ │ └── index.js │ │ ├── Drawer/ │ │ │ ├── Drawer.js │ │ │ ├── Drawer.stories.js │ │ │ ├── Drawer.styles.js │ │ │ ├── DrawerHeader/ │ │ │ │ ├── DrawerHeader.js │ │ │ │ ├── DrawerHeader.stories.js │ │ │ │ ├── DrawerHeader.styles.js │ │ │ │ └── index.js │ │ │ ├── DrawerItem/ │ │ │ │ ├── DrawerItem.js │ │ │ │ ├── DrawerItem.stories.js │ │ │ │ ├── DrawerItem.styles.js │ │ │ │ └── index.js │ │ │ ├── DrawerSection/ │ │ │ │ ├── DrawerSection.js │ │ │ │ ├── DrawerSection.stories.js │ │ │ │ ├── DrawerSection.styles.js │ │ │ │ └── index.js │ │ │ └── index.js │ │ ├── DrawerBottom/ │ │ │ ├── DrawerBottom.js │ │ │ ├── DrawerBottom.stories.js │ │ │ ├── DrawerBottom.styles.js │ │ │ └── index.js │ │ ├── Fab/ │ │ │ ├── Fab.js │ │ │ ├── Fab.stories.js │ │ │ ├── Fab.styles.js │ │ │ ├── FabSpeedDial/ │ │ │ │ ├── FabSpeedDial.js │ │ │ │ ├── FabSpeedDial.stories.js │ │ │ │ ├── FabSpeedDial.styles.js │ │ │ │ └── index.js │ │ │ └── index.js │ │ ├── Icon/ │ │ │ ├── Icon.js │ │ │ ├── Icon.styles.js │ │ │ ├── Icons.stories.js │ │ │ └── index.js │ │ ├── IconButton/ │ │ │ ├── IconButton.js │ │ │ ├── IconButton.stories.js │ │ │ ├── IconButton.styles.js │ │ │ └── index.js │ │ ├── List/ │ │ │ ├── List.js │ │ │ ├── List.stories.js │ │ │ ├── List.styles.js │ │ │ ├── ListExpand/ │ │ │ │ ├── ListExpand.js │ │ │ │ ├── ListExpand.stories.js │ │ │ │ ├── ListExpand.styles.js │ │ │ │ └── index.js │ │ │ ├── ListItem/ │ │ │ │ ├── ListItem.js │ │ │ │ ├── ListItem.stories.js │ │ │ │ ├── ListItem.styles.js │ │ │ │ └── index.js │ │ │ ├── ListSection/ │ │ │ │ ├── ListSection.js │ │ │ │ ├── ListSection.stories.js │ │ │ │ ├── ListSection.styles.js │ │ │ │ └── index.js │ │ │ └── index.js │ │ ├── Menu/ │ │ │ ├── Menu.js │ │ │ ├── Menu.stories.js │ │ │ ├── Menu.styles.js │ │ │ ├── MenuItem/ │ │ │ │ ├── MenuItem.js │ │ │ │ ├── MenuItem.stories.js │ │ │ │ ├── MenuItem.styles.js │ │ │ │ └── index.js │ │ │ ├── ModalMenu/ │ │ │ │ ├── ModalMenu.native.styles.js │ │ │ │ ├── ModalMenu.styles.js │ │ │ │ ├── Portal.js │ │ │ │ ├── ariaAppHider.js │ │ │ │ ├── index.js │ │ │ │ ├── index.native.js │ │ │ │ ├── index.web.js │ │ │ │ └── utils.js │ │ │ └── index.js │ │ ├── Modal/ │ │ │ ├── Modal.android.js │ │ │ ├── Modal.ios.js │ │ │ ├── Modal.js │ │ │ ├── Modal.styles.js │ │ │ └── Modal.web.js │ │ ├── Paper/ │ │ │ ├── Paper.js │ │ │ ├── Paper.stories.js │ │ │ └── Paper.styles.js │ │ ├── Progress/ │ │ │ ├── ProgressBar/ │ │ │ │ ├── ProgressBar.js │ │ │ │ ├── ProgressBar.stories.js │ │ │ │ ├── ProgressBar.styles.js │ │ │ │ └── index.js │ │ │ └── ProgressCircle/ │ │ │ ├── ProgressCircle.js │ │ │ ├── ProgressCircle.stories.js │ │ │ ├── ProgressCircle.styles.js │ │ │ ├── ProgressCircleDeterminate.js │ │ │ └── index.js │ │ ├── RadioButton/ │ │ │ ├── RadioButton.js │ │ │ ├── RadioButton.stories.js │ │ │ ├── RadioButton.styles.js │ │ │ └── index.js │ │ ├── Ripple/ │ │ │ ├── Ripple.js │ │ │ ├── Ripple.stories.js │ │ │ ├── Ripple.styles.js │ │ │ └── index.js │ │ ├── Select/ │ │ │ ├── Select.js │ │ │ ├── Select.styles.js │ │ │ ├── SelectFilled/ │ │ │ │ └── SelectFilled.stories.js │ │ │ ├── SelectFlat/ │ │ │ │ └── SelectFlat.stories.js │ │ │ ├── SelectOutlined/ │ │ │ │ └── SelectOutlined.stories.js │ │ │ └── index.js │ │ ├── SheetBottom/ │ │ │ ├── SheetBottom.js │ │ │ ├── SheetBottom.native.js │ │ │ ├── SheetBottom.stories.js │ │ │ ├── SheetBottom.styles.js │ │ │ ├── SheetBottom.web.js │ │ │ └── index.js │ │ ├── SheetSide/ │ │ │ ├── SheetSide.android.js │ │ │ ├── SheetSide.ios.js │ │ │ ├── SheetSide.js │ │ │ ├── SheetSide.stories.js │ │ │ ├── SheetSide.styles.js │ │ │ ├── SheetSide.web.js │ │ │ └── index.js │ │ ├── Slider/ │ │ │ ├── Marker/ │ │ │ │ ├── Marker.js │ │ │ │ └── Marker.styles.js │ │ │ ├── MarkerContainer/ │ │ │ │ ├── MarkerContainer.js │ │ │ │ └── MarkerContainer.styles.js │ │ │ ├── Slider.js │ │ │ ├── Slider.stories.js │ │ │ ├── Slider.styles.js │ │ │ ├── Track/ │ │ │ │ ├── Track.js │ │ │ │ └── Track.styles.js │ │ │ ├── converts.js │ │ │ └── index.js │ │ ├── Snackbar/ │ │ │ ├── Snackbar.js │ │ │ ├── Snackbar.stories.js │ │ │ ├── Snackbar.styles.js │ │ │ └── index.js │ │ ├── SwipeNav/ │ │ │ ├── SwipeNav.js │ │ │ ├── SwipeNav.stories.js │ │ │ ├── SwipeNav.styles.js │ │ │ └── index.js │ │ ├── Switch/ │ │ │ ├── Switch.js │ │ │ ├── Switch.stories.js │ │ │ ├── Switch.styles.js │ │ │ └── index.js │ │ ├── Tabs/ │ │ │ ├── Tab/ │ │ │ │ ├── Tab.js │ │ │ │ ├── Tab.stories.js │ │ │ │ ├── Tab.styles.js │ │ │ │ └── index.js │ │ │ ├── Tabs.js │ │ │ ├── Tabs.stories.js │ │ │ ├── Tabs.styles.js │ │ │ ├── Underline/ │ │ │ │ ├── Underline.js │ │ │ │ └── Undrline.styles.js │ │ │ └── index.js │ │ ├── TextField/ │ │ │ ├── Searchfield/ │ │ │ │ ├── Searchfield.js │ │ │ │ ├── Searchfield.stories.js │ │ │ │ └── Searchfield.styles.js │ │ │ ├── TextField.js │ │ │ ├── TextField.styles.js │ │ │ ├── TextFieldFilled/ │ │ │ │ ├── TextFieldFilled.js │ │ │ │ ├── TextFieldFilled.stories.js │ │ │ │ └── TextFieldFilled.styles.js │ │ │ ├── TextFieldFlat/ │ │ │ │ ├── TextFieldFlat.js │ │ │ │ ├── TextFieldFlat.stories.js │ │ │ │ └── TextFieldFlat.styles.js │ │ │ ├── TextFieldHelperText/ │ │ │ │ ├── TextFieldHelperText.js │ │ │ │ ├── TextFieldHelperText.styles.js │ │ │ │ └── index.js │ │ │ ├── TextFieldLabel/ │ │ │ │ ├── TextFieldLabel.constants.js │ │ │ │ ├── TextFieldLabel.constants.native.js │ │ │ │ ├── TextFieldLabel.constants.web.js │ │ │ │ ├── TextFieldLabel.js │ │ │ │ └── TextFieldLabel.styles.js │ │ │ ├── TextFieldOutline/ │ │ │ │ ├── TextFieldOutline.js │ │ │ │ ├── TextFieldOutline.stories.js │ │ │ │ └── TextFieldOutline.styles.js │ │ │ ├── TextFieldUnderline/ │ │ │ │ ├── TextFieldUnderline.js │ │ │ │ └── TextFieldUnderline.styles.js │ │ │ └── index.js │ │ ├── ToggleButton/ │ │ │ ├── ToggleButton.js │ │ │ ├── ToggleButton.stories.js │ │ │ ├── ToggleButton.styles.js │ │ │ ├── ToggleButtonGroup/ │ │ │ │ ├── ToggleButtonGroup.js │ │ │ │ └── index.js │ │ │ └── index.js │ │ ├── Tooltip/ │ │ │ ├── Tooltip.js │ │ │ ├── Tooltip.stories.js │ │ │ ├── Tooltip.styles.js │ │ │ └── index.js │ │ └── Typography/ │ │ ├── BaseText/ │ │ │ └── BaseText.js │ │ ├── BodyText/ │ │ │ └── BodyText.js │ │ ├── Caption/ │ │ │ └── Caption.js │ │ ├── Heading/ │ │ │ └── Heading.js │ │ ├── Overline/ │ │ │ └── Overline.js │ │ ├── Subtitle/ │ │ │ └── Subtitle.js │ │ ├── Typography.stories.js │ │ └── index.js │ ├── Core/ │ │ ├── BreadProvider.js │ │ └── colors/ │ │ ├── amber.js │ │ ├── blue.js │ │ ├── blueGrey.js │ │ ├── brown.js │ │ ├── cyan.js │ │ ├── deepOrange.js │ │ ├── deepPurple.js │ │ ├── green.js │ │ ├── grey.js │ │ ├── index.js │ │ ├── indigo.js │ │ ├── lightBlue.js │ │ ├── lightGreen.js │ │ ├── lime.js │ │ ├── orange.js │ │ ├── pink.js │ │ ├── purple.js │ │ ├── red.js │ │ ├── teal.js │ │ └── yellow.js │ ├── Theme/ │ │ ├── ThemeContext.js │ │ ├── defaultTheme.js │ │ ├── mergeTheme.js │ │ └── withTheme.js │ ├── Utils/ │ │ ├── Anchor/ │ │ │ ├── Anchor.js │ │ │ └── Anchor.stories.js │ │ ├── Hoverable/ │ │ │ ├── HoverState.js │ │ │ ├── Hoverable.js │ │ │ └── Hoverable.stories.js │ │ └── Shadow/ │ │ ├── Shadow.stories.js │ │ └── shadow.js │ ├── helpers/ │ │ ├── hasNotch.js │ │ └── statusBarHeight.js │ ├── index.d.ts │ ├── index.js │ ├── storybook/ │ │ ├── components/ │ │ │ ├── Container.js │ │ │ └── Header.js │ │ ├── helpers/ │ │ │ └── storiesOf/ │ │ │ ├── index.android.js │ │ │ ├── index.ios.js │ │ │ └── index.js │ │ ├── index.android.js │ │ ├── index.ios.js │ │ ├── index.js │ │ ├── rn-addons.js │ │ ├── stories/ │ │ │ ├── Home.stories.js │ │ │ └── index.js │ │ └── storybook.js │ └── vue-native.js ├── docs/ │ ├── .babelrc │ ├── .eslintrc │ ├── README.md │ ├── gatsby-browser.js │ ├── gatsby-config.js │ ├── gatsby-node.js │ ├── gatsby-ssr.js │ ├── package.json │ └── src/ │ ├── blog/ │ │ └── baking-material/ │ │ └── 1-appbar-bottom.md │ ├── components/ │ │ ├── BackgroundColors/ │ │ │ └── BackgroundColors.js │ │ ├── BrowserCSS.js │ │ ├── CodeBlock.js │ │ ├── CodeInline.js │ │ ├── ColorPalette/ │ │ │ ├── ColorBlock/ │ │ │ │ ├── ColorBlock.js │ │ │ │ ├── ColorBlock.styles.js │ │ │ │ └── index.js │ │ │ ├── ColorPalette.js │ │ │ └── FullPalette.js │ │ ├── ComponentPage/ │ │ │ ├── ComponentDemo.js │ │ │ ├── ComponentDemoHeader.js │ │ │ ├── ComponentDescription.js │ │ │ ├── ComponentHeader.js │ │ │ ├── ComponentMainDemo.js │ │ │ ├── ComponentPageLayout.js │ │ │ ├── ComponentProps.js │ │ │ ├── ComponentSubtitle.js │ │ │ └── ComponentUsage.js │ │ ├── Drawer/ │ │ │ ├── DrawerContent.js │ │ │ ├── DrawerHeader.js │ │ │ ├── DrawerItem.js │ │ │ └── DrawerItemExpand.js │ │ ├── Helmet.js │ │ ├── HomeLiveEdit/ │ │ │ ├── HomeLiveEdit.js │ │ │ └── HomeLiveEditToolTip.js │ │ ├── IconDirectory/ │ │ │ ├── IconBlock.js │ │ │ └── IconDirectory.js │ │ ├── Iphonex.js │ │ ├── Layout/ │ │ │ ├── Header.js │ │ │ └── PageLayout.js │ │ ├── Link.js │ │ ├── LiveEdit/ │ │ │ ├── LiveEdit.js │ │ │ └── LiveEditToolTip.js │ │ ├── Logo/ │ │ │ ├── Logo.js │ │ │ └── LogoWithText.js │ │ ├── P.js │ │ ├── PageTitle.js │ │ ├── Pixel3xl.js │ │ ├── PlatformButton.js │ │ ├── PropsTable/ │ │ │ └── index.js │ │ ├── Section.js │ │ ├── SectionHeader.js │ │ ├── SideScrollMenu/ │ │ │ └── index.js │ │ ├── Sponsored.js │ │ ├── blog/ │ │ │ ├── Layout.js │ │ │ └── seo.js │ │ ├── image.js │ │ └── index.js │ ├── content/ │ │ ├── components/ │ │ │ ├── appbar/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── CustomDemo.js │ │ │ │ │ ├── ImageDemo.js │ │ │ │ │ ├── MenuDemo.js │ │ │ │ │ ├── SearchBarDemo.js │ │ │ │ │ ├── SearchFieldDemo.js │ │ │ │ │ ├── SubtitleDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── appbar-bottom/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── CustomDemo.js │ │ │ │ │ ├── EndFabDemo.js │ │ │ │ │ ├── NoFabDemo.js │ │ │ │ │ ├── SpeedDialDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── avatar/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── CustomDemo.js │ │ │ │ │ ├── IconDemo.js │ │ │ │ │ ├── TextDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── backdrop/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── SubheaderDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── badge/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── AnimatedDemo.js │ │ │ │ │ ├── DotDemo.js │ │ │ │ │ ├── MaxDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── banner/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── SingleLineDemo.js │ │ │ │ │ ├── ThreeLineDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── bottom-navigation/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── ColoredDemo.js │ │ │ │ │ ├── IconsOnly.js │ │ │ │ │ ├── LabelsDemo.js │ │ │ │ │ ├── LandscapeDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── bottom-navigation-item/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── BadgeDemo.js │ │ │ │ │ ├── CustomDemo.js │ │ │ │ │ ├── StyledDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── button/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── ContainedDemo.js │ │ │ │ │ ├── CustomDemo.js │ │ │ │ │ ├── FlatDemo.js │ │ │ │ │ ├── FullWidthDemo.js │ │ │ │ │ ├── IconsDemo.js │ │ │ │ │ ├── OutlinedDemo.js │ │ │ │ │ ├── TextDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── card/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── ActionMediaDemo.js │ │ │ │ │ ├── ClickableDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── card-actions/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── CustomDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── card-content/ │ │ │ │ ├── Demos/ │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── card-header/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── MoreActions.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── card-media/ │ │ │ │ ├── Demos/ │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── checkbox/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── IOSDemo.js │ │ │ │ │ ├── IconsDemo.js │ │ │ │ │ ├── LabelsDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── chip/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── CustomDemo.js │ │ │ │ │ ├── DeleteChipDemo.js │ │ │ │ │ ├── IconsDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── datatable/ │ │ │ │ ├── Demos/ │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── datatable-cell/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── SortingIconDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── datatable-header/ │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── datatable-pagination/ │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── datatable-row/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── CheckboxDemo.js │ │ │ │ │ ├── SelectedDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── dialog/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── AlertDemo.js │ │ │ │ │ ├── SimpleDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── divider/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── InsetLeftDemo.js │ │ │ │ │ ├── SubheaderDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── drawer/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── ClippedDemo.js │ │ │ │ │ ├── PermanentDemo.js │ │ │ │ │ ├── PushDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── drawer-bottom/ │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── drawer-header/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── AvatarDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── drawer-item/ │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── drawer-section/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── LabelDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── fab/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── AnimatedDemo.js │ │ │ │ │ ├── ExtendedDemo.js │ │ │ │ │ ├── MiniDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── fab-speeddial/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── ExtendedDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── icon/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── AnotherSourceDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── iconbutton/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── AnotherSourceDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── list/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── SubheaderDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── list-expand/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── IconDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── list-item/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── ActionItemDemo.js │ │ │ │ │ ├── LeadingActionDemo.js │ │ │ │ │ ├── SecondaryDemo.js │ │ │ │ │ ├── SelectedDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── list-section/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── InsetDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── menu/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── ScrollingDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── menu-item/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── IconDemo.js │ │ │ │ │ ├── KeyboardDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── paper/ │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── progress-bar/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── DeterminateDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── progress-circle/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── DeterminateDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── radiobutton/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── LabelsDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── ripple/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── CenteredDemo.js │ │ │ │ │ ├── SequentialDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── searchbar/ │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── searchfield/ │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── select/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── TextFieldPropsDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── sheet-bottom/ │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── sheet-side/ │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── slider/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── RangedDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── snackbar/ │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── swipenav/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── SwipeFooter.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── switch/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── LabelsDemo.js │ │ │ │ │ ├── LoaderDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── tab/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── StyledDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── tabs/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── IconsOnly.js │ │ │ │ │ ├── LabelsDemo.js │ │ │ │ │ ├── ScrollableDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── textfield/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── DenseDemo.js │ │ │ │ │ ├── HelperTextDemo.js │ │ │ │ │ ├── LeadingIconDemo.js │ │ │ │ │ ├── PrefixSuffixDemo.js │ │ │ │ │ ├── TrailingIconDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── togglebutton/ │ │ │ │ ├── Demos/ │ │ │ │ │ ├── CustomDemo.js │ │ │ │ │ └── index.js │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── togglebutton-group/ │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ ├── tooltip/ │ │ │ │ ├── MainDemo.js │ │ │ │ ├── Props.js │ │ │ │ ├── Usage.js │ │ │ │ ├── index.js │ │ │ │ └── propData.js │ │ │ └── typography/ │ │ │ ├── MainDemo.js │ │ │ ├── Props.js │ │ │ ├── Usage.js │ │ │ ├── index.js │ │ │ └── propData.js │ │ └── utils/ │ │ ├── anchor/ │ │ │ ├── MainDemo.js │ │ │ ├── Props.js │ │ │ ├── Usage.js │ │ │ ├── index.js │ │ │ └── propData.js │ │ ├── color/ │ │ │ ├── MainDemo.js │ │ │ ├── Usage.js │ │ │ └── index.js │ │ ├── hoverable/ │ │ │ ├── Demos/ │ │ │ │ ├── AnimatedDemo.js │ │ │ │ └── index.js │ │ │ ├── MainDemo.js │ │ │ ├── Props.js │ │ │ ├── Usage.js │ │ │ ├── index.js │ │ │ └── propData.js │ │ └── shadow/ │ │ ├── MainDemo.js │ │ ├── Usage.js │ │ └── index.js │ ├── html.js │ ├── navigation/ │ │ ├── componentPages.js │ │ ├── contributingPages.js │ │ ├── gettingStartedPages.js │ │ ├── index.js │ │ ├── stylePages.js │ │ └── utilsPages.js │ ├── pages/ │ │ ├── 404.js │ │ ├── about.js │ │ ├── baking-material.js │ │ ├── components/ │ │ │ ├── appbar-bottom.js │ │ │ ├── appbar.js │ │ │ ├── avatar.js │ │ │ ├── backdrop.js │ │ │ ├── badge.js │ │ │ ├── banner.js │ │ │ ├── bottom-navigation-item.js │ │ │ ├── bottom-navigation.js │ │ │ ├── button.js │ │ │ ├── card-actions.js │ │ │ ├── card-content.js │ │ │ ├── card-header.js │ │ │ ├── card-media.js │ │ │ ├── card.js │ │ │ ├── checkbox.js │ │ │ ├── chip.js │ │ │ ├── datatable-cell.js │ │ │ ├── datatable-header.js │ │ │ ├── datatable-pagination.js │ │ │ ├── datatable-row.js │ │ │ ├── datatable.js │ │ │ ├── dialog.js │ │ │ ├── divider.js │ │ │ ├── drawer-bottom.js │ │ │ ├── drawer-header.js │ │ │ ├── drawer-item.js │ │ │ ├── drawer-section.js │ │ │ ├── drawer.js │ │ │ ├── fab-speeddial.js │ │ │ ├── fab.js │ │ │ ├── icon.js │ │ │ ├── iconbutton.js │ │ │ ├── list-expand.js │ │ │ ├── list-item.js │ │ │ ├── list-section.js │ │ │ ├── list.js │ │ │ ├── menu-item.js │ │ │ ├── menu.js │ │ │ ├── paper.js │ │ │ ├── progress-bar.js │ │ │ ├── progress-circle.js │ │ │ ├── radiobutton.js │ │ │ ├── ripple.js │ │ │ ├── searchbar.js │ │ │ ├── searchfield.js │ │ │ ├── select.js │ │ │ ├── sheet-bottom.js │ │ │ ├── sheet-side.js │ │ │ ├── slider.js │ │ │ ├── snackbar.js │ │ │ ├── swipenav.js │ │ │ ├── switch.js │ │ │ ├── tab.js │ │ │ ├── tabs.js │ │ │ ├── textfield.js │ │ │ ├── togglebutton-group.js │ │ │ ├── togglebutton.js │ │ │ ├── tooltip.js │ │ │ └── typography.js │ │ ├── contributing/ │ │ │ ├── docs.js │ │ │ └── library.js │ │ ├── getting-started/ │ │ │ ├── electron.js │ │ │ ├── expo.js │ │ │ ├── macos.js │ │ │ ├── nextjs.js │ │ │ ├── react-native.js │ │ │ ├── vue-native.js │ │ │ ├── web.js │ │ │ └── windows.js │ │ ├── index.js │ │ ├── showcase.js │ │ ├── style/ │ │ │ ├── font.js │ │ │ ├── icons.js │ │ │ └── theme.js │ │ └── utils/ │ │ ├── anchor.js │ │ ├── color.js │ │ ├── hoverable.js │ │ └── shadow.js │ ├── styles/ │ │ ├── components/ │ │ │ ├── CodeBlock.css │ │ │ └── Logo.css │ │ ├── global/ │ │ │ └── global.css │ │ ├── pages/ │ │ │ └── index.module.css │ │ ├── templates/ │ │ │ └── Page.css │ │ └── vendor/ │ │ └── prism.css │ ├── templates/ │ │ ├── blog-post.js │ │ ├── component.js │ │ └── page.js │ └── utils/ │ └── createPropData.js ├── index.js ├── ios/ │ ├── MaterialBread/ │ │ ├── AppDelegate.h │ │ ├── AppDelegate.m │ │ ├── Base.lproj/ │ │ │ └── LaunchScreen.xib │ │ ├── Images.xcassets/ │ │ │ ├── AppIcon.appiconset/ │ │ │ │ └── Contents.json │ │ │ └── Contents.json │ │ ├── Info.plist │ │ └── main.m │ ├── MaterialBread-tvOS/ │ │ └── Info.plist │ ├── MaterialBread-tvOSTests/ │ │ └── Info.plist │ ├── MaterialBread.xcodeproj/ │ │ ├── project.pbxproj │ │ └── xcshareddata/ │ │ └── xcschemes/ │ │ ├── MaterialBread-tvOS.xcscheme │ │ └── MaterialBread.xcscheme │ └── MaterialBreadTests/ │ ├── Info.plist │ └── MaterialBreadTests.m ├── netlify.toml ├── package.json ├── public/ │ ├── index.js │ └── manifest.json ├── rn-cli.config.js ├── src/ │ ├── Components/ │ │ ├── Appbar/ │ │ │ ├── .Appbar.js.swp │ │ │ ├── Appbar.js │ │ │ ├── Appbar.stories.js │ │ │ ├── Appbar.styles.js │ │ │ ├── Appbar.test.js │ │ │ ├── Searchbar/ │ │ │ │ ├── Searchbar.js │ │ │ │ ├── Searchbar.stories.js │ │ │ │ ├── Searchbar.styles.js │ │ │ │ ├── Searchbar.test.js │ │ │ │ └── __snapshots__/ │ │ │ │ └── Searchbar.test.js.snap │ │ │ ├── __snapshots__/ │ │ │ │ └── Appbar.test.js.snap │ │ │ └── index.js │ │ ├── AppbarBottom/ │ │ │ ├── AppbarBottom.js │ │ │ ├── AppbarBottom.stories.js │ │ │ ├── AppbarBottom.styles.js │ │ │ ├── AppbarBottom.svg.js │ │ │ ├── AppbarBottom.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── AppbarBottom.test.js.snap │ │ │ └── index.js │ │ ├── Avatar/ │ │ │ ├── Avatar.js │ │ │ ├── Avatar.stories.js │ │ │ ├── Avatar.styles.js │ │ │ ├── Avatar.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Avatar.test.js.snap │ │ │ └── index.js │ │ ├── Backdrop/ │ │ │ ├── BackLayer/ │ │ │ │ ├── BackLayer.js │ │ │ │ └── BackLayer.styles.js │ │ │ ├── Backdrop.js │ │ │ ├── Backdrop.stories.js │ │ │ ├── Backdrop.styles.js │ │ │ ├── Backdrop.test.js │ │ │ ├── FrontLayer/ │ │ │ │ ├── FrontLayer.js │ │ │ │ └── FrontLayer.styles.js │ │ │ ├── FrontLayerScrim/ │ │ │ │ ├── FrontLayerScrim.js │ │ │ │ └── FrontLayerScrim.styles.js │ │ │ ├── HeaderButton/ │ │ │ │ ├── HeaderButton.js │ │ │ │ └── HeaderButton.styles.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Backdrop.test.js.snap │ │ │ ├── index.js │ │ │ └── utils.js │ │ ├── Badge/ │ │ │ ├── Badge.js │ │ │ ├── Badge.stories.js │ │ │ ├── Badge.styles.js │ │ │ ├── Badge.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Badge.test.js.snap │ │ │ └── index.js │ │ ├── Banner/ │ │ │ ├── Banner.js │ │ │ ├── Banner.stories.js │ │ │ ├── Banner.styles.js │ │ │ ├── Banner.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Banner.test.js.snap │ │ │ └── index.js │ │ ├── BottomNavigation/ │ │ │ ├── BottomNavigation.js │ │ │ ├── BottomNavigation.stories.js │ │ │ ├── BottomNavigation.styles.js │ │ │ ├── BottomNavigation.test.js │ │ │ ├── BottomNavigationItem/ │ │ │ │ ├── BottomNavigationItem.js │ │ │ │ ├── BottomNavigationItem.stories.js │ │ │ │ ├── BottomNavigationItem.styles.js │ │ │ │ ├── BottomNavigationItem.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── BottomNavigationItem.test.js.snap │ │ │ │ └── index.js │ │ │ ├── __snapshots__/ │ │ │ │ └── BottomNavigation.test.js.snap │ │ │ └── index.js │ │ ├── Button/ │ │ │ ├── Button.js │ │ │ ├── Button.stories.js │ │ │ ├── Button.styles.js │ │ │ ├── Button.test.js │ │ │ ├── ButtonBase/ │ │ │ │ └── ButtonBase.js │ │ │ ├── ContainedButton/ │ │ │ │ ├── ContainedButton.js │ │ │ │ └── ContainedButton.stories.js │ │ │ ├── FlatButton/ │ │ │ │ ├── FlatButton.js │ │ │ │ └── FlatButton.stories.js │ │ │ ├── OutlinedButton/ │ │ │ │ ├── OutlinedButton.js │ │ │ │ └── OutlinedButton.stories.js │ │ │ ├── TextButton/ │ │ │ │ ├── TextButton.js │ │ │ │ └── TextButton.stories.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Button.test.js.snap │ │ │ └── index.js │ │ ├── Card/ │ │ │ ├── Card.js │ │ │ ├── Card.stories.js │ │ │ ├── Card.styles.js │ │ │ ├── Card.test.js │ │ │ ├── CardActions/ │ │ │ │ ├── CardActions.js │ │ │ │ ├── CardActions.styles.js │ │ │ │ ├── CardActions.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── CardActions.test.js.snap │ │ │ │ └── index.js │ │ │ ├── CardContent/ │ │ │ │ ├── CardContent.js │ │ │ │ ├── CardContent.styles.js │ │ │ │ ├── CardContent.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── CardContent.test.js.snap │ │ │ │ └── index.js │ │ │ ├── CardHeader/ │ │ │ │ ├── CardHeader.js │ │ │ │ ├── CardHeader.styles.js │ │ │ │ ├── CardHeader.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── CardHeader.test.js.snap │ │ │ │ └── index.js │ │ │ ├── CardMedia/ │ │ │ │ ├── CardMedia.js │ │ │ │ ├── CardMedia.styles.js │ │ │ │ ├── CardMedia.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── CardMedia.test.js.snap │ │ │ │ └── index.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Card.test.js.snap │ │ │ └── index.js │ │ ├── Checkbox/ │ │ │ ├── Checkbox.js │ │ │ ├── Checkbox.stories.js │ │ │ ├── Checkbox.styles.js │ │ │ ├── Checkbox.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Checkbox.test.js.snap │ │ │ └── index.js │ │ ├── Chip/ │ │ │ ├── Chip.js │ │ │ ├── Chip.stories.js │ │ │ ├── Chip.styles.js │ │ │ ├── Chip.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Chip.test.js.snap │ │ │ └── index.js │ │ ├── DataTable/ │ │ │ ├── DataTable.js │ │ │ ├── DataTable.stories.js │ │ │ ├── DataTable.styles.js │ │ │ ├── DataTable.test.js │ │ │ ├── DataTableCell/ │ │ │ │ ├── DataTableCell.js │ │ │ │ ├── DataTableCell.stories.js │ │ │ │ ├── DataTableCell.styles.js │ │ │ │ ├── DataTableCell.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── DataTableCell.test.js.snap │ │ │ │ └── index.js │ │ │ ├── DataTableHeader/ │ │ │ │ ├── DataTableHeader.js │ │ │ │ ├── DataTableHeader.stories.js │ │ │ │ ├── DataTableHeader.styles.js │ │ │ │ ├── DataTableHeader.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── DataTableHeader.test.js.snap │ │ │ │ └── index.js │ │ │ ├── DataTablePagination/ │ │ │ │ ├── DataTablePagination.js │ │ │ │ ├── DataTablePagination.stories.js │ │ │ │ ├── DataTablePagination.styles.js │ │ │ │ ├── DataTablePagination.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── DataTablePagination.test.js.snap │ │ │ │ └── index.js │ │ │ ├── DataTableRow/ │ │ │ │ ├── DataTableRow.js │ │ │ │ ├── DataTableRow.stories.js │ │ │ │ ├── DataTableRow.styles.js │ │ │ │ ├── DataTableRow.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── DataTableRow.test.js.snap │ │ │ │ └── index.js │ │ │ ├── __snapshots__/ │ │ │ │ └── DataTable.test.js.snap │ │ │ └── index.js │ │ ├── Dialog/ │ │ │ ├── Dialog.js │ │ │ ├── Dialog.stories.js │ │ │ ├── Dialog.styles.js │ │ │ ├── Dialog.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Dialog.test.js.snap │ │ │ └── index.js │ │ ├── Divider/ │ │ │ ├── Divider.js │ │ │ ├── Divider.stories.js │ │ │ ├── Divider.styles.js │ │ │ ├── Divider.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Divider.test.js.snap │ │ │ └── index.js │ │ ├── Drawer/ │ │ │ ├── Drawer.js │ │ │ ├── Drawer.stories.js │ │ │ ├── Drawer.styles.js │ │ │ ├── Drawer.test.js │ │ │ ├── DrawerHeader/ │ │ │ │ ├── DrawerHeader.js │ │ │ │ ├── DrawerHeader.stories.js │ │ │ │ ├── DrawerHeader.styles.js │ │ │ │ ├── DrawerHeader.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── DrawerHeader.test.js.snap │ │ │ │ └── index.js │ │ │ ├── DrawerItem/ │ │ │ │ ├── DrawerItem.js │ │ │ │ ├── DrawerItem.stories.js │ │ │ │ ├── DrawerItem.styles.js │ │ │ │ ├── DrawerItem.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── DrawerItem.test.js.snap │ │ │ │ └── index.js │ │ │ ├── DrawerSection/ │ │ │ │ ├── DrawerSection.js │ │ │ │ ├── DrawerSection.stories.js │ │ │ │ ├── DrawerSection.styles.js │ │ │ │ ├── DrawerSection.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── DrawerSection.test.js.snap │ │ │ │ └── index.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Drawer.test.js.snap │ │ │ └── index.js │ │ ├── DrawerBottom/ │ │ │ ├── DrawerBottom.js │ │ │ ├── DrawerBottom.stories.js │ │ │ ├── DrawerBottom.styles.js │ │ │ ├── DrawerBottom.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── DrawerBottom.test.js.snap │ │ │ └── index.js │ │ ├── Fab/ │ │ │ ├── Fab.js │ │ │ ├── Fab.stories.js │ │ │ ├── Fab.styles.js │ │ │ ├── Fab.test.js │ │ │ ├── FabSpeedDial/ │ │ │ │ ├── FabSpeedDial.js │ │ │ │ ├── FabSpeedDial.stories.js │ │ │ │ ├── FabSpeedDial.styles.js │ │ │ │ ├── FabSpeedDial.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── FabSpeedDial.test.js.snap │ │ │ │ └── index.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Fab.test.js.snap │ │ │ └── index.js │ │ ├── Icon/ │ │ │ ├── Icon.js │ │ │ ├── Icon.styles.js │ │ │ ├── Icon.test.js │ │ │ ├── Icons.stories.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Icon.test.js.snap │ │ │ └── index.js │ │ ├── IconButton/ │ │ │ ├── IconButton.js │ │ │ ├── IconButton.stories.js │ │ │ ├── IconButton.styles.js │ │ │ ├── IconButton.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── IconButton.test.js.snap │ │ │ └── index.js │ │ ├── List/ │ │ │ ├── List.js │ │ │ ├── List.stories.js │ │ │ ├── List.styles.js │ │ │ ├── List.test.js │ │ │ ├── ListExpand/ │ │ │ │ ├── ListExpand.js │ │ │ │ ├── ListExpand.stories.js │ │ │ │ ├── ListExpand.styles.js │ │ │ │ ├── ListExpand.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── ListExpand.test.js.snap │ │ │ │ └── index.js │ │ │ ├── ListItem/ │ │ │ │ ├── ListItem.js │ │ │ │ ├── ListItem.stories.js │ │ │ │ ├── ListItem.styles.js │ │ │ │ ├── ListItem.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── ListItem.test.js.snap │ │ │ │ └── index.js │ │ │ ├── ListSection/ │ │ │ │ ├── ListSection.js │ │ │ │ ├── ListSection.stories.js │ │ │ │ ├── ListSection.styles.js │ │ │ │ ├── ListSection.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── ListSection.test.js.snap │ │ │ │ └── index.js │ │ │ ├── __snapshots__/ │ │ │ │ └── List.test.js.snap │ │ │ └── index.js │ │ ├── Menu/ │ │ │ ├── Menu.js │ │ │ ├── Menu.stories.js │ │ │ ├── Menu.styles.js │ │ │ ├── Menu.test.js │ │ │ ├── MenuItem/ │ │ │ │ ├── MenuItem.js │ │ │ │ ├── MenuItem.stories.js │ │ │ │ ├── MenuItem.styles.js │ │ │ │ ├── MenuItem.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── MenuItem.test.js.snap │ │ │ │ └── index.js │ │ │ ├── ModalMenu/ │ │ │ │ ├── ModalMenu.native.styles.js │ │ │ │ ├── ModalMenu.styles.js │ │ │ │ ├── Portal.js │ │ │ │ ├── ariaAppHider.js │ │ │ │ ├── index.js │ │ │ │ ├── index.native.js │ │ │ │ ├── index.web.js │ │ │ │ └── utils.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Menu.test.js.snap │ │ │ └── index.js │ │ ├── Modal/ │ │ │ ├── Modal.android.js │ │ │ ├── Modal.ios.js │ │ │ ├── Modal.js │ │ │ ├── Modal.styles.js │ │ │ └── Modal.web.js │ │ ├── Paper/ │ │ │ ├── Paper.js │ │ │ ├── Paper.stories.js │ │ │ ├── Paper.styles.js │ │ │ ├── Paper.test.js │ │ │ └── __snapshots__/ │ │ │ └── Paper.test.js.snap │ │ ├── Progress/ │ │ │ ├── ProgressBar/ │ │ │ │ ├── ProgressBar.js │ │ │ │ ├── ProgressBar.stories.js │ │ │ │ ├── ProgressBar.styles.js │ │ │ │ ├── ProgressBar.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── ProgressBar.test.js.snap │ │ │ │ └── index.js │ │ │ └── ProgressCircle/ │ │ │ ├── ProgressCircle.js │ │ │ ├── ProgressCircle.stories.js │ │ │ ├── ProgressCircle.styles.js │ │ │ ├── ProgressCircle.test.js │ │ │ ├── ProgressCircleDeterminate.js │ │ │ ├── __snapshots__/ │ │ │ │ └── ProgressCircle.test.js.snap │ │ │ └── index.js │ │ ├── RadioButton/ │ │ │ ├── RadioButton.js │ │ │ ├── RadioButton.stories.js │ │ │ ├── RadioButton.styles.js │ │ │ ├── RadioButton.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── RadioButton.test.js.snap │ │ │ └── index.js │ │ ├── Ripple/ │ │ │ ├── Ripple.js │ │ │ ├── Ripple.stories.js │ │ │ ├── Ripple.styles.js │ │ │ ├── Ripple.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Ripple.test.js.snap │ │ │ └── index.js │ │ ├── Select/ │ │ │ ├── Select.js │ │ │ ├── Select.styles.js │ │ │ ├── SelectFilled/ │ │ │ │ ├── SelectFilled.stories.js │ │ │ │ ├── SelectFilled.test.js │ │ │ │ └── __snapshots__/ │ │ │ │ └── SelectFilled.test.js.snap │ │ │ ├── SelectFlat/ │ │ │ │ ├── SelectFlat.stories.js │ │ │ │ ├── SelectFlat.test.js │ │ │ │ └── __snapshots__/ │ │ │ │ └── SelectFlat.test.js.snap │ │ │ ├── SelectOutlined/ │ │ │ │ ├── SelectOutlined.stories.js │ │ │ │ ├── SelectOutlined.test.js │ │ │ │ └── __snapshots__/ │ │ │ │ └── SelectOutlined.test.js.snap │ │ │ └── index.js │ │ ├── SheetBottom/ │ │ │ ├── SheetBottom.js │ │ │ ├── SheetBottom.native.js │ │ │ ├── SheetBottom.stories.js │ │ │ ├── SheetBottom.styles.js │ │ │ ├── SheetBottom.test.js │ │ │ ├── SheetBottom.web.js │ │ │ ├── __snapshots__/ │ │ │ │ └── SheetBottom.test.js.snap │ │ │ └── index.js │ │ ├── SheetSide/ │ │ │ ├── SheetSide.android.js │ │ │ ├── SheetSide.ios.js │ │ │ ├── SheetSide.js │ │ │ ├── SheetSide.stories.js │ │ │ ├── SheetSide.styles.js │ │ │ ├── SheetSide.test.js │ │ │ ├── SheetSide.web.js │ │ │ ├── __snapshots__/ │ │ │ │ └── SheetSide.test.js.snap │ │ │ └── index.js │ │ ├── Slider/ │ │ │ ├── Marker/ │ │ │ │ ├── Marker.js │ │ │ │ └── Marker.styles.js │ │ │ ├── MarkerContainer/ │ │ │ │ ├── MarkerContainer.js │ │ │ │ └── MarkerContainer.styles.js │ │ │ ├── Slider.js │ │ │ ├── Slider.stories.js │ │ │ ├── Slider.styles.js │ │ │ ├── Slider.test.js │ │ │ ├── Track/ │ │ │ │ ├── Track.js │ │ │ │ └── Track.styles.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Slider.test.js.snap │ │ │ ├── converts.js │ │ │ └── index.js │ │ ├── Snackbar/ │ │ │ ├── Snackbar.js │ │ │ ├── Snackbar.stories.js │ │ │ ├── Snackbar.styles.js │ │ │ ├── Snackbar.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Snackbar.test.js.snap │ │ │ └── index.js │ │ ├── SwipeNav/ │ │ │ ├── SwipeNav.js │ │ │ ├── SwipeNav.stories.js │ │ │ ├── SwipeNav.styles.js │ │ │ └── index.js │ │ ├── Switch/ │ │ │ ├── Switch.js │ │ │ ├── Switch.stories.js │ │ │ ├── Switch.styles.js │ │ │ ├── Switch.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Switch.test.js.snap │ │ │ └── index.js │ │ ├── Tabs/ │ │ │ ├── Tab/ │ │ │ │ ├── Tab.js │ │ │ │ ├── Tab.stories.js │ │ │ │ ├── Tab.styles.js │ │ │ │ ├── Tab.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── Tab.test.js.snap │ │ │ │ └── index.js │ │ │ ├── Tabs.js │ │ │ ├── Tabs.stories.js │ │ │ ├── Tabs.styles.js │ │ │ ├── Tabs.test.js │ │ │ ├── Underline/ │ │ │ │ ├── Underline.js │ │ │ │ └── Undrline.styles.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Tabs.test.js.snap │ │ │ └── index.js │ │ ├── TextField/ │ │ │ ├── Searchfield/ │ │ │ │ ├── Searchfield.js │ │ │ │ ├── Searchfield.stories.js │ │ │ │ ├── Searchfield.styles.js │ │ │ │ ├── Searchfield.test.js │ │ │ │ └── __snapshots__/ │ │ │ │ └── Searchfield.test.js.snap │ │ │ ├── TextField.js │ │ │ ├── TextField.styles.js │ │ │ ├── TextField.test.js │ │ │ ├── TextFieldFilled/ │ │ │ │ ├── TextFieldFilled.js │ │ │ │ ├── TextFieldFilled.stories.js │ │ │ │ ├── TextFieldFilled.styles.js │ │ │ │ ├── TextFieldFilled.test.js │ │ │ │ └── __snapshots__/ │ │ │ │ └── TextFieldFilled.test.js.snap │ │ │ ├── TextFieldFlat/ │ │ │ │ ├── TextFieldFlat.js │ │ │ │ ├── TextFieldFlat.stories.js │ │ │ │ ├── TextFieldFlat.styles.js │ │ │ │ ├── TextFieldFlat.test.js │ │ │ │ └── __snapshots__/ │ │ │ │ └── TextFieldFlat.test.js.snap │ │ │ ├── TextFieldHelperText/ │ │ │ │ ├── TextFieldHelperText.js │ │ │ │ ├── TextFieldHelperText.styles.js │ │ │ │ ├── TextFieldHelperText.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── TextFieldHelperText.test.js.snap │ │ │ │ └── index.js │ │ │ ├── TextFieldLabel/ │ │ │ │ ├── TextFieldLabel.constants.js │ │ │ │ ├── TextFieldLabel.constants.native.js │ │ │ │ ├── TextFieldLabel.constants.web.js │ │ │ │ ├── TextFieldLabel.js │ │ │ │ ├── TextFieldLabel.styles.js │ │ │ │ ├── TextFieldLabel.test.js │ │ │ │ └── __snapshots__/ │ │ │ │ └── TextFieldLabel.test.js.snap │ │ │ ├── TextFieldOutline/ │ │ │ │ ├── TextFieldOutline.js │ │ │ │ ├── TextFieldOutline.stories.js │ │ │ │ ├── TextFieldOutline.styles.js │ │ │ │ ├── TextFieldOutline.test.js │ │ │ │ └── __snapshots__/ │ │ │ │ └── TextFieldOutline.test.js.snap │ │ │ ├── TextFieldUnderline/ │ │ │ │ ├── TextFieldUnderline.js │ │ │ │ ├── TextFieldUnderline.styles.js │ │ │ │ ├── TextFieldUnderline.test.js │ │ │ │ └── __snapshots__/ │ │ │ │ └── TextFieldUnderline.test.js.snap │ │ │ ├── __snapshots__/ │ │ │ │ └── TextField.test.js.snap │ │ │ └── index.js │ │ ├── ToggleButton/ │ │ │ ├── ToggleButton.js │ │ │ ├── ToggleButton.stories.js │ │ │ ├── ToggleButton.styles.js │ │ │ ├── ToggleButton.test.js │ │ │ ├── ToggleButtonGroup/ │ │ │ │ ├── ToggleButtonGroup.js │ │ │ │ ├── ToggleButtonGroup.test.js │ │ │ │ ├── __snapshots__/ │ │ │ │ │ └── ToggleButtonGroup.test.js.snap │ │ │ │ └── index.js │ │ │ ├── __snapshots__/ │ │ │ │ └── ToggleButton.test.js.snap │ │ │ └── index.js │ │ ├── Tooltip/ │ │ │ ├── Tooltip.js │ │ │ ├── Tooltip.stories.js │ │ │ ├── Tooltip.styles.js │ │ │ ├── Tooltip.test.js │ │ │ ├── __snapshots__/ │ │ │ │ └── Tooltip.test.js.snap │ │ │ └── index.js │ │ └── Typography/ │ │ ├── BaseText/ │ │ │ ├── BaseTest.test.js │ │ │ ├── BaseText.js │ │ │ └── __snapshots__/ │ │ │ └── BaseTest.test.js.snap │ │ ├── BodyText/ │ │ │ ├── BodyText.js │ │ │ ├── BodyText.test.js │ │ │ └── __snapshots__/ │ │ │ └── BodyText.test.js.snap │ │ ├── Caption/ │ │ │ ├── Caption.js │ │ │ ├── Caption.test.js │ │ │ └── __snapshots__/ │ │ │ └── Caption.test.js.snap │ │ ├── Heading/ │ │ │ ├── Heading.js │ │ │ ├── Heading.test.js │ │ │ └── __snapshots__/ │ │ │ └── Heading.test.js.snap │ │ ├── Overline/ │ │ │ ├── Overline.js │ │ │ ├── Overline.test.js │ │ │ └── __snapshots__/ │ │ │ └── Overline.test.js.snap │ │ ├── Subtitle/ │ │ │ ├── Subtitle.js │ │ │ ├── Subtitle.test.js │ │ │ └── __snapshots__/ │ │ │ └── Subtitle.test.js.snap │ │ ├── Typography.stories.js │ │ └── index.js │ ├── Core/ │ │ ├── BreadProvider.js │ │ └── colors/ │ │ ├── amber.js │ │ ├── blue.js │ │ ├── blueGrey.js │ │ ├── brown.js │ │ ├── cyan.js │ │ ├── deepOrange.js │ │ ├── deepPurple.js │ │ ├── green.js │ │ ├── grey.js │ │ ├── index.js │ │ ├── indigo.js │ │ ├── lightBlue.js │ │ ├── lightGreen.js │ │ ├── lime.js │ │ ├── orange.js │ │ ├── pink.js │ │ ├── purple.js │ │ ├── red.js │ │ ├── teal.js │ │ └── yellow.js │ ├── Theme/ │ │ ├── ThemeContext.js │ │ ├── defaultTheme.js │ │ ├── mergeTheme.js │ │ └── withTheme.js │ ├── Utils/ │ │ ├── Anchor/ │ │ │ ├── Anchor.js │ │ │ └── Anchor.stories.js │ │ ├── Hoverable/ │ │ │ ├── HoverState.js │ │ │ ├── Hoverable.js │ │ │ ├── Hoverable.stories.js │ │ │ ├── Hoverable.test.js │ │ │ └── __snapshots__/ │ │ │ └── Hoverable.test.js.snap │ │ └── Shadow/ │ │ ├── Shadow.stories.js │ │ └── shadow.js │ ├── helpers/ │ │ ├── hasNotch.js │ │ └── statusBarHeight.js │ ├── index.d.ts │ ├── index.js │ ├── storybook/ │ │ ├── components/ │ │ │ ├── Container.js │ │ │ └── Header.js │ │ ├── helpers/ │ │ │ └── storiesOf/ │ │ │ ├── index.android.js │ │ │ ├── index.ios.js │ │ │ └── index.js │ │ ├── index.android.js │ │ ├── index.ios.js │ │ ├── index.js │ │ ├── rn-addons.js │ │ ├── stories/ │ │ │ ├── Home.stories.js │ │ │ └── index.js │ │ └── storybook.js │ └── vue-native.js └── webpack.config.js ================================================ FILE CONTENTS ================================================ ================================================ FILE: .buckconfig ================================================ [android] target = Google Inc.:Google APIs:23 [maven_repositories] central = https://repo1.maven.org/maven2 ================================================ FILE: .eslintrc ================================================ { "env": { "node": true, "browser": true, "es6": true, "jest": true }, "extends": [ "eslint:recommended", "plugin:react/recommended", "plugin:prettier/recommended" ], "parser": "babel-eslint", "rules": { "no-useless-constructor": 0, "import/no-extraneous-dependencies": 0, "import/named": 1, "import/no-unresolved": 1, "react/display-name": 0, "react/no-typos": 0 }, "plugins": ["prettier", "react", "import"], "settings": { "import/resolver": { "node": { "extensions": [".js", ".ios.js", ".android.js", ".web.js", ".native.js"] } } } } ================================================ FILE: .flowconfig ================================================ [ignore] ; We fork some components by platform .*/*[.]android.js ; Ignore "BUCK" generated dirs /\.buckd/ ; Ignore unexpected extra "@providesModule" .*/node_modules/.*/node_modules/fbjs/.* ; Ignore duplicate module providers ; For RN Apps installed via npm, "Libraries" folder is inside ; "node_modules/react-native" but in the source repo it is in the root .*/Libraries/react-native/React.js ; Ignore polyfills .*/Libraries/polyfills/.* ; Ignore metro .*/node_modules/metro/.* [include] [libs] node_modules/react-native/Libraries/react-native/react-native-interface.js node_modules/react-native/flow/ node_modules/react-native/flow-github/ [options] emoji=true esproposal.optional_chaining=enable esproposal.nullish_coalescing=enable module.system=haste module.system.haste.use_name_reducers=true # get basename module.system.haste.name_reducers='^.*/\([a-zA-Z0-9$_.-]+\.js\(\.flow\)?\)$' -> '\1' # strip .js or .js.flow suffix module.system.haste.name_reducers='^\(.*\)\.js\(\.flow\)?$' -> '\1' # strip .ios suffix module.system.haste.name_reducers='^\(.*\)\.ios$' -> '\1' module.system.haste.name_reducers='^\(.*\)\.android$' -> '\1' module.system.haste.name_reducers='^\(.*\)\.native$' -> '\1' module.system.haste.paths.blacklist=.*/__tests__/.* module.system.haste.paths.blacklist=.*/__mocks__/.* module.system.haste.paths.blacklist=/node_modules/react-native/Libraries/Animated/src/polyfills/.* module.system.haste.paths.whitelist=/node_modules/react-native/Libraries/.* munge_underscores=true module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub' module.file_ext=.js module.file_ext=.jsx module.file_ext=.json module.file_ext=.native.js suppress_type=$FlowIssue suppress_type=$FlowFixMe suppress_type=$FlowFixMeProps suppress_type=$FlowFixMeState suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\) suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+ suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError [version] ^0.86.0 ================================================ FILE: .gitattributes ================================================ *.pbxproj -text ================================================ FILE: .github/ISSUE_TEMPLATE/bug_report.md ================================================ --- name: Bug report about: Create a report to help us improve title: '' labels: '' assignees: '' --- **Describe the bug** A clear and concise description of what the bug is. **To Reproduce** Steps to reproduce the behavior: 1. Go to '...' 2. Click on '....' 3. Scroll down to '....' 4. See error **Expected behavior** A clear and concise description of what you expected to happen. **Screenshots** If applicable, add screenshots to help explain your problem. **Desktop (please complete the following information):** - OS: [e.g. iOS] - Browser [e.g. chrome, safari] - Version [e.g. 22] **Smartphone (please complete the following information):** - Device: [e.g. iPhone6] - OS: [e.g. iOS8.1] - Browser [e.g. stock browser, safari] - Version [e.g. 22] **Additional context** Add any other context about the problem here. ================================================ FILE: .github/ISSUE_TEMPLATE/feature_request.md ================================================ --- name: Feature request about: Suggest an idea for this project title: "[New]" labels: enhancement assignees: '' --- **Describe your feature request** **Context** Describe the context around your feature request with screenshots and links. If this is from the docs provide a screenshot and link to the appropriate area. **Proposed solution** Describe how you would implement this feature or expect this feature to work from a dev perspective. ================================================ FILE: .github/config.yml ================================================ # Configuration for request-info - https://github.com/behaviorbot/request-info # *OPTIONAL* Comment to reply with # Can be either a string : requestInfoReplyComment: > We would appreciate it if you could provide us with more info about this issue/pr! # Or an array: # requestInfoReplyComment: # - Ah no! young blade! That was a trifle short! # - Tell me more ! # - I am sure you can be more effusive # *OPTIONAL* default titles to check against for lack of descriptiveness # MUST BE ALL LOWERCASE requestInfoDefaultTitles: - update readme.md - updates # *OPTIONAL* Label to be added to Issues and Pull Requests with insufficient information given requestInfoLabelToAdd: needs-more-info # *OPTIONAL* Require Issues to contain more information than what is provided in the issue templates # Will fail if the issue's body is equal to a provided template checkIssueTemplate: true # *OPTIONAL* Require Pull Requests to contain more information than what is provided in the PR template # Will fail if the pull request's body is equal to the provided template checkPullRequestTemplate: false # *OPTIONAL* Only warn about insufficient information on these events type # Keys must be lowercase. Valid values are 'issue' and 'pullRequest' requestInfoOn: pullRequest: true issue: true # *OPTIONAL* Add a list of people whose Issues/PRs will not be commented on # keys must be GitHub usernames requestInfoUserstoExclude: - codypearce ================================================ FILE: .gitignore ================================================ # OSX # .DS_Store src/DS_Store *.DS_Store # Xcode # build/ *.pbxuser !default.pbxuser *.mode1v3 !default.mode1v3 *.mode2v3 !default.mode2v3 *.perspectivev3 !default.perspectivev3 xcuserdata *.xccheckout *.moved-aside DerivedData *.hmap *.ipa *.xcuserstate project.xcworkspace # Android/IntelliJ # build/ .idea .gradle local.properties *.iml # node.js # node_modules/ npm-debug.log yarn-error.log # BUCK buck-out/ \.buckd/ *.keystore # fastlane # # It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the # screenshots whenever they are needed. # For more information about the recommended setup visit: # https://docs.fastlane.tools/best-practices/source-control/ */fastlane/report.xml */fastlane/Preview.html */fastlane/screenshots # Bundle artifact *.jsbundle node_modules/**/* npm-debug.* *.jks *.p12 *.key *.mobileprovision ios/Index docs/public docs/node_modules docs/.cache gh/**/* ================================================ FILE: .jest-test-results.json ================================================ {"numFailedTestSuites":0,"numFailedTests":0,"numPassedTestSuites":72,"numPassedTests":73,"numPendingTestSuites":0,"numPendingTests":0,"numRuntimeErrorTestSuites":0,"numTotalTestSuites":72,"numTotalTests":73,"openHandles":[],"snapshot":{"added":0,"didUpdate":false,"failure":false,"filesAdded":0,"filesRemoved":0,"filesUnmatched":0,"filesUpdated":0,"matched":73,"total":73,"unchecked":0,"uncheckedKeysByFile":[],"unmatched":0,"updated":0},"startTime":1586270099034,"success":true,"testResults":[{"assertionResults":[{"ancestorTitles":["BaseText"],"failureMessages":[],"fullName":"BaseText renders","location":null,"status":"passed","title":"renders"},{"ancestorTitles":["BaseText"],"failureMessages":[],"fullName":"BaseText renders with different theme color","location":null,"status":"passed","title":"renders with different theme color"}],"endTime":1586270102447,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Typography/BaseText/BaseTest.test.js","startTime":1586270100849,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"BottomNavigationItem Renders","location":null,"status":"passed","title":"BottomNavigationItem Renders"}],"endTime":1586270104028,"message":"","name":"/Users/cody/projects/material-bread/src/Components/BottomNavigation/BottomNavigationItem/BottomNavigationItem.test.js","startTime":1586270100862,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"ToggleButtonGroup Renders","location":null,"status":"passed","title":"ToggleButtonGroup Renders"}],"endTime":1586270112032,"message":"","name":"/Users/cody/projects/material-bread/src/Components/ToggleButton/ToggleButtonGroup/ToggleButtonGroup.test.js","startTime":1586270102456,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"BottomNavigation Renders","location":null,"status":"passed","title":"BottomNavigation Renders"}],"endTime":1586270112035,"message":"","name":"/Users/cody/projects/material-bread/src/Components/BottomNavigation/BottomNavigation.test.js","startTime":1586270104078,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"DataTablePagination Renders","location":null,"status":"passed","title":"DataTablePagination Renders"}],"endTime":1586270112037,"message":"","name":"/Users/cody/projects/material-bread/src/Components/DataTable/DataTablePagination/DataTablePagination.test.js","startTime":1586270100855,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Switch Renders","location":null,"status":"passed","title":"Switch Renders"}],"endTime":1586270112057,"message":"","name":"/Users/cody/projects/material-bread/src/Utils/Hoverable/Hoverable.test.js","startTime":1586270100849,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"FabSpeedDial Renders","location":null,"status":"passed","title":"FabSpeedDial Renders"}],"endTime":1586270112111,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Fab/FabSpeedDial/FabSpeedDial.test.js","startTime":1586270100850,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"ListExpanded Renders","location":null,"status":"passed","title":"ListExpanded Renders"}],"endTime":1586270112188,"message":"","name":"/Users/cody/projects/material-bread/src/Components/List/ListSection/ListSection.test.js","startTime":1586270112046,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"SelectFilled Renders","location":null,"status":"passed","title":"SelectFilled Renders"}],"endTime":1586270112206,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Select/SelectFilled/SelectFilled.test.js","startTime":1586270112047,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"SelectOutlined Renders","location":null,"status":"passed","title":"SelectOutlined Renders"}],"endTime":1586270112210,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Select/SelectOutlined/SelectOutlined.test.js","startTime":1586270112040,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"SelectFlat Renders","location":null,"status":"passed","title":"SelectFlat Renders"}],"endTime":1586270112235,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Select/SelectFlat/SelectFlat.test.js","startTime":1586270112070,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"ToggleButton Renders","location":null,"status":"passed","title":"ToggleButton Renders"}],"endTime":1586270112308,"message":"","name":"/Users/cody/projects/material-bread/src/Components/ToggleButton/ToggleButton.test.js","startTime":1586270112120,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"SearchField Renders","location":null,"status":"passed","title":"SearchField Renders"}],"endTime":1586270112367,"message":"","name":"/Users/cody/projects/material-bread/src/Components/TextField/Searchfield/Searchfield.test.js","startTime":1586270112193,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"ListExpanded Renders","location":null,"status":"passed","title":"ListExpanded Renders"}],"endTime":1586270112398,"message":"","name":"/Users/cody/projects/material-bread/src/Components/List/ListExpand/ListExpand.test.js","startTime":1586270112213,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"ProgressBar Renders","location":null,"status":"passed","title":"ProgressBar Renders"}],"endTime":1586270112401,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Progress/ProgressBar/ProgressBar.test.js","startTime":1586270112215,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"ListExpanded Renders","location":null,"status":"passed","title":"ListExpanded Renders"}],"endTime":1586270112460,"message":"","name":"/Users/cody/projects/material-bread/src/Components/List/ListItem/ListItem.test.js","startTime":1586270112318,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"IconButton Renders","location":null,"status":"passed","title":"IconButton Renders"}],"endTime":1586270112507,"message":"","name":"/Users/cody/projects/material-bread/src/Components/IconButton/IconButton.test.js","startTime":1586270112373,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Searchbar Renders","location":null,"status":"passed","title":"Searchbar Renders"}],"endTime":1586270112527,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Appbar/Searchbar/Searchbar.test.js","startTime":1586270112403,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Snackbar Renders","location":null,"status":"passed","title":"Snackbar Renders"}],"endTime":1586270112659,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Snackbar/Snackbar.test.js","startTime":1586270112534,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"TextField Renders","location":null,"status":"passed","title":"TextField Renders"}],"endTime":1586270112662,"message":"","name":"/Users/cody/projects/material-bread/src/Components/TextField/TextField.test.js","startTime":1586270112467,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Backdrop Renders","location":null,"status":"passed","title":"Backdrop Renders"}],"endTime":1586270112687,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Backdrop/Backdrop.test.js","startTime":1586270112517,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Dialog Renders","location":null,"status":"passed","title":"Dialog Renders"}],"endTime":1586270112825,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Dialog/Dialog.test.js","startTime":1586270112667,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Tooltip Renders","location":null,"status":"passed","title":"Tooltip Renders"}],"endTime":1586270112842,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Tooltip/Tooltip.test.js","startTime":1586270112696,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Checkbox Renders","location":null,"status":"passed","title":"Checkbox Renders"}],"endTime":1586270112845,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Checkbox/Checkbox.test.js","startTime":1586270112667,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Slider Renders","location":null,"status":"passed","title":"Slider Renders"}],"endTime":1586270113064,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Slider/Slider.test.js","startTime":1586270112837,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Menu Renders","location":null,"status":"passed","title":"Menu Renders"}],"endTime":1586270113100,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Menu/Menu.test.js","startTime":1586270112868,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"TextFieldUnderline Renders","location":null,"status":"passed","title":"TextFieldUnderline Renders"}],"endTime":1586270113152,"message":"","name":"/Users/cody/projects/material-bread/src/Components/TextField/TextFieldUnderline/TextFieldUnderline.test.js","startTime":1586270112852,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Switch Renders","location":null,"status":"passed","title":"Switch Renders"}],"endTime":1586270113200,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Switch/Switch.test.js","startTime":1586270113074,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Button Renders","location":null,"status":"passed","title":"Button Renders"}],"endTime":1586270113227,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Button/Button.test.js","startTime":1586270113105,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Banner Renders","location":null,"status":"passed","title":"Banner Renders"}],"endTime":1586270113275,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Banner/Banner.test.js","startTime":1586270113161,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Icon Renders","location":null,"status":"passed","title":"Icon Renders"}],"endTime":1586270113360,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Icon/Icon.test.js","startTime":1586270113233,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"TextFieldHelperText Renders","location":null,"status":"passed","title":"TextFieldHelperText Renders"}],"endTime":1586270113360,"message":"","name":"/Users/cody/projects/material-bread/src/Components/TextField/TextFieldHelperText/TextFieldHelperText.test.js","startTime":1586270113204,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Tabs Renders","location":null,"status":"passed","title":"Tabs Renders"}],"endTime":1586270113413,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Tabs/Tabs.test.js","startTime":1586270113281,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Tab Renders","location":null,"status":"passed","title":"Tab Renders"}],"endTime":1586270113503,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Tabs/Tab/Tab.test.js","startTime":1586270113366,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Fab Renders","location":null,"status":"passed","title":"Fab Renders"}],"endTime":1586270113566,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Fab/Fab.test.js","startTime":1586270113420,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"TextFieldLabel Renders","location":null,"status":"passed","title":"TextFieldLabel Renders"}],"endTime":1586270113675,"message":"","name":"/Users/cody/projects/material-bread/src/Components/TextField/TextFieldLabel/TextFieldLabel.test.js","startTime":1586270113572,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"DataTableHeader Renders","location":null,"status":"passed","title":"DataTableHeader Renders"}],"endTime":1586270113835,"message":"","name":"/Users/cody/projects/material-bread/src/Components/DataTable/DataTableHeader/DataTableHeader.test.js","startTime":1586270113684,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"SheetSide Renders","location":null,"status":"passed","title":"SheetSide Renders"}],"endTime":1586270114682,"message":"","name":"/Users/cody/projects/material-bread/src/Components/SheetSide/SheetSide.test.js","startTime":1586270112406,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"SheetBottom Renders","location":null,"status":"passed","title":"SheetBottom Renders"}],"endTime":1586270114714,"message":"","name":"/Users/cody/projects/material-bread/src/Components/SheetBottom/SheetBottom.test.js","startTime":1586270112241,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"DrawerSection Renders","location":null,"status":"passed","title":"DrawerSection Renders"}],"endTime":1586270114972,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Drawer/DrawerSection/DrawerSection.test.js","startTime":1586270114740,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"ProgressCircle Renders","location":null,"status":"passed","title":"ProgressCircle Renders"}],"endTime":1586270115153,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Progress/ProgressCircle/ProgressCircle.test.js","startTime":1586270114692,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"DataTableCell Renders","location":null,"status":"passed","title":"DataTableCell Renders"}],"endTime":1586270115170,"message":"","name":"/Users/cody/projects/material-bread/src/Components/DataTable/DataTableCell/DataTableCell.test.js","startTime":1586270114981,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"DataTableRow Renders","location":null,"status":"passed","title":"DataTableRow Renders"}],"endTime":1586270115297,"message":"","name":"/Users/cody/projects/material-bread/src/Components/DataTable/DataTableRow/DataTableRow.test.js","startTime":1586270115177,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"AppbarBottom Renders","location":null,"status":"passed","title":"AppbarBottom Renders"}],"endTime":1586270115298,"message":"","name":"/Users/cody/projects/material-bread/src/Components/AppbarBottom/AppbarBottom.test.js","startTime":1586270115161,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"DrawerHeader Renders","location":null,"status":"passed","title":"DrawerHeader Renders"}],"endTime":1586270115433,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Drawer/DrawerHeader/DrawerHeader.test.js","startTime":1586270115305,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"DrawerBottom Renders","location":null,"status":"passed","title":"DrawerBottom Renders"}],"endTime":1586270115455,"message":"","name":"/Users/cody/projects/material-bread/src/Components/DrawerBottom/DrawerBottom.test.js","startTime":1586270115303,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"CardContent Renders","location":null,"status":"passed","title":"CardContent Renders"}],"endTime":1586270115554,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Card/CardContent/CardContent.test.js","startTime":1586270115461,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"CardActions Renders","location":null,"status":"passed","title":"CardActions Renders"}],"endTime":1586270115592,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Card/CardActions/CardActions.test.js","startTime":1586270115444,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"TextFieldOutline Renders","location":null,"status":"passed","title":"TextFieldOutline Renders"}],"endTime":1586270115604,"message":"","name":"/Users/cody/projects/material-bread/src/Components/TextField/TextFieldOutline/TextFieldOutline.test.js","startTime":1586270113368,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"TextFieldFilled Renders","location":null,"status":"passed","title":"TextFieldFilled Renders"}],"endTime":1586270115672,"message":"","name":"/Users/cody/projects/material-bread/src/Components/TextField/TextFieldFilled/TextFieldFilled.test.js","startTime":1586270113507,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"RadioButton Renders","location":null,"status":"passed","title":"RadioButton Renders"}],"endTime":1586270115700,"message":"","name":"/Users/cody/projects/material-bread/src/Components/RadioButton/RadioButton.test.js","startTime":1586270115562,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"CardHeader Renders","location":null,"status":"passed","title":"CardHeader Renders"}],"endTime":1586270115738,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Card/CardHeader/CardHeader.test.js","startTime":1586270115683,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"CardMedia Renders","location":null,"status":"passed","title":"CardMedia Renders"}],"endTime":1586270115769,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Card/CardMedia/CardMedia.test.js","startTime":1586270115706,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"DrawerItem Renders","location":null,"status":"passed","title":"DrawerItem Renders"}],"endTime":1586270115834,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Drawer/DrawerItem/DrawerItem.test.js","startTime":1586270115613,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"MenuItem Renders","location":null,"status":"passed","title":"MenuItem Renders"}],"endTime":1586270115925,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Menu/MenuItem/MenuItem.test.js","startTime":1586270115743,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"TextFieldFlat Renders","location":null,"status":"passed","title":"TextFieldFlat Renders"}],"endTime":1586270115939,"message":"","name":"/Users/cody/projects/material-bread/src/Components/TextField/TextFieldFlat/TextFieldFlat.test.js","startTime":1586270113846,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"DataTable Renders","location":null,"status":"passed","title":"DataTable Renders"}],"endTime":1586270115978,"message":"","name":"/Users/cody/projects/material-bread/src/Components/DataTable/DataTable.test.js","startTime":1586270115599,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Subtitle Renders","location":null,"status":"passed","title":"Subtitle Renders"}],"endTime":1586270115990,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Typography/Subtitle/Subtitle.test.js","startTime":1586270115843,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Overline Renders","location":null,"status":"passed","title":"Overline Renders"}],"endTime":1586270115991,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Typography/Overline/Overline.test.js","startTime":1586270115780,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"BodyText Renders","location":null,"status":"passed","title":"BodyText Renders"}],"endTime":1586270116055,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Typography/BodyText/BodyText.test.js","startTime":1586270115931,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Heading Renders","location":null,"status":"passed","title":"Heading Renders"}],"endTime":1586270116084,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Typography/Heading/Heading.test.js","startTime":1586270115944,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Divider Renders","location":null,"status":"passed","title":"Divider Renders"}],"endTime":1586270116117,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Divider/Divider.test.js","startTime":1586270115996,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"List Renders","location":null,"status":"passed","title":"List Renders"}],"endTime":1586270116133,"message":"","name":"/Users/cody/projects/material-bread/src/Components/List/List.test.js","startTime":1586270115997,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Caption Renders","location":null,"status":"passed","title":"Caption Renders"}],"endTime":1586270116184,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Typography/Caption/Caption.test.js","startTime":1586270115993,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Avatar Renders","location":null,"status":"passed","title":"Avatar Renders"}],"endTime":1586270116206,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Avatar/Avatar.test.js","startTime":1586270116122,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Ripple Renders","location":null,"status":"passed","title":"Ripple Renders"}],"endTime":1586270116256,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Ripple/Ripple.test.js","startTime":1586270116071,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Appbar Renders","location":null,"status":"passed","title":"Appbar Renders"}],"endTime":1586270116271,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Appbar/Appbar.test.js","startTime":1586270116148,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Drawer Renders","location":null,"status":"passed","title":"Drawer Renders"}],"endTime":1586270116275,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Drawer/Drawer.test.js","startTime":1586270116089,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Paper Renders","location":null,"status":"passed","title":"Paper Renders"}],"endTime":1586270116314,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Paper/Paper.test.js","startTime":1586270116190,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Card Renders","location":null,"status":"passed","title":"Card Renders"}],"endTime":1586270116369,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Card/Card.test.js","startTime":1586270116262,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Badge Renders","location":null,"status":"passed","title":"Badge Renders"}],"endTime":1586270116404,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Badge/Badge.test.js","startTime":1586270116217,"status":"passed","summary":""},{"assertionResults":[{"ancestorTitles":[],"failureMessages":[],"fullName":"Chip Renders","location":null,"status":"passed","title":"Chip Renders"}],"endTime":1586270116411,"message":"","name":"/Users/cody/projects/material-bread/src/Components/Chip/Chip.test.js","startTime":1586270116280,"status":"passed","summary":""}],"wasInterrupted":false} ================================================ FILE: .npmignore ================================================ # OSX # .DS_Store src/DS_Store *.DS_Store # Xcode # build/ *.pbxuser !default.pbxuser *.mode1v3 !default.mode1v3 *.mode2v3 !default.mode2v3 *.perspectivev3 !default.perspectivev3 xcuserdata *.xccheckout *.moved-aside DerivedData *.hmap *.ipa *.xcuserstate project.xcworkspace # Android/IntelliJ # build/ .idea .gradle local.properties *.iml # node.js # node_modules/ npm-debug.log yarn-error.log # BUCK buck-out/ \.buckd/ *.keystore # fastlane # # It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the # screenshots whenever they are needed. # For more information about the recommended setup visit: # https://docs.fastlane.tools/best-practices/source-control/ */fastlane/report.xml */fastlane/Preview.html */fastlane/screenshots # Bundle artifact *.jsbundle node_modules/**/* npm-debug.* *.jks *.p12 *.key *.mobileprovision ios/Index docs/public docs/node_modules docs/.cache gh/**/* jest-test-results.json .jest-test-results.json docs/**/* __tests__ .git .storybook android docker docs ios public storybook .buckconfig .eslintrc .flowconfig .gitattributes .gitignore .prettierrc .travis.yml .watchmanconfig App.js app.json babel.config.js package-lock.json rn-cli.config.js webpack.config.js yarn.lock src/**/*.stories.js src/**/*.test.js src/storybook/**/* **/*/__snapshots__ dist/**/*.test.js dist/**/*.stories.js dist/storybook/**/* media .github ================================================ FILE: .prettierrc ================================================ { "singleQuote": true, "trailingComma": "all", "bracketSpacing": true, "jsxBracketSameLine": true } ================================================ FILE: .storybook/addons.js ================================================ import '@storybook/addon-links/register'; import '@storybook/addon-storysource/register'; // import '@storybook/addon-actions/register'; import '@storybook/addon-jest/register'; import '@storybook/addon-backgrounds/register'; import '@storybook/addon-google-analytics/register'; import '@storybook/addon-a11y/register'; // import '@storybook/addon-viewport/register'; ================================================ FILE: .storybook/babel.config.js ================================================ module.exports = function(api) { api.cache(true); return { presets: ['module:metro-react-native-babel-preset'], plugins: ['react-native-web', '@babel/plugin-proposal-object-rest-spread'], }; }; ================================================ FILE: .storybook/config.js ================================================ import { addDecorator, configure, setAddon, addParameters, } from '@storybook/react'; import { withTests } from '@storybook/addon-jest'; import { withA11y } from '@storybook/addon-a11y'; import results from '../.jest-test-results.json'; import '@storybook/addon-console'; // Generate required css const materialIconFont = require('react-native-vector-icons/Fonts/MaterialIcons.ttf'); const materialCommIconFont = require('react-native-vector-icons/Fonts/MaterialCommunityIcons.ttf'); const iconFontStyles = `@font-face { src: url(${materialIconFont}); font-family: MaterialIcons; } @font-face { src: url(${materialCommIconFont}); font-family: MaterialCommunityIcons; }`; addParameters({ options: { showPanel: true, panelPosition: 'bottom', isToolshown: true, name: 'Material Bread', }, backgrounds: [ { name: 'white', value: '#fff', default: true }, { name: 'light', value: '#eeeeee' }, ], viewport: {}, }); addDecorator( withTests({ results, }), withA11y, ); function loadStories() { require('../src/storybook/stories'); } configure(loadStories, module); // Create stylesheet const style = document.createElement('style'); style.type = 'text/css'; if (style.styleSheet) { style.styleSheet.cssText = iconFontStyles; } else { style.appendChild(document.createTextNode(iconFontStyles)); } // Inject stylesheet document.head.appendChild(style); window.STORYBOOK_GA_ID = 'UA-72995758-3'; ================================================ FILE: .storybook/webpack.config.js ================================================ const path = require('path'); const webpack = require('webpack'); module.exports = ({ config, mode }) => { config.module.rules.push( { test: /\.(gif|jpe?g|png|svg)$/, use: { loader: 'url-loader', }, }, { test: /\.(js|jsx|mjs)$/, use: { loader: 'babel-loader', }, }, { test: /\.stories\.js?$/, loaders: [require.resolve('@storybook/addon-storysource/loader')], enforce: 'pre', }, ); config.resolve.extensions = ['.web.js', '.js', '.json', '.web.jsx', '.jsx']; config.resolve.alias = { 'react-native': 'react-native-web', }; return config; }; ================================================ FILE: .travis.yml ================================================ sudo: false language: node_js node_js: - "8" cache: directories: - node_modules install: - yarn install script: - yarn run lint - yarn run test ================================================ FILE: .watchmanconfig ================================================ {} ================================================ FILE: App.js ================================================ export default from './src/storybook'; ================================================ FILE: LICENSE ================================================ MIT License Copyright (c) 2019 Cody Pearce 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. ================================================ FILE: README.md ================================================

Material Bread logo

Material Bread

Cross Platform React Native Material Design Components

[![Build Status](https://img.shields.io/travis/codypearce/material-bread/master.svg?style=for-the-badge)](https://travis-ci.org/codypearce/material-bread) [![NPM registry](https://img.shields.io/npm/v/material-bread.svg?style=for-the-badge)](https://www.npmjs.com/package/material-bread) ![Code style](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=for-the-badge) ![NPM license](https://img.shields.io/badge/license-mit-red.svg?style=for-the-badge) [![Storybook](https://cdn.jsdelivr.net/gh/storybooks/brand@master/badge/badge-storybook.svg?style=for-the-badge)](https://codypearce.github.io/material-bread/)

adf

Choose a platform to get started

adf adf adf adf adf adf adf adf

### Features - Highly Customizable React Native Components. - Cross platform support: React Native (iOS, Android), React-native-web (Browsers), Electron (Windows, Mac, Linux), react-native-windows, react-native-macos, Next.js, Expo, Vue Native - Support for Material Design 2.0 components. - Live react native demos you can edit in in your browser. - Typescript support ## Table of Contents - [Quick Start](#quick-start) - [Documentation](#documentation) - [Getting Started](#getting-started) - [Guides](#guides) - [Example Repos](#example-repos) - [Usage](#usage) - [Supported Components](#supported-components) - [Contributing](#contributing) - [Library](#contribute-to-library) - [Docs](#contribute-to-docs) - [Easy Contribution](#easy-first-contribution) - [Tests](#tests) - [Accessibility](#accessibility) - [Copyright and License](#copyright-and-license) ## Quick Start 1. `npm install material-bread` or `yarn add material-bread` 2. Install and link [react-native-vector-icons](https://github.com/oblador/react-native-vector-icons) and [react-native-svg](https://github.com/react-native-community/react-native-svg) 3. Wrap your root `` with a `` ```jsx ``` 4. Start developing! Read the [getting started](#getting-started) guides for your platform to learn more. ## Documentation The component API docs and curated demos can be found at [material-bread.org](https://material-bread.org). See the [contributing](#contributing) section to learn how to run the docs locally. More demos for each component can be found at the component [Storybook](https://codypearce.github.io/material-bread/). This environment is used for developing cross-platform, see the [contributing](#contributing) section to learn how to set it up locally. ## Getting Started ### Guides [Getting Started with React Native](http://material-bread.org/getting-started/react-native) [Getting Started with Web](http://material-bread.org/getting-started/web) [Getting Started with Electron](http://material-bread.org/getting-started/electron) [Getting Started with MacOS](http://material-bread.org/getting-started/macos) [Getting Started with Windows](http://material-bread.org/getting-started/windows) [Getting Started with NextJS](http://material-bread.org/getting-started/nextjs) [Getting Started with Expo](http://material-bread.org/getting-started/expo) [Getting Started with Vue Native](http://material-bread.org/getting-started/vue-native) ### Example Repos Boilerplate projects with minimal configuration to get started on each platform. React Native: [material-bread-rn-example](https://github.com/codypearce/material-bread-rn-example) React Web: [material-bread-react-example](https://github.com/codypearce/material-bread-react-example) Electron: [material-bread-electron-example](https://github.com/codypearce/material-bread-electron-example) MacOS: [material-bread-macos-example](https://github.com/codypearce/material-bread-macos-example) Windows: [material-bread-windows-example](https://github.com/codypearce/material-bread-windows-example) NextJS: [material-bread-next-example](https://github.com/fortezhuo/material-bread-next-example) Expo: [material-bread-expo-example](https://github.com/codypearce/material-bread-expo-example) Vue Native: [material-bread-vue-native-example](https://github.com/codypearce/material-bread-vue-native-example) ### Usage ```jsx import React from 'react'; import { Button } from 'material-bread'; function App() { return ; } ``` ## Sponsored By Fullstack Labs ## Supported Components A major goal of this library is to match all the components found in the material docs or provide enough demos/instructions that a developer can create a non-supported component from supported components. Keep in mind this still a work in progress so not all functionality from the Material Docs is supported yet. Currently there are 39 distinct components (though what is a full component and what is a subcomponent is somewhat arbitrary), each with many variations, and 4 utility components. | Name | iOS | Android | Web | Electron | | ---------------------------------------------------------------------------- | --- | ------- | --- | -------- | | [Appbar](https://material-bread.org/components/appbar) | ✓ | ✓ | ✓ | ✓ | | [AppbarBottom](https://material-bread.org/components/appbar-bottom) | ✓ | ✓ | ✓ | ✓ | | [Avatar](https://material-bread.org/components/avatar) | ✓ | ✓ | ✓ | ✓ | | [Backdrop](https://material-bread.org/components/backdrop) | ✓ | ✓ | ✓ | ✓ | | [Badge](https://material-bread.org/components/badge) | ✓ | ✓ | ✓ | ✓ | | [Banner](https://material-bread.org/components/banner) | ✓ | ✓ | ✓ | ✓ | | [Bottom Navigation](https://material-bread.org/components/bottom-navigation) | ✓ | ✓ | ✓ | ✓ | | [Button](https://material-bread.org/components/button) | ✓ | ✓ | ✓ | ✓ | | [Card](https://material-bread.org/components/card) | ✓ | ✓ | ✓ | ✓ | | [Checkbox](https://material-bread.org/components/checkbox) | ✓ | ✓ | ✓ | ✓ | | [Chip](https://material-bread.org/components/chip) | ✓ | ✓ | ✓ | ✓ | | [DataTable](https://material-bread.org/components/datatable) | ✓ | ✓ | ✓ | ✓ | | [Dialog](https://material-bread.org/components/dialog) | ✓ | ✓ | ✓ | ✓ | | [Divider](https://material-bread.org/components/divider) | ✓ | ✓ | ✓ | ✓ | | [Drawer](https://material-bread.org/components/drawer) | ✓ | ✓ | ✓ | ✓ | | [DrawerBottom](https://material-bread.org/components/drawer-bottom) | ✓ | ✓ | ✓ | ✓ | | [Fab](https://material-bread.org/components/fab) | ✓ | ✓ | ✓ | ✓ | | [FabSpeeddial](https://material-bread.org/components/fab-speeddial) | ✓ | ✓ | ✓ | ✓ | | [Icon](https://material-bread.org/components/icon) | ✓ | ✓ | ✓ | ✓ | | [IconButton](https://material-bread.org/components/iconbutton) | ✓ | ✓ | ✓ | ✓ | | [List](https://material-bread.org/components/list) | ✓ | ✓ | ✓ | ✓ | | [ListExpand](https://material-bread.org/components/list-expand) | ✓ | ✓ | ✓ | ✓ | | [Menu](https://material-bread.org/components/menu) | ✓ | ✓ | ✓ | ✓ | | [Paper](https://material-bread.org/components/paper) | ✓ | ✓ | ✓ | ✓ | | [ProgressBar](https://material-bread.org/components/progress-bar) | ✓ | ✓ | ✓ | ✓ | | [ProgressCircle](https://material-bread.org/components/progress-circle) | ✓ | ✓ | ✓ | ✓ | | [RadioButton](https://material-bread.org/components/radiobutton) | ✓ | ✓ | ✓ | ✓ | | [Ripple](https://material-bread.org/components/ripple) | ✓ | ✓ | ✓ | ✓ | | [Select](https://material-bread.org/components/select) | ✓ | ✓ | ✓ | ✓ | | [SheetBottom](https://material-bread.org/components/sheet-bottom) | ✓ | ✓ | ✓ | ✓ | | [SheetSide](https://material-bread.org/components/sheet-side) | ✓ | ✓ | ✓ | ✓ | | [Slider](https://material-bread.org/components/slider) | ✓ | ✓ | ✓ | ✓ | | [Snackbar](https://material-bread.org/components/snackbar) | ✓ | ✓ | ✓ | ✓ | | [SwipeNav](https://material-bread.org/components/swipenav) | ✓ | ✓ | ✓ | ✓ | | [Switch](https://material-bread.org/components/switch) | ✓ | ✓ | ✓ | ✓ | | [Tabs](https://material-bread.org/components/tabs) | ✓ | ✓ | ✓ | ✓ | | [TextField](https://material-bread.org/components/textfield) | ✓ | ✓ | ✓ | ✓ | | [ToggleButton](https://material-bread.org/components/togglebutton) | ✓ | ✓ | ✓ | ✓ | | [Tooltip](https://material-bread.org/components/tooltip) | ✓ | ✓ | ✓ | ✓ | | [Typography](https://material-bread.org/components/typography) | ✓ | ✓ | ✓ | ✓ | Utility components | Name | iOS | Android | Web | Electron | | ------------------------------------------------------- | --- | ------- | --- | -------- | | [Anchor](https://material-bread.org/utils/anchor) | ✓ | ✓ | ✓ | ✓ | | [Color](https://material-bread.org/utils/color) | ✓ | ✓ | ✓ | ✓ | | [Hoverable](https://material-bread.org/utils/hoverable) | ✓ | ✓ | ✓ | ✓ | | [Shadow](https://material-bread.org/utils/shadow) | ✓ | ✓ | ✓ | ✓ | ## Contributing All contributions are welcome and encouraged. If you are reporting a bug, please follow the bug issue template. If you are proposing an enhancement, please first search the backlogs before creating a new issue. #### Contribute to library [Storybook](https://github.com/storybooks/storybook) is used as the dev environment for all components on all platforms. You can learn about how to get the storybook environment running locally for all platforms [here](http://material-bread.org/contributing/library). Please follow the conventions already in place. For example, most components follow the made up "props for prebuilt, children for custom" pattern. Additionally, make sure you are testing your components across platforms before making a PR. #### Contribute to docs Documentation is built using [GatsbyJs](https://github.com/gatsbyjs/gatsby) and all pages are built using react components. You can learn how to get the docs running locally [here](https://material-bread.org/contributing/docs). #### Easy first contribution You can start contribute extremely easily by improving demos or adding more interesting demos to the docs or storybook. Interesting, useful, and plentiful demos is a major goal of the project, so any help in that regard would be greatly appreciated. ## Tests [Jest](https://jestjs.io/) is the current test framework for all components. You can see the result of each component test in our [storybook environement](https://codypearce.github.io/material-bread/?path=/story/components-appbar--simple) under the "Tests" tab. Writing more comprehensive tests is on the roadmap, but please consider contributing to speed this process up. You can run tests locally using `npm test`. You can generate test coverage by running `npm run test:generate-output`, this will output a json file with coverage. ## Accessibility `react-native-web` describes how to write accessible react-native components on the web [here](https://github.com/necolas/react-native-web/blob/master/docs/guides/accessibility.md). Additionally, the storybook addon, [addon-a11y](https://www.npmjs.com/package/@storybook/addon-a11y), runs some simple accessibility tests on each component story. You can see the output of each accessibility test on the [Accessibility](https://codypearce.github.io/material-bread/?path=/story/components-buttons--custom) tab for each component. Please consider contributing to make accessibility even better. ## Copyright and License Copyright 2019 Material Bread. Code released under the MIT license. ================================================ FILE: android/app/BUCK ================================================ # To learn about Buck see [Docs](https://buckbuild.com/). # To run your application with Buck: # - install Buck # - `npm start` - to start the packager # - `cd android` # - `keytool -genkey -v -keystore keystores/debug.keystore -storepass android -alias androiddebugkey -keypass android -dname "CN=Android Debug,O=Android,C=US"` # - `./gradlew :app:copyDownloadableDepsToLibs` - make all Gradle compile dependencies available to Buck # - `buck install -r android/app` - compile, install and run application # load(":build_defs.bzl", "create_aar_targets", "create_jar_targets") lib_deps = [] create_aar_targets(glob(["libs/*.aar"])) create_jar_targets(glob(["libs/*.jar"])) android_library( name = "all-libs", exported_deps = lib_deps, ) android_library( name = "app-code", srcs = glob([ "src/main/java/**/*.java", ]), deps = [ ":all-libs", ":build_config", ":res", ], ) android_build_config( name = "build_config", package = "com.materialbread", ) android_resource( name = "res", package = "com.materialbread", res = "src/main/res", ) android_binary( name = "app", keystore = "//android/keystores:debug", manifest = "src/main/AndroidManifest.xml", package_type = "debug", deps = [ ":app-code", ], ) ================================================ FILE: android/app/build.gradle ================================================ apply plugin: "com.android.application" import com.android.build.OutputFile /** * The react.gradle file registers a task for each build variant (e.g. bundleDebugJsAndAssets * and bundleReleaseJsAndAssets). * These basically call `react-native bundle` with the correct arguments during the Android build * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the * bundle directly from the development server. Below you can see all the possible configurations * and their defaults. If you decide to add a configuration block, make sure to add it before the * `apply from: "../../node_modules/react-native/react.gradle"` line. * * project.ext.react = [ * // the name of the generated asset file containing your JS bundle * bundleAssetName: "index.android.bundle", * * // the entry file for bundle generation * entryFile: "index.android.js", * * // whether to bundle JS and assets in debug mode * bundleInDebug: false, * * // whether to bundle JS and assets in release mode * bundleInRelease: true, * * // whether to bundle JS and assets in another build variant (if configured). * // See http://tools.android.com/tech-docs/new-build-system/user-guide#TOC-Build-Variants * // The configuration property can be in the following formats * // 'bundleIn${productFlavor}${buildType}' * // 'bundleIn${buildType}' * // bundleInFreeDebug: true, * // bundleInPaidRelease: true, * // bundleInBeta: true, * * // whether to disable dev mode in custom build variants (by default only disabled in release) * // for example: to disable dev mode in the staging build type (if configured) * devDisabledInStaging: true, * // The configuration property can be in the following formats * // 'devDisabledIn${productFlavor}${buildType}' * // 'devDisabledIn${buildType}' * * // the root of your project, i.e. where "package.json" lives * root: "../../", * * // where to put the JS bundle asset in debug mode * jsBundleDirDebug: "$buildDir/intermediates/assets/debug", * * // where to put the JS bundle asset in release mode * jsBundleDirRelease: "$buildDir/intermediates/assets/release", * * // where to put drawable resources / React Native assets, e.g. the ones you use via * // require('./image.png')), in debug mode * resourcesDirDebug: "$buildDir/intermediates/res/merged/debug", * * // where to put drawable resources / React Native assets, e.g. the ones you use via * // require('./image.png')), in release mode * resourcesDirRelease: "$buildDir/intermediates/res/merged/release", * * // by default the gradle tasks are skipped if none of the JS files or assets change; this means * // that we don't look at files in android/ or ios/ to determine whether the tasks are up to * // date; if you have any other folders that you want to ignore for performance reasons (gradle * // indexes the entire tree), add them here. Alternatively, if you have JS files in android/ * // for example, you might want to remove it from here. * inputExcludes: ["android/**", "ios/**"], * * // override which node gets called and with what additional arguments * nodeExecutableAndArgs: ["node"], * * // supply additional arguments to the packager * extraPackagerArgs: [] * ] */ project.ext.react = [ entryFile: "index.js" ] apply from: "../../node_modules/react-native/react.gradle" /** * Set this to true to create two separate APKs instead of one: * - An APK that only works on ARM devices * - An APK that only works on x86 devices * The advantage is the size of the APK is reduced by about 4MB. * Upload all the APKs to the Play Store and people will download * the correct one based on the CPU architecture of their device. */ def enableSeparateBuildPerCPUArchitecture = false /** * Run Proguard to shrink the Java bytecode in release builds. */ def enableProguardInReleaseBuilds = false android { compileSdkVersion rootProject.ext.compileSdkVersion buildToolsVersion rootProject.ext.buildToolsVersion defaultConfig { applicationId "com.materialbread" minSdkVersion rootProject.ext.minSdkVersion targetSdkVersion rootProject.ext.targetSdkVersion versionCode 1 versionName "1.0" } splits { abi { reset() enable enableSeparateBuildPerCPUArchitecture universalApk false // If true, also generate a universal APK include "armeabi-v7a", "x86", "arm64-v8a" } } buildTypes { release { minifyEnabled enableProguardInReleaseBuilds proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro" } } // applicationVariants are e.g. debug, release applicationVariants.all { variant -> variant.outputs.each { output -> // For each separate APK per architecture, set a unique version code as described here: // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits def versionCodes = ["armeabi-v7a":1, "x86":2, "arm64-v8a": 3] def abi = output.getFilter(OutputFile.ABI) if (abi != null) { // null for the universal-debug, universal-release variants output.versionCodeOverride = versionCodes.get(abi) * 1048576 + defaultConfig.versionCode } } } } dependencies { implementation project(':react-native-svg') implementation project(':react-native-vector-icons') implementation fileTree(dir: "libs", include: ["*.jar"]) implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}" implementation "com.facebook.react:react-native:+" // From node_modules } // Run this once to be able to run the application with BUCK // puts all compile dependencies into folder libs for BUCK to use task copyDownloadableDepsToLibs(type: Copy) { from configurations.compile into 'libs' } ================================================ FILE: android/app/build_defs.bzl ================================================ """Helper definitions to glob .aar and .jar targets""" def create_aar_targets(aarfiles): for aarfile in aarfiles: name = "aars__" + aarfile[aarfile.rindex("/") + 1:aarfile.rindex(".aar")] lib_deps.append(":" + name) android_prebuilt_aar( name = name, aar = aarfile, ) def create_jar_targets(jarfiles): for jarfile in jarfiles: name = "jars__" + jarfile[jarfile.rindex("/") + 1:jarfile.rindex(".jar")] lib_deps.append(":" + name) prebuilt_jar( name = name, binary_jar = jarfile, ) ================================================ FILE: android/app/proguard-rules.pro ================================================ # Add project specific ProGuard rules here. # By default, the flags in this file are appended to flags specified # in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt # You can edit the include path and order by changing the proguardFiles # directive in build.gradle. # # For more details, see # http://developer.android.com/guide/developing/tools/proguard.html # Add any project specific keep options here: # If your project uses WebView with JS, uncomment the following # and specify the fully qualified class name to the JavaScript interface # class: #-keepclassmembers class fqcn.of.javascript.interface.for.webview { # public *; #} ================================================ FILE: android/app/src/main/AndroidManifest.xml ================================================ ================================================ FILE: android/app/src/main/java/com/materialbread/MainActivity.java ================================================ package com.materialbread; import com.facebook.react.ReactActivity; public class MainActivity extends ReactActivity { /** * Returns the name of the main component registered from JavaScript. * This is used to schedule rendering of the component. */ @Override protected String getMainComponentName() { return "MaterialBread"; } } ================================================ FILE: android/app/src/main/java/com/materialbread/MainApplication.java ================================================ package com.materialbread; import android.app.Application; import com.facebook.react.ReactApplication; import com.horcrux.svg.SvgPackage; import com.oblador.vectoricons.VectorIconsPackage; import com.facebook.react.ReactNativeHost; import com.facebook.react.ReactPackage; import com.facebook.react.shell.MainReactPackage; import com.facebook.soloader.SoLoader; import java.util.Arrays; import java.util.List; public class MainApplication extends Application implements ReactApplication { private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) { @Override public boolean getUseDeveloperSupport() { return BuildConfig.DEBUG; } @Override protected List getPackages() { return Arrays.asList( new MainReactPackage(), new SvgPackage(), new VectorIconsPackage() ); } @Override protected String getJSMainModuleName() { return "index"; } }; @Override public ReactNativeHost getReactNativeHost() { return mReactNativeHost; } @Override public void onCreate() { super.onCreate(); SoLoader.init(this, /* native exopackage */ false); } } ================================================ FILE: android/app/src/main/res/values/strings.xml ================================================ MaterialBread ================================================ FILE: android/app/src/main/res/values/styles.xml ================================================ ================================================ FILE: android/build.gradle ================================================ // Top-level build file where you can add configuration options common to all sub-projects/modules. buildscript { ext { buildToolsVersion = "28.0.2" minSdkVersion = 16 compileSdkVersion = 28 targetSdkVersion = 27 supportLibVersion = "28.0.0" } repositories { google() jcenter() } dependencies { classpath 'com.android.tools.build:gradle:3.3.0' // NOTE: Do not place your application dependencies here; they belong // in the individual module build.gradle files } } allprojects { repositories { mavenLocal() google() jcenter() maven { // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm url "$rootDir/../node_modules/react-native/android" } } } task wrapper(type: Wrapper) { gradleVersion = '4.7' distributionUrl = distributionUrl.replace("bin", "all") } ================================================ FILE: android/gradle/wrapper/gradle-wrapper.properties ================================================ distributionBase=GRADLE_USER_HOME distributionPath=wrapper/dists zipStoreBase=GRADLE_USER_HOME zipStorePath=wrapper/dists distributionUrl=https\://services.gradle.org/distributions/gradle-4.10.1-all.zip ================================================ FILE: android/gradle.properties ================================================ # Project-wide Gradle settings. # IDE (e.g. Android Studio) users: # Gradle settings configured through the IDE *will override* # any settings specified in this file. # For more details on how to configure your build environment visit # http://www.gradle.org/docs/current/userguide/build_environment.html # Specifies the JVM arguments used for the daemon process. # The setting is particularly useful for tweaking memory settings. # Default value: -Xmx10248m -XX:MaxPermSize=256m # org.gradle.jvmargs=-Xmx2048m -XX:MaxPermSize=512m -XX:+HeapDumpOnOutOfMemoryError -Dfile.encoding=UTF-8 # When configured, Gradle will run in incubating parallel mode. # This option should only be used with decoupled projects. More details, visit # http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects # org.gradle.parallel=true ================================================ FILE: android/gradlew ================================================ #!/usr/bin/env sh ############################################################################## ## ## Gradle start up script for UN*X ## ############################################################################## # Attempt to set APP_HOME # Resolve links: $0 may be a link PRG="$0" # Need this for relative symlinks. while [ -h "$PRG" ] ; do ls=`ls -ld "$PRG"` link=`expr "$ls" : '.*-> \(.*\)$'` if expr "$link" : '/.*' > /dev/null; then PRG="$link" else PRG=`dirname "$PRG"`"/$link" fi done SAVED="`pwd`" cd "`dirname \"$PRG\"`/" >/dev/null APP_HOME="`pwd -P`" cd "$SAVED" >/dev/null APP_NAME="Gradle" APP_BASE_NAME=`basename "$0"` # Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. DEFAULT_JVM_OPTS="" # Use the maximum available, or set MAX_FD != -1 to use that value. MAX_FD="maximum" warn () { echo "$*" } die () { echo echo "$*" echo exit 1 } # OS specific support (must be 'true' or 'false'). cygwin=false msys=false darwin=false nonstop=false case "`uname`" in CYGWIN* ) cygwin=true ;; Darwin* ) darwin=true ;; MINGW* ) msys=true ;; NONSTOP* ) nonstop=true ;; esac CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar # Determine the Java command to use to start the JVM. if [ -n "$JAVA_HOME" ] ; then if [ -x "$JAVA_HOME/jre/sh/java" ] ; then # IBM's JDK on AIX uses strange locations for the executables JAVACMD="$JAVA_HOME/jre/sh/java" else JAVACMD="$JAVA_HOME/bin/java" fi if [ ! -x "$JAVACMD" ] ; then die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME Please set the JAVA_HOME variable in your environment to match the location of your Java installation." fi else JAVACMD="java" which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. Please set the JAVA_HOME variable in your environment to match the location of your Java installation." fi # Increase the maximum file descriptors if we can. if [ "$cygwin" = "false" -a "$darwin" = "false" -a "$nonstop" = "false" ] ; then MAX_FD_LIMIT=`ulimit -H -n` if [ $? -eq 0 ] ; then if [ "$MAX_FD" = "maximum" -o "$MAX_FD" = "max" ] ; then MAX_FD="$MAX_FD_LIMIT" fi ulimit -n $MAX_FD if [ $? -ne 0 ] ; then warn "Could not set maximum file descriptor limit: $MAX_FD" fi else warn "Could not query maximum file descriptor limit: $MAX_FD_LIMIT" fi fi # For Darwin, add options to specify how the application appears in the dock if $darwin; then GRADLE_OPTS="$GRADLE_OPTS \"-Xdock:name=$APP_NAME\" \"-Xdock:icon=$APP_HOME/media/gradle.icns\"" fi # For Cygwin, switch paths to Windows format before running java if $cygwin ; then APP_HOME=`cygpath --path --mixed "$APP_HOME"` CLASSPATH=`cygpath --path --mixed "$CLASSPATH"` JAVACMD=`cygpath --unix "$JAVACMD"` # We build the pattern for arguments to be converted via cygpath ROOTDIRSRAW=`find -L / -maxdepth 1 -mindepth 1 -type d 2>/dev/null` SEP="" for dir in $ROOTDIRSRAW ; do ROOTDIRS="$ROOTDIRS$SEP$dir" SEP="|" done OURCYGPATTERN="(^($ROOTDIRS))" # Add a user-defined pattern to the cygpath arguments if [ "$GRADLE_CYGPATTERN" != "" ] ; then OURCYGPATTERN="$OURCYGPATTERN|($GRADLE_CYGPATTERN)" fi # Now convert the arguments - kludge to limit ourselves to /bin/sh i=0 for arg in "$@" ; do CHECK=`echo "$arg"|egrep -c "$OURCYGPATTERN" -` CHECK2=`echo "$arg"|egrep -c "^-"` ### Determine if an option if [ $CHECK -ne 0 ] && [ $CHECK2 -eq 0 ] ; then ### Added a condition eval `echo args$i`=`cygpath --path --ignore --mixed "$arg"` else eval `echo args$i`="\"$arg\"" fi i=$((i+1)) done case $i in (0) set -- ;; (1) set -- "$args0" ;; (2) set -- "$args0" "$args1" ;; (3) set -- "$args0" "$args1" "$args2" ;; (4) set -- "$args0" "$args1" "$args2" "$args3" ;; (5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;; (6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;; (7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;; (8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;; (9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;; esac fi # Escape application args save () { for i do printf %s\\n "$i" | sed "s/'/'\\\\''/g;1s/^/'/;\$s/\$/' \\\\/" ; done echo " " } APP_ARGS=$(save "$@") # Collect all arguments for the java command, following the shell quoting and substitution rules eval set -- $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS "\"-Dorg.gradle.appname=$APP_BASE_NAME\"" -classpath "\"$CLASSPATH\"" org.gradle.wrapper.GradleWrapperMain "$APP_ARGS" # by default we should be in the correct project dir, but when run from Finder on Mac, the cwd is wrong if [ "$(uname)" = "Darwin" ] && [ "$HOME" = "$PWD" ]; then cd "$(dirname "$0")" fi exec "$JAVACMD" "$@" ================================================ FILE: android/gradlew.bat ================================================ @if "%DEBUG%" == "" @echo off @rem ########################################################################## @rem @rem Gradle startup script for Windows @rem @rem ########################################################################## @rem Set local scope for the variables with windows NT shell if "%OS%"=="Windows_NT" setlocal set DIRNAME=%~dp0 if "%DIRNAME%" == "" set DIRNAME=. set APP_BASE_NAME=%~n0 set APP_HOME=%DIRNAME% @rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. set DEFAULT_JVM_OPTS= @rem Find java.exe if defined JAVA_HOME goto findJavaFromJavaHome set JAVA_EXE=java.exe %JAVA_EXE% -version >NUL 2>&1 if "%ERRORLEVEL%" == "0" goto init echo. echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. echo. echo Please set the JAVA_HOME variable in your environment to match the echo location of your Java installation. goto fail :findJavaFromJavaHome set JAVA_HOME=%JAVA_HOME:"=% set JAVA_EXE=%JAVA_HOME%/bin/java.exe if exist "%JAVA_EXE%" goto init echo. echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% echo. echo Please set the JAVA_HOME variable in your environment to match the echo location of your Java installation. goto fail :init @rem Get command-line arguments, handling Windows variants if not "%OS%" == "Windows_NT" goto win9xME_args :win9xME_args @rem Slurp the command line arguments. set CMD_LINE_ARGS= set _SKIP=2 :win9xME_args_slurp if "x%~1" == "x" goto execute set CMD_LINE_ARGS=%* :execute @rem Setup the command line set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar @rem Execute Gradle "%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS% :end @rem End local scope for the variables with windows NT shell if "%ERRORLEVEL%"=="0" goto mainEnd :fail rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of rem the _cmd.exe /c_ return code! if not "" == "%GRADLE_EXIT_CONSOLE%" exit 1 exit /b 1 :mainEnd if "%OS%"=="Windows_NT" endlocal :omega ================================================ FILE: android/keystores/BUCK ================================================ keystore( name = "debug", properties = "debug.keystore.properties", store = "debug.keystore", visibility = [ "PUBLIC", ], ) ================================================ FILE: android/keystores/debug.keystore.properties ================================================ key.store=debug.keystore key.alias=androiddebugkey key.store.password=android key.alias.password=android ================================================ FILE: android/settings.gradle ================================================ rootProject.name = 'MaterialBread' include ':react-native-svg' project(':react-native-svg').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-svg/android') include ':react-native-vector-icons' project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android') include ':app' ================================================ FILE: app.json ================================================ { "name": "MaterialBread", "displayName": "MaterialBread" } ================================================ FILE: babel.config.js ================================================ module.exports = function(api) { api.cache(true); return { presets: ['module:metro-react-native-babel-preset'], plugins: [ '@babel/plugin-transform-flow-strip-types', '@babel/plugin-proposal-class-properties', '@babel/plugin-proposal-object-rest-spread', '@babel/plugin-proposal-export-namespace-from', ], }; }; ================================================ FILE: dist/Components/Appbar/Appbar.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Paper=_interopRequireDefault(require("../Paper/Paper"));var _IconButton=_interopRequireDefault(require("../IconButton/IconButton"));var _Appbar=_interopRequireDefault(require("./Appbar.styles"));var _=require("../../");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Appbar/Appbar.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0&&arguments[0]!==undefined?arguments[0]:false;var _this$props2=_this.props,backLayerRevealed=_this$props2.backLayerRevealed,offset=_this$props2.offset,window=_this$props2.window;if(!ignoreElement&&backLayerRevealed&&offset){return offset;}if(offset)return offset;var y=_this.getY();return window.height-y;});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"getY",function(){var initialOffset=_this.props.initialOffset;var y=IOS?20:24;return y+initialOffset;});return _this;}(0,_createClass2.default)(FrontLayer,[{key:"render",value:function render(){var _this$props3=this.props,children=_this$props3.children,_toggleLayout=_this$props3.toggleLayout,animate=_this$props3.animate,frontLayerStyle=_this$props3.frontLayerStyle,backRevealed=_this$props3.backRevealed,subheader=_this$props3.subheader;var translateY=this.getFrontLayerTranslateY();return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_FrontLayer.default.frontLayerContainer,frontLayerStyle,{transform:[{translateY:translateY}]}],__source:{fileName:_jsxFileName,lineNumber:74}},_react.default.createElement(_.Subtitle,{text:subheader,style:_FrontLayer.default.subheader,__source:{fileName:_jsxFileName,lineNumber:81}}),children,_react.default.createElement(_FrontLayerScrim.default,{toggleLayout:function toggleLayout(){return _toggleLayout();},animate:animate,backRevealed:backRevealed,__source:{fileName:_jsxFileName,lineNumber:83}}));}}]);return FrontLayer;}(_react.PureComponent);(0,_defineProperty2.default)(FrontLayer,"propTypes",{offset:_propTypes.default.number,initialOffset:_propTypes.default.number,children:_propTypes.default.node,backLayerRevealed:_propTypes.default.object,frontLayerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,toggleLayout:_propTypes.default.func,animate:_propTypes.default.object,backRevealed:_propTypes.default.bool,isInternalAnimate:_propTypes.default.bool,internalOffsetAnimate:_propTypes.default.object,window:_propTypes.default.object,subheader:_propTypes.default.string});var _default=(0,_withTheme.default)(FrontLayer);exports.default=_default; ================================================ FILE: dist/Components/Backdrop/FrontLayer/FrontLayer.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({frontLayerContainer:{flex:1,backgroundColor:'white',borderTopLeftRadius:16,borderTopRightRadius:16},subheader:{fontSize:16,color:'rgba(0,0,0,.8)',marginLeft:20,marginTop:16}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Backdrop/FrontLayerScrim/FrontLayerScrim.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _=require("../../../");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _FrontLayerScrim=_interopRequireDefault(require("./FrontLayerScrim.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Backdrop/FrontLayerScrim/FrontLayerScrim.js";var FrontLayerScrim=function(_Component){(0,_inherits2.default)(FrontLayerScrim,_Component);function FrontLayerScrim(props){(0,_classCallCheck2.default)(this,FrontLayerScrim);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(FrontLayerScrim).call(this,props));}(0,_createClass2.default)(FrontLayerScrim,[{key:"render",value:function render(){var _this$props=this.props,backRevealed=_this$props.backRevealed,toggleLayout=_this$props.toggleLayout,animate=_this$props.animate;if(!backRevealed)return null;return _react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:function onPress(){return toggleLayout();},__source:{fileName:_jsxFileName,lineNumber:24}},_react.default.createElement(_reactNative.Animated.View,{style:[_FrontLayerScrim.default.scrimLayer,{opacity:animate}],useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:25}},_react.default.createElement(_.Icon,{name:"expand-less",size:24,color:"rgba(0,0,0,0.56)",style:_FrontLayerScrim.default.scrimLayerIcon,__source:{fileName:_jsxFileName,lineNumber:28}})));}}]);return FrontLayerScrim;}(_react.Component);(0,_defineProperty2.default)(FrontLayerScrim,"propTypes",{backRevealed:_propTypes.default.bool,toggleLayout:_propTypes.default.func,animate:_propTypes.default.object});var _default=(0,_withTheme.default)(FrontLayerScrim);exports.default=_default; ================================================ FILE: dist/Components/Backdrop/FrontLayerScrim/FrontLayerScrim.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({scrimLayer:{position:'absolute',top:0,right:0,bottom:0,left:0,backgroundColor:'rgba(255,255,255,0.8)',borderTopLeftRadius:16,borderTopRightRadius:16},scrimLayerIcon:{position:'absolute',top:12,right:16}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Backdrop/HeaderButton/HeaderButton.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _=require("../../../");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _HeaderButton=_interopRequireDefault(require("./HeaderButton.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Backdrop/HeaderButton/HeaderButton.js";var HeaderButton=function(_Component){(0,_inherits2.default)(HeaderButton,_Component);function HeaderButton(props){var _this;(0,_classCallCheck2.default)(this,HeaderButton);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(HeaderButton).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"spinValue",new _reactNative.Animated.Value(0));return _this;}(0,_createClass2.default)(HeaderButton,[{key:"_handleSpin",value:function _handleSpin(){var _this2=this;var _this$props=this.props,backConcealed=_this$props.backConcealed,toggleLayout=_this$props.toggleLayout;toggleLayout();_reactNative.Animated.timing(this.spinValue,{toValue:0.5,duration:94,easing:_reactNative.Easing.linear,useNativeDriver:true}).start(function(){_reactNative.Animated.timing(_this2.spinValue,{toValue:backConcealed?1:0,duration:94,easing:_reactNative.Easing.linear,useNativeDriver:true}).start();});}},{key:"render",value:function render(){var _this3=this;var _this$props2=this.props,headerButtonStyle=_this$props2.headerButtonStyle,iconName=_this$props2.iconName;var spin=this.spinValue.interpolate({inputRange:[0,1],outputRange:['180deg','0deg']});var style=[_HeaderButton.default.container,headerButtonStyle,{transform:[{rotate:spin}]}];return _react.default.createElement(_reactNative.Animated.View,{style:style,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:53}},_react.default.createElement(_.Ripple,{rippleContainerBorderRadius:100,onPress:function onPress(){return _this3._handleSpin();},style:_HeaderButton.default.ripple,__source:{fileName:_jsxFileName,lineNumber:54}},_react.default.createElement(_.Icon,{name:iconName,size:24,color:"white",style:_HeaderButton.default.icon,__source:{fileName:_jsxFileName,lineNumber:58}})));}}]);return HeaderButton;}(_react.Component);(0,_defineProperty2.default)(HeaderButton,"propTypes",{headerButtonStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),toggleLayout:_propTypes.default.func,backConcealed:_propTypes.default.bool,iconName:_propTypes.default.string});var _default=(0,_withTheme.default)(HeaderButton);exports.default=_default; ================================================ FILE: dist/Components/Backdrop/HeaderButton/HeaderButton.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({container:{height:56,width:56,justifyContent:'center',alignItems:'center',position:'absolute'},ripple:{height:32,width:32,justifyContent:'center'},icon:{alignSelf:'center'}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Backdrop/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _Backdrop.default;}});var _Backdrop=_interopRequireDefault(require("./Backdrop")); ================================================ FILE: dist/Components/Backdrop/utils.js ================================================ ================================================ FILE: dist/Components/Badge/Badge.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Ripple=_interopRequireDefault(require("../Ripple/Ripple"));var _Badge=_interopRequireDefault(require("./Badge.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Badge/Badge.js";var Badge=function(_Component){(0,_inherits2.default)(Badge,_Component);function Badge(props){var _this;(0,_classCallCheck2.default)(this,Badge);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Badge).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{childrenWidth:0,childrenHeight:0,scale:new _reactNative.Animated.Value(0)});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onChildrenLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({childrenWidth:width,childrenHeight:height});});return _this;}(0,_createClass2.default)(Badge,[{key:"componentDidMount",value:function componentDidMount(){var visible=this.props.visible;if(visible){this._animateBadge();}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){this._animateBadge();}}},{key:"getFontSize",value:function getFontSize(content,maxed){var size=this.props.size;var scaleFactor=0.5;if(content&&String(content).length>3&&!maxed){scaleFactor=0.3;}return size*scaleFactor;}},{key:"getBadgeWidth",value:function getBadgeWidth(content){var size=this.props.size;var isLong=String(content).length>3;var scaleFactor=isLong?1.75:1.5;return scaleFactor*size;}},{key:"_animateBadge",value:function _animateBadge(){var visible=this.props.visible;var scale=this.state.scale;var scaleValue=visible?1:0;_reactNative.Animated.spring(scale,{toValue:scaleValue,speed:7,useNativeDriver:true}).start();}},{key:"_renderBadge",value:function _renderBadge(){var _this$props=this.props,size=_this$props.size,textColor=_this$props.textColor,color=_this$props.color,style=_this$props.style,theme=_this$props.theme,children=_this$props.children,content=_this$props.content,position=_this$props.position,right=_this$props.right,left=_this$props.left,top=_this$props.top,_this$props$maxValue=_this$props.maxValue,maxValue=_this$props$maxValue===void 0?0:_this$props$maxValue,rest=(0,_objectWithoutProperties2.default)(_this$props,["size","textColor","color","style","theme","children","content","position","right","left","top","maxValue"]);var positionStyle={right:children?0:'auto'};if(position==='left'){positionStyle={left:children?0:'auto'};}if(right)positionStyle.right=right;if(left)positionStyle.left=left;var maxedContent=parseInt(content,10);var maxed=!isNaN(maxedContent)&&maxValue&&maxedContent>maxValue;maxedContent=maxed?maxValue+"+":content;return _react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true,style:[{height:size,width:maxed?this.getBadgeWidth(maxedContent):size,borderRadius:size,backgroundColor:color?color:theme.primary.main,alignItems:'center',justifyContent:'center',position:children?'absolute':'relative',top:top?top:0,transform:[{scale:this.state.scale}]},positionStyle,style],numberOfLines:1},rest,{__source:{fileName:_jsxFileName,lineNumber:137}}),_react.default.createElement(_reactNative.Text,{style:[_Badge.default.content,{fontSize:this.getFontSize(maxedContent,maxed),color:textColor?textColor:'white'}],__source:{fileName:_jsxFileName,lineNumber:157}},maxedContent));}},{key:"render",value:function render(){var _this$props2=this.props,children=_this$props2.children,containerStyle=_this$props2.containerStyle,onPress=_this$props2.onPress,testID=_this$props2.testID;var _this$state=this.state,childrenHeight=_this$state.childrenHeight,childrenWidth=_this$state.childrenWidth;return _react.default.createElement(_reactNative.View,{style:[{position:'relative',alignSelf:'flex-start',alignItems:'flex-start',height:children?childrenHeight:'auto',width:children?childrenWidth:'auto',maxHeight:children?childrenHeight:'auto',maxWidth:children?childrenWidth:'auto',minHeight:children?childrenHeight:'auto',minWidth:children?childrenWidth:'auto'},containerStyle],testID:testID,__source:{fileName:_jsxFileName,lineNumber:176}},_react.default.createElement(_reactNative.View,{onLayout:this.onChildrenLayout,__source:{fileName:_jsxFileName,lineNumber:192}},children),onPress?_react.default.createElement(_Ripple.default,{onPress:true,__source:{fileName:_jsxFileName,lineNumber:194}},this._renderBadge()):this._renderBadge());}}]);return Badge;}(_react.Component);(0,_defineProperty2.default)(Badge,"propTypes",{color:_propTypes.default.string,textColor:_propTypes.default.string,content:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.number]),maxValue:_propTypes.default.number,children:_propTypes.default.node,size:_propTypes.default.number,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),position:_propTypes.default.string,onPress:_propTypes.default.func,theme:_propTypes.default.object,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),right:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),left:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),top:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),visible:_propTypes.default.bool,testID:_propTypes.default.string});(0,_defineProperty2.default)(Badge,"defaultProps",{position:'right',size:16,right:0,left:'auto',visible:true});var _default=(0,_withTheme.default)(Badge);exports.default=_default; ================================================ FILE: dist/Components/Badge/Badge.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../..");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _storybookState=require("@sambego/storybook-state");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Badge/Badge.stories.js";var store=new _storybookState.Store({visible:true});var _default=(0,_storiesOf.storiesOf)('Components|Badge',module).addParameters({jest:['Badge']}).add('Standalone',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:16}},_react.default.createElement(_Header.default,{title:'Standalone',__source:{fileName:_jsxFileName,lineNumber:17}}),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row',alignItems:'center',marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:19}},_react.default.createElement(_.Badge,{size:12,content:24,__source:{fileName:_jsxFileName,lineNumber:25}}),_react.default.createElement(_.Badge,{size:24,content:99,color:'#E91E63',__source:{fileName:_jsxFileName,lineNumber:26}}),_react.default.createElement(_.Badge,{size:36,content:2,color:'#9C27B0',__source:{fileName:_jsxFileName,lineNumber:27}}),_react.default.createElement(_.Badge,{size:48,content:102,color:'#009688',__source:{fileName:_jsxFileName,lineNumber:28}}),_react.default.createElement(_.Badge,{size:60,content:35,color:'#3F51B5',__source:{fileName:_jsxFileName,lineNumber:29}})),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row',alignItems:'center'},__source:{fileName:_jsxFileName,lineNumber:32}},_react.default.createElement(_.Badge,{size:12,content:24,color:'black',textColor:'#E91E63',__source:{fileName:_jsxFileName,lineNumber:33}}),_react.default.createElement(_.Badge,{size:24,content:99,color:'black',textColor:'#E91E63',__source:{fileName:_jsxFileName,lineNumber:34}}),_react.default.createElement(_.Badge,{size:36,content:2,color:'black',textColor:'#9C27B0',__source:{fileName:_jsxFileName,lineNumber:35}}),_react.default.createElement(_.Badge,{size:48,content:102,color:'black',t:true,textColor:'#009688',__source:{fileName:_jsxFileName,lineNumber:36}}),_react.default.createElement(_.Badge,{size:60,content:35,color:'black',textColor:'#3F51B5',__source:{fileName:_jsxFileName,lineNumber:43}})));}).add('With Max Value',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:48}},_react.default.createElement(_Header.default,{title:'Standalone',__source:{fileName:_jsxFileName,lineNumber:49}}),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row',alignItems:'center',marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:51}},_react.default.createElement(_.Badge,{size:36,content:'MB',maxValue:99,__source:{fileName:_jsxFileName,lineNumber:57}}),_react.default.createElement(_.Badge,{size:36,content:99,__source:{fileName:_jsxFileName,lineNumber:58}}),_react.default.createElement(_.Badge,{size:36,content:100,maxValue:99,__source:{fileName:_jsxFileName,lineNumber:59}}),_react.default.createElement(_.Badge,{size:36,content:1000,maxValue:999,__source:{fileName:_jsxFileName,lineNumber:60}})));}).add('On Icons',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:65}},_react.default.createElement(_Header.default,{title:'On Icons',__source:{fileName:_jsxFileName,lineNumber:66}}),_react.default.createElement(_reactNative.View,{style:{flex:1,flexDirection:'row',alignItems:'center',marginBottom:80},__source:{fileName:_jsxFileName,lineNumber:68}},_react.default.createElement(_.Badge,{size:14,content:4,__source:{fileName:_jsxFileName,lineNumber:75}},_react.default.createElement(_.Icon,{name:"favorite",size:24,__source:{fileName:_jsxFileName,lineNumber:76}})),_react.default.createElement(_.Badge,{size:16,content:77,color:'red',__source:{fileName:_jsxFileName,lineNumber:78}},_react.default.createElement(_.IconButton,{name:"mail",size:32,__source:{fileName:_jsxFileName,lineNumber:79}})),_react.default.createElement(_.Badge,{size:20,content:22,color:'#8BC34A',__source:{fileName:_jsxFileName,lineNumber:81}},_react.default.createElement(_.IconButton,{name:"album",size:46,__source:{fileName:_jsxFileName,lineNumber:82}})),_react.default.createElement(_.Badge,{size:25,content:99,color:'#03A9F4',__source:{fileName:_jsxFileName,lineNumber:84}},_react.default.createElement(_.IconButton,{name:"bookmark",size:64,color:'#E91E63',__source:{fileName:_jsxFileName,lineNumber:85}}))),_react.default.createElement(_reactNative.View,{style:{flex:1,flexDirection:'row',alignItems:'center'},__source:{fileName:_jsxFileName,lineNumber:89}},_react.default.createElement(_.Badge,{size:14,content:7,position:'left',textColor:'pink',__source:{fileName:_jsxFileName,lineNumber:90}},_react.default.createElement(_.IconButton,{name:"info",size:24,__source:{fileName:_jsxFileName,lineNumber:91}})),_react.default.createElement(_.Badge,{size:18,content:1023,position:'left',__source:{fileName:_jsxFileName,lineNumber:93}},_react.default.createElement(_.IconButton,{name:"message",size:32,color:'#8BC34A',__source:{fileName:_jsxFileName,lineNumber:94}})),_react.default.createElement(_.Badge,{size:24,content:123,position:'left',color:'black',__source:{fileName:_jsxFileName,lineNumber:96}},_react.default.createElement(_.IconButton,{name:"error",size:48,color:'#F44336',__source:{fileName:_jsxFileName,lineNumber:97}})),_react.default.createElement(_.Badge,{size:24,content:23,position:'left',color:'#FFC107',__source:{fileName:_jsxFileName,lineNumber:99}},_react.default.createElement(_.IconButton,{name:"favorite",size:64,color:'#9C27B0',__source:{fileName:_jsxFileName,lineNumber:100}}))));}).add('Dot',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:106}},_react.default.createElement(_Header.default,{title:'Dots',__source:{fileName:_jsxFileName,lineNumber:107}}),_react.default.createElement(_reactNative.View,{style:{flex:1,flexDirection:'row',alignItems:'center',marginBottom:80},__source:{fileName:_jsxFileName,lineNumber:109}},_react.default.createElement(_.Badge,{size:7,__source:{fileName:_jsxFileName,lineNumber:116}},_react.default.createElement(_.Icon,{name:"favorite",size:24,__source:{fileName:_jsxFileName,lineNumber:117}})),_react.default.createElement(_.Badge,{size:8,color:'red',__source:{fileName:_jsxFileName,lineNumber:119}},_react.default.createElement(_.IconButton,{name:"mail",size:32,__source:{fileName:_jsxFileName,lineNumber:120}})),_react.default.createElement(_.Badge,{size:10,color:'#8BC34A',__source:{fileName:_jsxFileName,lineNumber:122}},_react.default.createElement(_.IconButton,{name:"album",size:46,__source:{fileName:_jsxFileName,lineNumber:123}})),_react.default.createElement(_.Badge,{size:12,color:'#03A9F4',__source:{fileName:_jsxFileName,lineNumber:125}},_react.default.createElement(_.IconButton,{name:"bookmark",size:64,color:'#E91E63',__source:{fileName:_jsxFileName,lineNumber:126}}))),_react.default.createElement(_reactNative.View,{style:{flex:1,flexDirection:'row',alignItems:'center'},__source:{fileName:_jsxFileName,lineNumber:130}},_react.default.createElement(_.Badge,{size:7,position:'left',textColor:'pink',__source:{fileName:_jsxFileName,lineNumber:131}},_react.default.createElement(_.IconButton,{name:"info",size:24,__source:{fileName:_jsxFileName,lineNumber:132}})),_react.default.createElement(_.Badge,{size:8,position:'left',__source:{fileName:_jsxFileName,lineNumber:134}},_react.default.createElement(_.IconButton,{name:"message",size:32,color:'#8BC34A',__source:{fileName:_jsxFileName,lineNumber:135}})),_react.default.createElement(_.Badge,{size:9,position:'left',color:'black',__source:{fileName:_jsxFileName,lineNumber:137}},_react.default.createElement(_.IconButton,{name:"error",size:48,color:'#F44336',__source:{fileName:_jsxFileName,lineNumber:138}})),_react.default.createElement(_.Badge,{size:10,position:'left',color:'#FFC107',__source:{fileName:_jsxFileName,lineNumber:140}},_react.default.createElement(_.IconButton,{name:"favorite",size:64,color:'#9C27B0',__source:{fileName:_jsxFileName,lineNumber:141}}))));}).add('Animated',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:147}},_react.default.createElement(_Header.default,{title:'On Icons',__source:{fileName:_jsxFileName,lineNumber:148}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:149}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:151}},_react.default.createElement(_reactNative.View,{style:{flex:1,flexDirection:'row',alignItems:'center',marginBottom:80},__source:{fileName:_jsxFileName,lineNumber:152}},_react.default.createElement(_.Badge,{size:14,content:4,visible:state.visible,__source:{fileName:_jsxFileName,lineNumber:159}},_react.default.createElement(_.Icon,{name:"favorite",size:24,__source:{fileName:_jsxFileName,lineNumber:160}})),_react.default.createElement(_.Badge,{size:16,content:77,color:'red',visible:state.visible,__source:{fileName:_jsxFileName,lineNumber:162}},_react.default.createElement(_.IconButton,{name:"mail",size:32,__source:{fileName:_jsxFileName,lineNumber:167}})),_react.default.createElement(_.Badge,{size:8,position:'left',visible:state.visible,__source:{fileName:_jsxFileName,lineNumber:169}},_react.default.createElement(_.IconButton,{name:"message",size:32,color:'#8BC34A',__source:{fileName:_jsxFileName,lineNumber:170}})),_react.default.createElement(_.Badge,{size:24,content:99,color:'black',textColor:'#E91E63',visible:state.visible,__source:{fileName:_jsxFileName,lineNumber:172}})),_react.default.createElement(_.Button,{text:'Toggle visibility',onPress:function onPress(){return store.set({visible:!state.visible});},__source:{fileName:_jsxFileName,lineNumber:180}}));}));}).add('custom',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:190}},_react.default.createElement(_Header.default,{title:'Custom',__source:{fileName:_jsxFileName,lineNumber:191}}),_react.default.createElement(_reactNative.View,{style:{flex:1,flexDirection:'row',alignItems:'center',marginBottom:80},__source:{fileName:_jsxFileName,lineNumber:193}},_react.default.createElement(_.Badge,{size:14,content:4,left:10,style:{borderRadius:3},__source:{fileName:_jsxFileName,lineNumber:200}},_react.default.createElement(_.Icon,{name:"favorite",size:24,__source:{fileName:_jsxFileName,lineNumber:201}})),_react.default.createElement(_.Badge,{size:14,color:'red',style:{borderRadius:3,height:10},__source:{fileName:_jsxFileName,lineNumber:203}},_react.default.createElement(_.IconButton,{name:"mail",size:32,__source:{fileName:_jsxFileName,lineNumber:204}})),_react.default.createElement(_.Badge,{size:20,content:22,color:'#8BC34A',style:{borderRadius:2,transform:[{rotate:'40deg'}]},__source:{fileName:_jsxFileName,lineNumber:206}},_react.default.createElement(_.IconButton,{name:"album",size:46,__source:{fileName:_jsxFileName,lineNumber:211}})),_react.default.createElement(_.Badge,{size:25,content:'99+',color:'#03A9F4',style:{borderRadius:10,width:40},__source:{fileName:_jsxFileName,lineNumber:213}},_react.default.createElement(_.IconButton,{name:"bookmark",size:64,color:'#E91E63',__source:{fileName:_jsxFileName,lineNumber:218}}))));});exports.default=_default; ================================================ FILE: dist/Components/Badge/Badge.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({content:{alignSelf:'center',alignItems:'center',justifyContent:'center'}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Badge/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _Badge.default;}});var _Badge=_interopRequireDefault(require("./Badge")); ================================================ FILE: dist/Components/Banner/Banner.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _shadow=_interopRequireDefault(require("../../Utils/Shadow/shadow.js"));var _Button=_interopRequireDefault(require("../Button/Button"));var _=require("../../");var _Banner=_interopRequireDefault(require("./Banner.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Banner/Banner.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i1024,width:width});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onLayout",function(event){_this.setState({maxHeight:event.nativeEvent.layout.height},function(){if(_this.props.visible)_this.animateBanner(true);});});return _this;}(0,_createClass2.default)(Banner,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){var visible=this.props.visible;var shouldHide=this.state.shouldHide;if(!prevProps.visible&&visible){this.setState({shouldHide:false});this.animateBanner(true);}else if(prevProps.visible&&!visible||!prevState.shouldHide&&shouldHide){this.animateBanner(false);}}},{key:"componentDidMount",value:function componentDidMount(){if(this.props.visible){this.animateBanner(true);}this._handleLayout();_reactNative.Dimensions.addEventListener('change',this._handleLayout);}},{key:"componentWillUnmount",value:function componentWillUnmount(){_reactNative.Dimensions.removeEventListener('change',this._handleLayout);}},{key:"animateBanner",value:function animateBanner(show){var maxHeight=this.state.maxHeight;var newHeight=show?maxHeight:0;_reactNative.Animated.parallel([_reactNative.Animated.spring(this.state.height,{toValue:newHeight})]).start();}},{key:"_renderActionItems",value:function _renderActionItems(){var _this2=this;var actionItems=this.props.actionItems;if(!actionItems)return null;var platformStyles=this.getPlatformStyles();return _react.default.createElement(_reactNative.View,{style:[_Banner.default.buttons,platformStyles.actions],__source:{fileName:_jsxFileName,lineNumber:87}},actionItems.map(function(item){if(item.name&&item.name.length>0){return _react.default.createElement(_Button.default,{key:item.name,text:item.name,compact:true,type:"text",onPress:function onPress(){item.onPress&&item.onPress();_this2.setState({shouldHide:true});},style:[_Banner.default.button],__source:{fileName:_jsxFileName,lineNumber:91}});}else{return null;}}));}},{key:"_renderContent",value:function _renderContent(){var _this$props=this.props,media=_this$props.media,message=_this$props.message;var platformStyles=this.getPlatformStyles();return _react.default.createElement(_reactNative.View,{style:[_Banner.default.content,platformStyles.content],__source:{fileName:_jsxFileName,lineNumber:116}},media?_react.default.createElement(_reactNative.View,{style:platformStyles.image,__source:{fileName:_jsxFileName,lineNumber:117}},media):null,_react.default.createElement(_.BodyText,{type:2,style:{lineHeight:20,maxWidth:460,flexShrink:1},__source:{fileName:_jsxFileName,lineNumber:118}},message));}},{key:"_renderBody",value:function _renderBody(){var getPlatformStyles=this.getPlatformStyles();return _react.default.createElement(_reactNative.View,{style:[_Banner.default.body,getPlatformStyles.body],__source:{fileName:_jsxFileName,lineNumber:134}},this._renderContent(),this._renderActionItems());}},{key:"getPlatformStyles",value:function getPlatformStyles(){var _this$props2=this.props,mobileLayout=_this$props2.mobileLayout,media=_this$props2.media,singleLine=_this$props2.singleLine;var _this$state=this.state,isWideScreen=_this$state.isWideScreen,width=_this$state.width;var isWeb=_reactNative.Platform.OS=='web';var styles={body:{alignItems:singleLine?'center':'flex-start',justifyContent:singleLine?'space-between':'space-between',marginTop:singleLine?8:24,marginLeft:16,flexDirection:singleLine?'row':'column'},content:{marginBottom:8,marginRight:width<400?8:0},actions:{justifyContent:singleLine?'center':'flex-end',alignItems:singleLine?'center':'flex-end',alignSelf:singleLine?'center':'flex-end',marginRight:8},image:{marginRight:16}};if(isWeb&&isWideScreen&&!mobileLayout){styles={body:{alignItems:singleLine?'center':'flex-start',justifyContent:singleLine?'space-between':'space-between',marginTop:singleLine?8:16,marginLeft:media?16:24,flexDirection:'row'},content:{marginBottom:singleLine?8:16},actions:{justifyContent:singleLine?'center':'flex-end',alignItems:singleLine?'center':'flex-end',alignSelf:singleLine?'center':'flex-end'},image:{marginRight:24}};}return styles;}},{key:"render",value:function render(){var _this$props3=this.props,style=_this$props3.style,position=_this$props3.position,visible=_this$props3.visible,testID=_this$props3.testID;var shouldHide=this.state.shouldHide;var appliedShadow=visible&&!shouldHide?1:0;return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_Banner.default.container,_objectSpread({position:position?position:'relative',height:this.state.height},(0,_shadow.default)(appliedShadow)),style],testID:testID,__source:{fileName:_jsxFileName,lineNumber:211}},_react.default.createElement(_reactNative.View,{onLayout:this._onLayout,__source:{fileName:_jsxFileName,lineNumber:223}},this._renderBody()));}}]);return Banner;}(_react.Component);(0,_defineProperty2.default)(Banner,"propTypes",{mobileLayout:_propTypes.default.bool,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),actionItems:_propTypes.default.array,singleLine:_propTypes.default.bool,media:_propTypes.default.node,visible:_propTypes.default.bool,message:_propTypes.default.string,position:_propTypes.default.string,testID:_propTypes.default.string});var _default=(0,_withTheme.default)(Banner);exports.default=_default; ================================================ FILE: dist/Components/Banner/Banner.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _storiesOf=require("../../storybook/helpers/storiesOf");var _=require("../../");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Banner/Banner.stories.js";var pageWidth=_reactNative.Platform.OS=='web'?400:_reactNative.Dimensions.get('window').width;var _default=(0,_storiesOf.storiesOf)('Components|Banner',module).addParameters({jest:['Banner']}).add('Single line',function(){return _react.default.createElement(_Container.default,{scroll:true,__source:{fileName:_jsxFileName,lineNumber:15}},_react.default.createElement(_Header.default,{title:'Banner Single Line',__source:{fileName:_jsxFileName,lineNumber:16}}),_react.default.createElement(_.Banner,{actionItems:[{name:'Sign in',onPress:function onPress(){return console.log('sign in');}}],singleLine:true,message:'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',visible:true,style:{marginBottom:20},__source:{fileName:_jsxFileName,lineNumber:18}}),_react.default.createElement(_.Banner,{actionItems:[{name:'Continue'}],singleLine:true,message:'New Action here',visible:true,style:{marginBottom:20},__source:{fileName:_jsxFileName,lineNumber:27}}),_react.default.createElement(_.Banner,{actionItems:[{name:'Cancel'},{name:'Continue'}],singleLine:true,message:'Two Actions here',visible:true,__source:{fileName:_jsxFileName,lineNumber:34}}));}).add('Multi line',function(){return _react.default.createElement(_Container.default,{scroll:true,__source:{fileName:_jsxFileName,lineNumber:43}},_react.default.createElement(_Header.default,{title:'Banner Multi line',__source:{fileName:_jsxFileName,lineNumber:44}}),_react.default.createElement(_.Banner,{visible:true,actionItems:[{name:'Continue'},{name:'Sign in'}],message:'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',style:{marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:45}}),_react.default.createElement(_.Banner,{visible:true,actionItems:[{name:'Continue'},{name:'Sign in'}],message:'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco',style:{marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:53}}),_react.default.createElement(_.Banner,{visible:true,actionItems:[{name:'Continue'},{name:'Sign in'}],media:_react.default.createElement(_.Avatar,{type:"icon",content:"notifications",size:40,contentColor:'white',color:'#42a5f5',__source:{fileName:_jsxFileName,lineNumber:66}}),message:'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',style:{marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:62}}),_react.default.createElement(_.Banner,{visible:true,actionItems:[{name:'Continue'},{name:'Sign in'}],media:_react.default.createElement(_.Avatar,{type:"icon",content:"favorite",size:40,contentColor:'white',color:'#E91E63',__source:{fileName:_jsxFileName,lineNumber:84}}),message:'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco',style:{marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:80}}));}).add('With Appbar',function(){return _react.default.createElement(_Container.default,{scroll:true,style:{padding:0},__source:{fileName:_jsxFileName,lineNumber:100}},_react.default.createElement(_reactNative.View,{style:styles.container,__source:{fileName:_jsxFileName,lineNumber:101}},_react.default.createElement(_reactNative.View,{style:styles.body,__source:{fileName:_jsxFileName,lineNumber:102}},_react.default.createElement(_.Appbar,{barType:'normal',title:'Trivia App',navigation:'menu',actionItems:[{name:'search'},{name:'more-vert'}],__source:{fileName:_jsxFileName,lineNumber:103}}),_react.default.createElement(_.Banner,{visible:true,mobileLayout:true,actionItems:[{name:'Fix it'},{name:'Learn more'}],message:'There was a problem processsing a transaction on your card. ',__source:{fileName:_jsxFileName,lineNumber:109}}),_react.default.createElement(_reactNative.View,{style:{marginTop:20,alignItems:'center',paddingLeft:24,paddingRight:24},__source:{fileName:_jsxFileName,lineNumber:117}},_react.default.createElement(_.Heading,{type:4,style:{marginBottom:20},__source:{fileName:_jsxFileName,lineNumber:124}},"Trivia Page Content"),_react.default.createElement(_.BodyText,{text:"Cassowaries cannot fly due to lack of chest bone that supports muscles used for flying.",__source:{fileName:_jsxFileName,lineNumber:127}})))));});exports.default=_default;var styles=_reactNative.StyleSheet.create({container:{zIndex:1,position:'relative'},body:{width:pageWidth,height:500}}); ================================================ FILE: dist/Components/Banner/Banner.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({container:{overflow:'hidden',backgroundColor:'white'},content:{flexDirection:'row',flex:1},buttons:{flexDirection:'row',marginRight:8,marginBottom:8,flexShrink:1,minWidth:'auto'},button:{width:'auto',marginLeft:8}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Banner/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _Banner.default;}});var _Banner=_interopRequireDefault(require("./Banner")); ================================================ FILE: dist/Components/BottomNavigation/BottomNavigation.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.BottomNavContext=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _BottomNavigationItem=_interopRequireDefault(require("./BottomNavigationItem/BottomNavigationItem.js"));var _BottomNavigation=_interopRequireDefault(require("./BottomNavigation.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/BottomNavigation/BottomNavigation.js";var BottomNavContext=_react.default.createContext();exports.BottomNavContext=BottomNavContext;var BottomNavigation=function(_Component){(0,_inherits2.default)(BottomNavigation,_Component);function BottomNavigation(props){var _this;(0,_classCallCheck2.default)(this,BottomNavigation);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(BottomNavigation).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"componentDidMount",function(){_reactNative.Dimensions.addEventListener('change',_this.handleOrientationChange);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"getItemMaxWidth",function(isLandscape,_ref){var height=_ref.height,width=_ref.width;var actionItems=_this.props.actionItems;return(isLandscape?height:width)/actionItems.length;});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"isOrientationLandscape",function(_ref2){var width=_ref2.width,height=_ref2.height;return width>height;});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"handleOrientationChange",function(_ref3){var window=_ref3.window;var isLandscape=_this.isOrientationLandscape(window);var itemMaxWidth=_this.getItemMaxWidth(isLandscape,window);_this.setState({isLandscape:isLandscape,itemMaxWidth:itemMaxWidth});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"handleInternalChange",function(value,backgroundColor){var handleChange=_this.props.handleChange;if(handleChange)handleChange(value);_this.setState({backgroundColor:backgroundColor});});var dimensions=_reactNative.Dimensions.get('window');var _isLandscape=_this.isOrientationLandscape(dimensions);var _itemMaxWidth=_this.getItemMaxWidth(_isLandscape,dimensions);_this.state={backgroundColor:'#2196f3',isLandscape:_isLandscape,itemMaxWidth:_itemMaxWidth};return _this;}(0,_createClass2.default)(BottomNavigation,[{key:"componentWillUnmount",value:function componentWillUnmount(){_reactNative.Dimensions.removeEventListener('change',this.handleOrientationChange);}},{key:"_renderActionItems",value:function _renderActionItems(){var _this2=this;var _this$props=this.props,backgroundColor=_this$props.backgroundColor,actionItems=_this$props.actionItems,showLabels=_this$props.showLabels,horizontalWhenLandscape=_this$props.horizontalWhenLandscape;var _this$state=this.state,isLandscape=_this$state.isLandscape,itemMaxWidth=_this$state.itemMaxWidth;var backgroundColorActual=backgroundColor?backgroundColor:'#2196f3';return _react.default.createElement(BottomNavContext.Provider,{value:{backgroundColor:backgroundColorActual},__source:{fileName:_jsxFileName,lineNumber:82}},actionItems.map(function(item,index){if(!item.props){return _react.default.createElement(_BottomNavigationItem.default,{key:item.label,icon:item.icon,label:item.label,showOneItem:_this2.props.showOneItem,onPress:item.onPress,handleChange:_this2.handleInternalChange,value:index||index===0?index:item.value,showLabel:showLabels,active:index===_this2.props.value,isLandscape:isLandscape,maxWidth:itemMaxWidth,horizontal:horizontalWhenLandscape,__source:{fileName:_jsxFileName,lineNumber:87}});}else{return _react.default.cloneElement(item,{key:item.label,handleChange:item.props.handleChange?item.props.handleChange:_this2.handleInternalChange,value:item.props.value?item.props.value:index,showLabel:_this2.props.showLabels,active:item.props.active?item.props.active:index===_this2.props.value,isLandscape:isLandscape,maxWidth:itemMaxWidth,horizontal:horizontalWhenLandscape});}}));}},{key:"render",value:function render(){var _this$props2=this.props,children=_this$props2.children,backgroundColor=_this$props2.backgroundColor,style=_this$props2.style,testID=_this$props2.testID;var backgroundColorActual=backgroundColor?backgroundColor:'#2196f3';return _react.default.createElement(_reactNative.View,{style:[_BottomNavigation.default.bottomNavigation,{backgroundColor:backgroundColorActual},style],testID:testID,__source:{fileName:_jsxFileName,lineNumber:129}},children?children:this._renderActionItems());}}]);return BottomNavigation;}(_react.Component);(0,_defineProperty2.default)(BottomNavigation,"propTypes",{backgroundColor:_propTypes.default.string,children:_propTypes.default.node,style:_propTypes.default.oneOfType([_propTypes.default.array,_propTypes.default.object]),actionItems:_propTypes.default.array,showOneItem:_propTypes.default.bool,showLabels:_propTypes.default.bool,handleChange:_propTypes.default.func,value:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.number]),horizontalWhenLandscape:_propTypes.default.bool,testID:_propTypes.default.string});(0,_defineProperty2.default)(BottomNavigation,"defaultProps",{showOneItem:false,showLabels:true});var _default=(0,_withTheme.default)(BottomNavigation);exports.default=_default; ================================================ FILE: dist/Components/BottomNavigation/BottomNavigation.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _=require("../../");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storybookState=require("@sambego/storybook-state");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/BottomNavigation/BottomNavigation.stories.js";var store=new _storybookState.Store({one:0,two:0,three:0,four:0,five:0,showOne:0});var _default=(0,_storiesOf.storiesOf)('Components|Bottom Navigation',module).addParameters({jest:['BottomNavigation']}).add('Label',function(){return _react.default.createElement(_Container.default,{scroll:true,__source:{fileName:_jsxFileName,lineNumber:20}},_react.default.createElement(_Header.default,{title:'Bottom Navigation',__source:{fileName:_jsxFileName,lineNumber:21}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:22}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40},value:state.one,handleChange:function handleChange(value){return store.set({one:value});},showAllLabels:true,actionItems:[{label:'Buy'},{label:'Sell'},{label:'Settings'}],__source:{fileName:_jsxFileName,lineNumber:24}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:37}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40},value:state.two,handleChange:function handleChange(value){return store.set({two:value});},showAllLabels:true,backgroundColor:'#E91E63',actionItems:[{label:'Home'},{label:'Favorite'},{label:'Info'},_react.default.createElement(_.BottomNavigationItem,{key:4,label:'Settings',__source:{fileName:_jsxFileName,lineNumber:49}})],__source:{fileName:_jsxFileName,lineNumber:39}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:55}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40},value:state.three,showAllLabels:true,handleChange:function handleChange(value){return store.set({three:value});},backgroundColor:'#9C27B0',horizontalWhenLandscape:true,actionItems:[{label:'Home'},{label:'Favorite'},{label:'Info'},{label:'Profile'},_react.default.createElement(_.BottomNavigationItem,{key:4,label:'Settings',__source:{fileName:_jsxFileName,lineNumber:69}})],__source:{fileName:_jsxFileName,lineNumber:57}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:74}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%'},backgroundColor:'black',value:state.four,handleChange:function handleChange(value){return store.set({four:value});},showAllLabels:true,actionItems:[_react.default.createElement(_.BottomNavigationItem,{key:1,label:'Home',__source:{fileName:_jsxFileName,lineNumber:83}}),_react.default.createElement(_.BottomNavigationItem,{key:2,label:'Favorite',__source:{fileName:_jsxFileName,lineNumber:84}}),_react.default.createElement(_.BottomNavigationItem,{key:3,label:'Info',__source:{fileName:_jsxFileName,lineNumber:85}}),_react.default.createElement(_.BottomNavigationItem,{key:4,label:'Settings',__source:{fileName:_jsxFileName,lineNumber:86}})],__source:{fileName:_jsxFileName,lineNumber:76}});}));}).add('Icons',function(){return _react.default.createElement(_Container.default,{scroll:true,__source:{fileName:_jsxFileName,lineNumber:94}},_react.default.createElement(_Header.default,{title:'Bottom Navigation',__source:{fileName:_jsxFileName,lineNumber:95}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:96}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40},value:state.two,handleChange:function handleChange(value){return store.set({two:value});},showLabels:true,backgroundColor:'#E91E63',actionItems:[{icon:'album'},{icon:'place'},_react.default.createElement(_.BottomNavigationItem,{key:4,icon:'assignment',__source:{fileName:_jsxFileName,lineNumber:107}})],__source:{fileName:_jsxFileName,lineNumber:98}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:112}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40},value:state.one,handleChange:function handleChange(value){return store.set({one:value});},actionItems:[{icon:'home'},{icon:'favorite'},{icon:'info'},_react.default.createElement(_.BottomNavigationItem,{key:4,icon:'settings',__source:{fileName:_jsxFileName,lineNumber:122}})],__source:{fileName:_jsxFileName,lineNumber:114}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:127}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40},value:state.three,handleChange:function handleChange(value){return store.set({three:value});},backgroundColor:'#009688',actionItems:[{icon:'home'},{icon:'attach-money'},{icon:'favorite'},{icon:'info'},_react.default.createElement(_.BottomNavigationItem,{key:4,icon:'settings',__source:{fileName:_jsxFileName,lineNumber:139}})],__source:{fileName:_jsxFileName,lineNumber:129}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:144}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40},value:state.four,handleChange:function handleChange(value){return store.set({four:value});},backgroundColor:'#009688',horizontalWhenLandscape:true,actionItems:[{icon:'home'},{icon:'attach-money'},{icon:'favorite'},{icon:'info'},_react.default.createElement(_.BottomNavigationItem,{key:4,icon:'settings',__source:{fileName:_jsxFileName,lineNumber:157}})],__source:{fileName:_jsxFileName,lineNumber:146}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:163}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%'},backgroundColor:'black',value:state.five,handleChange:function handleChange(value){return store.set({five:value});},actionItems:[_react.default.createElement(_.BottomNavigationItem,{key:1,icon:'home',__source:{fileName:_jsxFileName,lineNumber:171}}),_react.default.createElement(_.BottomNavigationItem,{key:2,icon:'favorite',badgeProps:{size:7,color:'red',right:1,top:2},__source:{fileName:_jsxFileName,lineNumber:172}}),_react.default.createElement(_.BottomNavigationItem,{key:3,icon:'info',__source:{fileName:_jsxFileName,lineNumber:182}}),_react.default.createElement(_.BottomNavigationItem,{key:4,icon:'settings',badgeProps:{content:72,size:14,color:'red'},__source:{fileName:_jsxFileName,lineNumber:183}})],__source:{fileName:_jsxFileName,lineNumber:165}});}));}).add('Icon + Label',function(){return _react.default.createElement(_Container.default,{scroll:true,__source:{fileName:_jsxFileName,lineNumber:200}},_react.default.createElement(_Header.default,{title:'Bottom Navigation',__source:{fileName:_jsxFileName,lineNumber:201}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:202}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40},value:state.two,showLabels:true,handleChange:function handleChange(value){return store.set({two:value});},backgroundColor:'#E91E63',actionItems:[{icon:'home',label:'Home'},{icon:'favorite',label:'Favorite'},{icon:'info',label:'Info'}],__source:{fileName:_jsxFileName,lineNumber:204}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:218}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40},value:state.showOne,showOneItem:true,handleChange:function handleChange(value){return store.set({showOne:value});},backgroundColor:'#E91E63',actionItems:[{icon:'home',label:'Home'},{icon:'favorite',label:'Favorite'},{icon:'info',label:'Info'}],__source:{fileName:_jsxFileName,lineNumber:220}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:234}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40},value:state.one,handleChange:function handleChange(value){return store.set({one:value});},showLabels:true,actionItems:[{icon:'home',label:'Home'},{icon:'favorite',label:'Favorite'},{icon:'info',label:'Info'},_react.default.createElement(_.BottomNavigationItem,{showLabel:true,key:4,icon:'settings',label:'Settings',__source:{fileName:_jsxFileName,lineNumber:245}})],__source:{fileName:_jsxFileName,lineNumber:236}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:255}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40},value:state.three,handleChange:function handleChange(value){return store.set({three:value});},backgroundColor:'#9C27B0',showOneItem:true,actionItems:[{icon:'home',label:'Home'},{icon:'attach-money',label:'Buy'},{icon:'favorite',label:'Favorite'},{icon:'info',label:'Info'},_react.default.createElement(_.BottomNavigationItem,{showOneItem:true,key:4,icon:'settings',label:'Settings',__source:{fileName:_jsxFileName,lineNumber:268}})],__source:{fileName:_jsxFileName,lineNumber:257}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:278}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40},value:state.four,handleChange:function handleChange(value){return store.set({four:value});},backgroundColor:'#9C27B0',horizontalWhenLandscape:true,actionItems:[{icon:'home',label:'Home'},{icon:'attach-money',label:'Buy'},{icon:'favorite',label:'Favorite'},{icon:'info',label:'Info'},_react.default.createElement(_.BottomNavigationItem,{showLabel:true,key:4,icon:'settings',label:'Settings',__source:{fileName:_jsxFileName,lineNumber:291}})],__source:{fileName:_jsxFileName,lineNumber:280}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:301}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%'},backgroundColor:'black',value:state.five,handleChange:function handleChange(value){return store.set({five:value});},actionItems:[_react.default.createElement(_.BottomNavigationItem,{key:1,icon:'home',label:'Home',__source:{fileName:_jsxFileName,lineNumber:309}}),_react.default.createElement(_.BottomNavigationItem,{key:2,icon:'favorite',label:'Favorite',badgeProps:{size:7,color:'red',right:1,top:2},__source:{fileName:_jsxFileName,lineNumber:310}}),_react.default.createElement(_.BottomNavigationItem,{key:3,icon:'info',label:'Info',__source:{fileName:_jsxFileName,lineNumber:321}}),_react.default.createElement(_.BottomNavigationItem,{key:4,icon:'settings',label:'Settings',badgeProps:{content:72,size:14,color:'red'},__source:{fileName:_jsxFileName,lineNumber:322}})],__source:{fileName:_jsxFileName,lineNumber:303}});}));}).add('Landscape',function(){return _react.default.createElement(_Container.default,{scroll:true,__source:{fileName:_jsxFileName,lineNumber:341}},_react.default.createElement(_Header.default,{title:'Bottom Navigation',__source:{fileName:_jsxFileName,lineNumber:342}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:344}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{width:'100%',marginBottom:40},value:state.three,handleChange:function handleChange(value){return store.set({three:value});},backgroundColor:'#9C27B0',actionItems:[{icon:'home',label:'Home'},{icon:'attach-money',label:'Buy'},{icon:'favorite',label:'Favorite'},{icon:'info',label:'Info'},_react.default.createElement(_.BottomNavigationItem,{key:4,icon:'settings',label:'Settings',__source:{fileName:_jsxFileName,lineNumber:356}})],__source:{fileName:_jsxFileName,lineNumber:346}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:365}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{width:'100%',marginBottom:40},value:state.four,handleChange:function handleChange(value){return store.set({four:value});},backgroundColor:'#9C27B0',horizontalWhenLandscape:true,actionItems:[{icon:'home',label:'Home'},{icon:'attach-money',label:'Buy'},{icon:'favorite',label:'Favorite'},{icon:'info',label:'Info'},_react.default.createElement(_.BottomNavigationItem,{key:4,icon:'settings',label:'Settings',__source:{fileName:_jsxFileName,lineNumber:378}})],__source:{fileName:_jsxFileName,lineNumber:367}});}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:387}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{width:'100%'},backgroundColor:'black',value:state.five,handleChange:function handleChange(value){return store.set({five:value});},horizontalWhenLandscape:true,actionItems:[_react.default.createElement(_.BottomNavigationItem,{key:1,icon:'home',label:'Home',__source:{fileName:_jsxFileName,lineNumber:396}}),_react.default.createElement(_.BottomNavigationItem,{key:2,icon:'favorite',label:'Favorite',badgeProps:{size:7,color:'red',right:1,top:2},__source:{fileName:_jsxFileName,lineNumber:397}}),_react.default.createElement(_.BottomNavigationItem,{key:3,icon:'info',label:'Info',__source:{fileName:_jsxFileName,lineNumber:408}}),_react.default.createElement(_.BottomNavigationItem,{key:4,icon:'settings',label:'Settings',badgeProps:{content:72,size:14,color:'red'},__source:{fileName:_jsxFileName,lineNumber:409}})],__source:{fileName:_jsxFileName,lineNumber:389}});}));}).add('Custom',function(){return _react.default.createElement(_Container.default,{scroll:true,__source:{fileName:_jsxFileName,lineNumber:427}},_react.default.createElement(_Header.default,{title:'Bottom Navigation',__source:{fileName:_jsxFileName,lineNumber:428}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:429}},function(state){return _react.default.createElement(_.BottomNavigation,{style:{maxWidth:672,width:'100%',marginBottom:40,borderRadius:50},value:state.one,handleChange:function handleChange(value){return store.set({one:value});},showAllLabels:true,actionItems:[_react.default.createElement(_.BottomNavigationItem,{key:1,icon:'home',label:'Home',rippleProps:{rippleContainerBorderRadius:50},__source:{fileName:_jsxFileName,lineNumber:442}}),_react.default.createElement(_.BottomNavigationItem,{key:2,icon:'favorite',label:'Favorite',rippleProps:{rippleContainerBorderRadius:50},__source:{fileName:_jsxFileName,lineNumber:448}}),_react.default.createElement(_.BottomNavigationItem,{key:3,icon:'info',label:'Settings',rippleProps:{rippleContainerBorderRadius:50},__source:{fileName:_jsxFileName,lineNumber:454}}),_react.default.createElement(_.BottomNavigationItem,{key:4,icon:'settings',label:'Settings',rippleProps:{rippleContainerBorderRadius:50},__source:{fileName:_jsxFileName,lineNumber:460}})],__source:{fileName:_jsxFileName,lineNumber:431}});}));});exports.default=_default; ================================================ FILE: dist/Components/BottomNavigation/BottomNavigation.styles.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _reactNative=require("react-native");var _shadow=_interopRequireDefault(require("../../Utils/Shadow/shadow"));function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0?"calc(100% - "+insetLeft+"px)":'100%';var marginLeft=insetLeft>0?insetLeft:0;return _react.default.createElement(_reactNative.View,(0,_extends2.default)({style:[theme.divider,{height:_reactNative.Platform.OS=='web'?1:_reactNative.StyleSheet.hairlineWidth,marginVertical:marginVerticalImplemented,width:width,marginLeft:marginLeft},style],testID:testID},rest,{__source:{fileName:_jsxFileName,lineNumber:50}}));}},{key:"render",value:function render(){var subheader=this.props.subheader;return subheader?this._renderSubheader():this._renderDivider();}}]);return Divider;}(_react.Component);(0,_defineProperty2.default)(Divider,"propTypes",{style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,marginVertical:_propTypes.default.number,subheader:_propTypes.default.string,insetHeader:_propTypes.default.number,insetLeft:_propTypes.default.number,testID:_propTypes.default.string});var _default=(0,_withTheme.default)(Divider);exports.default=_default; ================================================ FILE: dist/Components/Divider/Divider.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _=require("../../");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Divider/Divider.stories.js";var _default=(0,_storiesOf.storiesOf)('Components|Divider',module).addParameters({jest:['Divider']}).add('Simple',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:11}},_react.default.createElement(_Header.default,{title:'Divider',__source:{fileName:_jsxFileName,lineNumber:12}}),_react.default.createElement(_.Divider,{__source:{fileName:_jsxFileName,lineNumber:14}}),_react.default.createElement(_.Divider,{__source:{fileName:_jsxFileName,lineNumber:15}}),_react.default.createElement(_.Divider,{marginVertical:24,__source:{fileName:_jsxFileName,lineNumber:16}}));}).add('subheader',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:20}},_react.default.createElement(_Header.default,{title:'Divider',__source:{fileName:_jsxFileName,lineNumber:21}}),_react.default.createElement(_.Divider,{subheader:'Subheader',__source:{fileName:_jsxFileName,lineNumber:23}}),_react.default.createElement(_.Divider,{subheader:'Title',insetHeader:8,__source:{fileName:_jsxFileName,lineNumber:24}}),_react.default.createElement(_.Divider,{subheader:'Section',insetHeader:16,marginVertical:24,__source:{fileName:_jsxFileName,lineNumber:25}}));}).add('insetLeft',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:30}},_react.default.createElement(_Header.default,{title:'Inset Left',__source:{fileName:_jsxFileName,lineNumber:31}}),_react.default.createElement(_.List,{subheader:'Favorites',style:{width:300},__source:{fileName:_jsxFileName,lineNumber:33}},_react.default.createElement(_.ListItem,{text:'Janet Perkins',media:_react.default.createElement(_.Avatar,{type:"icon",content:"person",contentColor:'#ececec',color:'#a3a3a3',size:40,__source:{fileName:_jsxFileName,lineNumber:37}}),__source:{fileName:_jsxFileName,lineNumber:34}}),_react.default.createElement(_.ListItem,{text:'Mary Perkins',media:_react.default.createElement(_.Avatar,{type:"icon",content:"person",contentColor:'#ececec',color:'#a3a3a3',size:40,__source:{fileName:_jsxFileName,lineNumber:50}}),__source:{fileName:_jsxFileName,lineNumber:47}}),_react.default.createElement(_.Divider,{insetLeft:20,__source:{fileName:_jsxFileName,lineNumber:59}}),_react.default.createElement(_.ListItem,{text:'Peter Carlsson',media:_react.default.createElement(_.Avatar,{type:"icon",content:"person",contentColor:'#ececec',color:'#a3a3a3',size:40,__source:{fileName:_jsxFileName,lineNumber:63}}),__source:{fileName:_jsxFileName,lineNumber:60}}),_react.default.createElement(_.ListItem,{text:'Trevor Hansen',media:_react.default.createElement(_.Avatar,{type:"icon",content:"person",contentColor:'#ececec',color:'#a3a3a3',size:40,__source:{fileName:_jsxFileName,lineNumber:75}}),__source:{fileName:_jsxFileName,lineNumber:72}}),_react.default.createElement(_.Divider,{insetLeft:20,__source:{fileName:_jsxFileName,lineNumber:84}}),_react.default.createElement(_.ListItem,{text:'Person McPerson',media:_react.default.createElement(_.Avatar,{type:"icon",content:"person",contentColor:'#ececec',color:'#a3a3a3',size:40,__source:{fileName:_jsxFileName,lineNumber:88}}),__source:{fileName:_jsxFileName,lineNumber:85}}),_react.default.createElement(_.ListItem,{text:'Wendy',media:_react.default.createElement(_.Avatar,{type:"icon",content:"person",contentColor:'#ececec',color:'#a3a3a3',size:40,__source:{fileName:_jsxFileName,lineNumber:100}}),__source:{fileName:_jsxFileName,lineNumber:97}})));});exports.default=_default; ================================================ FILE: dist/Components/Divider/Divider.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({subheader:{marginTop:8,color:'rgba(0,0,0,.57)',fontSize:12}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Divider/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _Divider.default;}});var _Divider=_interopRequireDefault(require("./Divider")); ================================================ FILE: dist/Components/Drawer/Drawer.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Drawer=_interopRequireDefault(require("./Drawer.styles"));var _shadow=_interopRequireDefault(require("../../Utils/Shadow/shadow.js"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Drawer/Drawer.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0){if(buttonPositionX>modalMenuWidth/2){menuContainerStyle.right=modalMenuWidth-buttonPositionX-buttonWidth;}else{menuContainerStyle.left=buttonPositionX-10;}}if(tooltip){menuContainerStyle.top=buttonPositionY-initialHeight-12;menuContainerStyle.left=buttonPositionX-8+buttonWidth/2-initialWidth/2;if(tooltipPosition=='bottom'){menuContainerStyle.top=buttonPositionY+initialHeight+(_reactNative.Platform.OS=='web'?4:-4);}else if(tooltipPosition=='right'){menuContainerStyle.top=buttonPositionY-(_reactNative.Platform.OS=='web'?4:8);menuContainerStyle.left=buttonPositionX-8+buttonWidth;}else if(tooltipPosition=='left'){menuContainerStyle.top=buttonPositionY-(_reactNative.Platform.OS=='web'?4:8);menuContainerStyle.left=buttonPositionX-12-initialWidth;}}if(Number.isNaN(menuContainerStyle.top)||Number.isNaN(menuContainerStyle.left)){menuContainerStyle.top=0;menuContainerStyle.left=0;}return _react.default.createElement(_reactNative.View,{testID:testID,__source:{fileName:_jsxFileName,lineNumber:219}},_react.default.createElement(_reactNative.View,{onLayout:this.onButtonLayout,ref:function ref(_ref){_this3.marker=_ref;},style:{alignSelf:'flex-start',width:fullWidth?'100%':'auto'},__source:{fileName:_jsxFileName,lineNumber:220}},button),_react.default.createElement(_ModalMenu.default,{onLayout:this.onModalMenuLayout,animationType:'none',visible:visible,onBackdropPress:onBackdropPress,noBackDrop:noBackDrop,transparent:true,__source:{fileName:_jsxFileName,lineNumber:231}},_react.default.createElement(_reactNative.Animated.View,{style:[_Menu.default.menuContainer,menuContainerStyle,modalMenuStyle],__source:{fileName:_jsxFileName,lineNumber:238}},_react.default.createElement(_reactNative.View,{style:[_Menu.default.menu,{width:sameWidth?buttonWidth:'auto'},menuStyle],onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:240}},_react.default.createElement(_reactNative.ScrollView,{contentContainerStyle:[{paddingVertical:8},contentContainerStyle],__source:{fileName:_jsxFileName,lineNumber:247}},children)))));}}]);return Menu;}(_react.Component);(0,_defineProperty2.default)(Menu,"propTypes",{button:_propTypes.default.node,children:_propTypes.default.node,onHidden:_propTypes.default.func,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,menuStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),sameWidth:_propTypes.default.bool,onBackdropPress:_propTypes.default.func,modalMenuStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),contentContainerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),noBackDrop:_propTypes.default.bool,tooltip:_propTypes.default.bool,tooltipPosition:_propTypes.default.string,testID:_propTypes.default.string,fullWidth:_propTypes.default.bool});var _default=(0,_withTheme.default)(Menu);exports.default=_default; ================================================ FILE: dist/Components/Menu/Menu.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../");var _storybookState=require("@sambego/storybook-state");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Menu/Menu.stories.js";var store=new _storybookState.Store({visibleOne:false,visibleTwo:false,visibleThree:false,visibleFour:false,visibleFive:false});var _default=(0,_storiesOf.storiesOf)('Components|Menu',module).addParameters({jest:['Menu']}).add('Simple',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:21}},_react.default.createElement(_Header.default,{title:'Menu',__source:{fileName:_jsxFileName,lineNumber:22}}),_react.default.createElement(_.Heading,{style:{marginBottom:10},__source:{fileName:_jsxFileName,lineNumber:23}},"On the left"),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:24}},function(state){return _react.default.createElement(_reactNative.View,{style:{marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:26}},_react.default.createElement(_.Menu,{menuStyle:{width:324},visible:state.visibleOne,onBackdropPress:function onBackdropPress(){store.set({visibleOne:false});},button:_react.default.createElement(_.Button,{text:'Show menu',onPress:function onPress(){store.set({visibleOne:!state.visibleOne});},type:"contained",__source:{fileName:_jsxFileName,lineNumber:34}}),__source:{fileName:_jsxFileName,lineNumber:27}},_react.default.createElement(_.MenuItem,{text:'Menu Item 1',onPress:function onPress(){return store.set({visibleOne:false});},__source:{fileName:_jsxFileName,lineNumber:42}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 2',onPress:function onPress(){return store.set({visibleOne:false});},__source:{fileName:_jsxFileName,lineNumber:46}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 3',disabled:true,onPress:function onPress(){return store.set({visibleOne:false});},__source:{fileName:_jsxFileName,lineNumber:50}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 4',onPress:function onPress(){return store.set({visibleOne:false});},__source:{fileName:_jsxFileName,lineNumber:55}})));}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:63}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:65}},_react.default.createElement(_.Menu,{menuStyle:{width:324},visible:state.visibleTwo,onBackdropPress:function onBackdropPress(){store.set({visibleTwo:false});},button:_react.default.createElement(_.IconButton,{name:"more-vert",onPress:function onPress(){store.set({visibleTwo:!state.visibleTwo});},size:24,__source:{fileName:_jsxFileName,lineNumber:73}}),__source:{fileName:_jsxFileName,lineNumber:66}},_react.default.createElement(_.MenuItem,{text:'Menu Item 1',onPress:function onPress(){return store.set({visibleTwo:false});},__source:{fileName:_jsxFileName,lineNumber:81}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 2',onPress:function onPress(){return store.set({visibleTwo:false});},__source:{fileName:_jsxFileName,lineNumber:85}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 3',disabled:true,onPress:function onPress(){return store.set({visibleTwo:false});},__source:{fileName:_jsxFileName,lineNumber:89}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 4',onPress:function onPress(){return store.set({visibleTwo:false});},__source:{fileName:_jsxFileName,lineNumber:94}})));}),_react.default.createElement(_.Heading,{style:{marginBottom:10,marginTop:50,alignSelf:'flex-end'},__source:{fileName:_jsxFileName,lineNumber:102}},"On the Right"),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:106}},function(state){return _react.default.createElement(_reactNative.View,{style:{alignItems:'flex-end',marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:108}},_react.default.createElement(_.Menu,{visible:state.visibleThree,onBackdropPress:function onBackdropPress(){store.set({visibleThree:false});},sameWidth:true,button:_react.default.createElement(_.Button,{text:'Show menu',onPress:function onPress(){store.set({visibleThree:!state.visibleThree});},type:"contained",__source:{fileName:_jsxFileName,lineNumber:116}}),__source:{fileName:_jsxFileName,lineNumber:109}},_react.default.createElement(_.MenuItem,{text:'Menu Item 1',style:{paddingHorizontal:'12%'},onPress:function onPress(){return store.set({visibleThree:false});},__source:{fileName:_jsxFileName,lineNumber:124}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 2',style:{paddingHorizontal:'12%'},onPress:function onPress(){return store.set({visibleThree:false});},__source:{fileName:_jsxFileName,lineNumber:129}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 3',style:{paddingHorizontal:'12%'},disabled:true,onPress:function onPress(){return store.set({visibleThree:false});},__source:{fileName:_jsxFileName,lineNumber:134}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 4',style:{paddingHorizontal:'12%'},onPress:function onPress(){return store.set({visibleThree:false});},__source:{fileName:_jsxFileName,lineNumber:140}})));}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:149}},function(state){return _react.default.createElement(_reactNative.View,{style:{alignItems:'flex-end'},__source:{fileName:_jsxFileName,lineNumber:151}},_react.default.createElement(_.Menu,{visible:state.visibleFour,onBackdropPress:function onBackdropPress(){store.set({visibleFour:false});},button:_react.default.createElement(_.IconButton,{name:"more-vert",onPress:function onPress(){store.set({visibleFour:!state.visibleFour});},size:24,__source:{fileName:_jsxFileName,lineNumber:158}}),__source:{fileName:_jsxFileName,lineNumber:152}},_react.default.createElement(_.MenuItem,{text:'Menu Item 1',onPress:function onPress(){return store.set({visibleFour:false});},__source:{fileName:_jsxFileName,lineNumber:166}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 2',onPress:function onPress(){return store.set({visibleFour:false});},__source:{fileName:_jsxFileName,lineNumber:170}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 3',disabled:true,onPress:function onPress(){return store.set({visibleFour:false});},__source:{fileName:_jsxFileName,lineNumber:174}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 4',onPress:function onPress(){return store.set({visibleFour:false});},__source:{fileName:_jsxFileName,lineNumber:179}})));}));}).add('Scrolling',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:190}},_react.default.createElement(_Header.default,{title:'Menu',__source:{fileName:_jsxFileName,lineNumber:191}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:193}},function(state){return _react.default.createElement(_reactNative.View,{style:{marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:195}},_react.default.createElement(_.Menu,{menuStyle:{width:324,maxHeight:200},visible:state.visibleFive,onBackdropPress:function onBackdropPress(){store.set({visibleFive:false});},button:_react.default.createElement(_.Button,{text:'Show menu',onPress:function onPress(){store.set({visibleFive:!state.visibleFive});},type:"contained",__source:{fileName:_jsxFileName,lineNumber:203}}),__source:{fileName:_jsxFileName,lineNumber:196}},_react.default.createElement(_.MenuItem,{text:'Menu Item 1',onPress:function onPress(){return store.set({visibleFive:false});},__source:{fileName:_jsxFileName,lineNumber:211}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 2',onPress:function onPress(){return store.set({visibleFive:false});},__source:{fileName:_jsxFileName,lineNumber:215}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 3',disabled:true,onPress:function onPress(){return store.set({visibleFive:false});},__source:{fileName:_jsxFileName,lineNumber:219}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 4',onPress:function onPress(){return store.set({visibleFive:false});},__source:{fileName:_jsxFileName,lineNumber:224}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 5',onPress:function onPress(){return store.set({visibleFive:false});},__source:{fileName:_jsxFileName,lineNumber:228}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 6',onPress:function onPress(){return store.set({visibleFive:false});},__source:{fileName:_jsxFileName,lineNumber:232}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 7',disabled:true,onPress:function onPress(){return store.set({visibleFive:false});},__source:{fileName:_jsxFileName,lineNumber:236}}),_react.default.createElement(_.MenuItem,{text:'Menu Item 8',onPress:function onPress(){return store.set({visibleFive:false});},__source:{fileName:_jsxFileName,lineNumber:241}})));}));});exports.default=_default; ================================================ FILE: dist/Components/Menu/Menu.styles.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _reactNative=require("react-native");var _shadow=_interopRequireDefault(require("../../Utils/Shadow/shadow"));function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0){ariaHiddenInstances-=1;if(ariaHiddenInstances===0){ariaAppHider.show(appElement);}}}},{key:"getAnimationStyle",value:function getAnimationStyle(){var _this$props3=this.props,visible=_this$props3.visible,animationType=_this$props3.animationType;var styleFade=this.state.styleFade;if(animationType==='slide'){return[{transform:[{translateY:this.state.slideTranslation.interpolate({inputRange:[0,1],outputRange:[_reactNative.Dimensions.get('window').height,0],extrapolate:'clamp'})}]},styleFade];}if(animationType==='fade'){return[{opacity:this.state.opacityFade},styleFade];}return[_ModalMenu.default[visible?'visible':'hidden']];}},{key:"render",value:function render(){var _this$props4=this.props,containerStyle=_this$props4.containerStyle,onBackdropPress=_this$props4.onBackdropPress,children=_this$props4.children,visible=_this$props4.visible,onLayout=_this$props4.onLayout,noBackDrop=_this$props4.noBackDrop;return _react.default.createElement(_Portal.default,{visible:visible,__source:{fileName:_jsxFileName,lineNumber:265}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,onLayout:onLayout,"aria-modal":"true",style:[_ModalMenu.default.container,{height:'100%',width:'100%',zIndex:visible?10:-10},containerStyle],__source:{fileName:_jsxFileName,lineNumber:266}},noBackDrop?null:_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:280}},_react.default.createElement(_reactNative.View,{style:{height:visible?'100%':0,width:visible?'100%':0,position:'fixed',top:0,zIndex:visible?10:-10},__source:{fileName:_jsxFileName,lineNumber:281}})),children));}}]);return Modal;}(_react.Component);exports.default=Modal;(0,_defineProperty2.default)(Modal,"propTypes",{animationType:_propTypes.default.oneOf(['none','slide','fade']),transparent:_propTypes.default.bool,visible:_propTypes.default.bool,onRequestClose:_reactNative.Platform.isTV||_reactNative.Platform.OS==='android'?_propTypes.default.func.isRequired:_propTypes.default.func,onShow:_propTypes.default.func,onDismiss:_propTypes.default.func,children:_propTypes.default.node.isRequired,ariaHideApp:_propTypes.default.bool,appElement:_propTypes.default.instanceOf(_utils.SafeHTMLElement),containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),onBackdropPress:_propTypes.default.func,onLayout:_propTypes.default.func,noBackDrop:_propTypes.default.bool});(0,_defineProperty2.default)(Modal,"defaultProps",{animationType:'none',transparent:false,visible:true,onShow:function onShow(){},onRequestClose:function onRequestClose(){},onDismiss:function onDismiss(){},ariaHideApp:true,appElement:null}); ================================================ FILE: dist/Components/Menu/ModalMenu/utils.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.SafeHTMLElement=exports.canUseDOM=void 0;var _propTypes=_interopRequireDefault(require("prop-types"));var canUseDOM=!!(typeof window!=='undefined'&&window.document&&window.document.createElement);exports.canUseDOM=canUseDOM;var SafeHTMLElement=canUseDOM?HTMLElement:_propTypes.default.any;exports.SafeHTMLElement=SafeHTMLElement; ================================================ FILE: dist/Components/Menu/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _Menu.default;}});Object.defineProperty(exports,"MenuItem",{enumerable:true,get:function get(){return _MenuItem.default;}});var _Menu=_interopRequireDefault(require("./Menu"));var _MenuItem=_interopRequireDefault(require("./MenuItem")); ================================================ FILE: dist/Components/Modal/Modal.android.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Modal=_interopRequireDefault(require("./Modal.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Modal/Modal.android.js";var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);function Modal(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Modal);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Modal)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{opacityAnimation:new _reactNative.Animated.Value(0),scaleAnimation:new _reactNative.Animated.Value(0.5),animationDuration:200,show:false});return _this;}(0,_createClass2.default)(Modal,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!==prevProps.visible){this.toggle();}}},{key:"toggle",value:function toggle(){var _this2=this;var _this$state=this.state,opacityAnimation=_this$state.opacityAnimation,scaleAnimation=_this$state.scaleAnimation,animationDuration=_this$state.animationDuration,show=_this$state.show;var visible=this.props.visible;var opacity=0;var scale=0;if(visible){opacity=1;scale=1;this.setState({show:!show},function(){_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration+50,useNativeDriver:true}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:animationDuration,useNativeDriver:true})]).start();});}else{_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration,useNativeDriver:true}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:400,useNativeDriver:true})]).start(function(){_this2.setState({show:!show});});}}},{key:"render",value:function render(){var _this$props=this.props,onRequestClose=_this$props.onRequestClose,onShow=_this$props.onShow,onTouchOutside=_this$props.onTouchOutside,containerStyle=_this$props.containerStyle,children=_this$props.children,NativeModalProps=_this$props.NativeModalProps;var _this$state2=this.state,opacityAnimation=_this$state2.opacityAnimation,scaleAnimation=_this$state2.scaleAnimation,show=_this$state2.show;var deviceWidth=_reactNative.Dimensions.get('window').width;var deviceHeight=_reactNative.Dimensions.get('window').height;return _react.default.createElement(_reactNative.Modal,(0,_extends2.default)({animationType:'none',transparent:true,visible:show,onRequestClose:onRequestClose,onShow:onShow},NativeModalProps,{__source:{fileName:_jsxFileName,lineNumber:113}}),_react.default.createElement(_reactNative.View,{style:[_Modal.default.container,containerStyle],__source:{fileName:_jsxFileName,lineNumber:120}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onTouchOutside,__source:{fileName:_jsxFileName,lineNumber:121}},_react.default.createElement(_reactNative.Animated.View,{style:{width:deviceWidth,height:deviceHeight,position:'absolute',backgroundColor:'rgba(0,0,0,.5)',padding:24,opacity:opacityAnimation},__source:{fileName:_jsxFileName,lineNumber:122}})),_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{opacity:opacityAnimation,transform:[{scale:scaleAnimation}]},__source:{fileName:_jsxFileName,lineNumber:133}},children)));}}]);return Modal;}(_react.Component);(0,_defineProperty2.default)(Modal,"propTypes",{buttons:_propTypes.default.element,visible:_propTypes.default.bool,onRequestClose:_propTypes.default.func,onShow:_propTypes.default.func,onTouchOutside:_propTypes.default.func,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),NativeModalProps:_propTypes.default.object,children:_propTypes.default.node});(0,_defineProperty2.default)(Modal,"defaultProps",{visible:false});var _default=(0,_withTheme.default)(Modal);exports.default=_default; ================================================ FILE: dist/Components/Modal/Modal.ios.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Modal=_interopRequireDefault(require("./Modal.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Modal/Modal.ios.js";var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);function Modal(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Modal);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Modal)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{opacityAnimation:new _reactNative.Animated.Value(0),scaleAnimation:new _reactNative.Animated.Value(0.5),animationDuration:200,show:false});return _this;}(0,_createClass2.default)(Modal,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!==prevProps.visible){this.toggle();}}},{key:"toggle",value:function toggle(){var _this2=this;var _this$state=this.state,opacityAnimation=_this$state.opacityAnimation,scaleAnimation=_this$state.scaleAnimation,animationDuration=_this$state.animationDuration,show=_this$state.show;var visible=this.props.visible;var opacity=0;var scale=0;if(visible){opacity=1;scale=1;this.setState({show:!show},function(){_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration+50,useNativeDriver:true}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:animationDuration,useNativeDriver:true})]).start();});}else{_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration,useNativeDriver:true}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:400,useNativeDriver:true})]).start(function(){_this2.setState({show:!show});});}}},{key:"render",value:function render(){var _this$props=this.props,onRequestClose=_this$props.onRequestClose,onShow=_this$props.onShow,onTouchOutside=_this$props.onTouchOutside,containerStyle=_this$props.containerStyle,children=_this$props.children,NativeModalProps=_this$props.NativeModalProps;var _this$state2=this.state,opacityAnimation=_this$state2.opacityAnimation,scaleAnimation=_this$state2.scaleAnimation,show=_this$state2.show;var deviceWidth=_reactNative.Dimensions.get('window').width;var deviceHeight=_reactNative.Dimensions.get('window').height;return _react.default.createElement(_reactNative.Modal,(0,_extends2.default)({animationType:'none',transparent:true,visible:show,onRequestClose:onRequestClose,onShow:onShow},NativeModalProps,{__source:{fileName:_jsxFileName,lineNumber:113}}),_react.default.createElement(_reactNative.View,{style:[_Modal.default.container,containerStyle],__source:{fileName:_jsxFileName,lineNumber:120}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onTouchOutside,__source:{fileName:_jsxFileName,lineNumber:121}},_react.default.createElement(_reactNative.Animated.View,{style:{width:deviceWidth,height:deviceHeight,position:'absolute',backgroundColor:'rgba(0,0,0,.5)',padding:24,opacity:opacityAnimation},__source:{fileName:_jsxFileName,lineNumber:122}})),_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{opacity:opacityAnimation,transform:[{scale:scaleAnimation}]},__source:{fileName:_jsxFileName,lineNumber:133}},children)));}}]);return Modal;}(_react.Component);(0,_defineProperty2.default)(Modal,"propTypes",{buttons:_propTypes.default.element,visible:_propTypes.default.bool,onRequestClose:_propTypes.default.func,onShow:_propTypes.default.func,onTouchOutside:_propTypes.default.func,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),NativeModalProps:_propTypes.default.object,children:_propTypes.default.node});(0,_defineProperty2.default)(Modal,"defaultProps",{visible:false});var _default=(0,_withTheme.default)(Modal);exports.default=_default; ================================================ FILE: dist/Components/Modal/Modal.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _Modal=_interopRequireDefault(require("./Modal.web"));var _default=_Modal.default;exports.default=_default; ================================================ FILE: dist/Components/Modal/Modal.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({container:{flex:1,padding:24,justifyContent:'center',alignItems:'center'}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Modal/Modal.web.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _modalEnhancedReactNativeWeb=_interopRequireDefault(require("modal-enhanced-react-native-web"));var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Modal=_interopRequireDefault(require("./Modal.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Modal/Modal.web.js";var ImplementedModal=_reactNative.Platform.OS=='web'?_modalEnhancedReactNativeWeb.default:_reactNative.Modal;var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);function Modal(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Modal);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Modal)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{opacityAnimation:new _reactNative.Animated.Value(0),scaleAnimation:new _reactNative.Animated.Value(0.5),animationDuration:200,show:false});return _this;}(0,_createClass2.default)(Modal,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!==prevProps.visible){this.toggle();}}},{key:"toggle",value:function toggle(){var _this2=this;var _this$state=this.state,opacityAnimation=_this$state.opacityAnimation,scaleAnimation=_this$state.scaleAnimation,animationDuration=_this$state.animationDuration,show=_this$state.show;var visible=this.props.visible;var opacity=0;var scale=0;if(visible){opacity=1;scale=1;this.setState({show:!show},function(){_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration+50,useNativeDriver:true}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:animationDuration,useNativeDriver:true})]).start();});}else{_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration,useNativeDriver:true}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:400,useNativeDriver:true})]).start(function(){_this2.setState({show:!show});});}}},{key:"render",value:function render(){var _this$props=this.props,onRequestClose=_this$props.onRequestClose,onShow=_this$props.onShow,onTouchOutside=_this$props.onTouchOutside,containerStyle=_this$props.containerStyle,children=_this$props.children,NativeModalProps=_this$props.NativeModalProps;var _this$state2=this.state,opacityAnimation=_this$state2.opacityAnimation,scaleAnimation=_this$state2.scaleAnimation,show=_this$state2.show;var deviceWidth=_reactNative.Dimensions.get('window').width;var deviceHeight=_reactNative.Dimensions.get('window').height;return _react.default.createElement(ImplementedModal,(0,_extends2.default)({animationType:'none',transparent:true,visible:show,onRequestClose:onRequestClose,onShow:onShow},NativeModalProps,{__source:{fileName:_jsxFileName,lineNumber:116}}),_react.default.createElement(_reactNative.View,{style:[_Modal.default.container,containerStyle],__source:{fileName:_jsxFileName,lineNumber:123}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onTouchOutside,__source:{fileName:_jsxFileName,lineNumber:124}},_react.default.createElement(_reactNative.Animated.View,{style:{width:deviceWidth,height:deviceHeight,position:'absolute',backgroundColor:'rgba(0,0,0,.5)',padding:24,opacity:opacityAnimation},__source:{fileName:_jsxFileName,lineNumber:125}})),_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{opacity:opacityAnimation,transform:[{scale:scaleAnimation}]},__source:{fileName:_jsxFileName,lineNumber:136}},children)));}}]);return Modal;}(_react.Component);(0,_defineProperty2.default)(Modal,"propTypes",{buttons:_propTypes.default.element,visible:_propTypes.default.bool,onRequestClose:_propTypes.default.func,onShow:_propTypes.default.func,onTouchOutside:_propTypes.default.func,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),NativeModalProps:_propTypes.default.object,children:_propTypes.default.node});(0,_defineProperty2.default)(Modal,"defaultProps",{visible:false});var _default=(0,_withTheme.default)(Modal);exports.default=_default; ================================================ FILE: dist/Components/Paper/Paper.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _index=require("../../index");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Paper/Paper.js";var Paper=function(_Component){(0,_inherits2.default)(Paper,_Component);function Paper(){(0,_classCallCheck2.default)(this,Paper);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Paper).apply(this,arguments));}(0,_createClass2.default)(Paper,[{key:"render",value:function render(){var _this$props=this.props,style=_this$props.style,theme=_this$props.theme,children=_this$props.children,userShadow=_this$props.shadow,radius=_this$props.radius,testID=_this$props.testID,props=(0,_objectWithoutProperties2.default)(_this$props,["style","theme","children","shadow","radius","testID"]);var shadows=(0,_index.shadow)(4);if(userShadow>-1&&userShadow<25){shadows=(0,_index.shadow)(userShadow);}var borderRadius=radius?radius:2;return _react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true,style:[theme.paper,shadows,{borderRadius:borderRadius},style],testID:testID},props,{__source:{fileName:_jsxFileName,lineNumber:35}}),children);}}]);return Paper;}(_react.Component);(0,_defineProperty2.default)(Paper,"propTypes",{children:_propTypes.default.node,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,shadow:_propTypes.default.number,radius:_propTypes.default.number,testID:_propTypes.default.string});var _default=(0,_withTheme.default)(Paper);exports.default=_default; ================================================ FILE: dist/Components/Paper/Paper.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _=require("../../");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Paper/Paper.stories.js";var _default=(0,_storiesOf.storiesOf)('Components|Paper',module).addParameters({jest:['Paper']}).add('Elevation',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:11}},_react.default.createElement(_Header.default,{title:'Paper',__source:{fileName:_jsxFileName,lineNumber:12}}),_react.default.createElement(_.Paper,{style:{padding:8,height:100,width:100,alignItems:'center'},elevation:2,__source:{fileName:_jsxFileName,lineNumber:13}}),_react.default.createElement(_.Paper,{style:{padding:8,height:100,width:100,marginTop:30,alignItems:'center',justifyContent:'center'},elevation:4,__source:{fileName:_jsxFileName,lineNumber:22}}),_react.default.createElement(_.Paper,{style:{padding:8,height:100,width:100,marginTop:30,alignItems:'center',justifyContent:'center'},elevation:8,__source:{fileName:_jsxFileName,lineNumber:33}}));}).add('Roundness',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:47}},_react.default.createElement(_Header.default,{title:'Roudness',__source:{fileName:_jsxFileName,lineNumber:48}}),_react.default.createElement(_.Paper,{style:{padding:8,height:100,width:100,alignItems:'center'},elevation:4,radius:2,__source:{fileName:_jsxFileName,lineNumber:49}}),_react.default.createElement(_.Paper,{style:{padding:8,height:100,width:100,marginTop:30,alignItems:'center',justifyContent:'center'},elevation:4,radius:8,__source:{fileName:_jsxFileName,lineNumber:59}}));});exports.default=_default; ================================================ FILE: dist/Components/Paper/Paper.styles.js ================================================ ================================================ FILE: dist/Components/Progress/ProgressBar/ProgressBar.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _propTypes=_interopRequireDefault(require("prop-types"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _ProgressBar=_interopRequireDefault(require("./ProgressBar.styles"));var _color=_interopRequireDefault(require("color"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Progress/ProgressBar/ProgressBar.js";var ProgressBar=function(_PureComponent){(0,_inherits2.default)(ProgressBar,_PureComponent);function ProgressBar(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,ProgressBar);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(ProgressBar)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{indicatorPosition:new _reactNative.Animated.Value(_this.props.indicatorStartPosition),indicatorScaleX:new _reactNative.Animated.Value(1),indicatorWidth:new _reactNative.Animated.Value(0),trackScaleY:new _reactNative.Animated.Value(0),trackOpacity:new _reactNative.Animated.Value(0),trackHeight:0,trackWidth:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onTrackLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({trackWidth:width,trackHeight:height});});return _this;}(0,_createClass2.default)(ProgressBar,[{key:"componentDidMount",value:function componentDidMount(){var _this$props=this.props,visible=_this$props.visible,determinate=_this$props.determinate;if(visible){this.animateTrackHeight();}if(determinate){this.startDeterminateAnimation();}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var _this$props2=this.props,value=_this$props2.value,visible=_this$props2.visible,determinate=_this$props2.determinate;if(value!=prevProps.value&&determinate){this.startDeterminateAnimation();}if(visible&&!prevProps.visible||!visible&&prevProps.visible){this.animateTrackHeight();}}},{key:"animateTrackHeight",value:function animateTrackHeight(){var _this2=this;var _this$state=this.state,trackScaleY=_this$state.trackScaleY,trackOpacity=_this$state.trackOpacity;var _this$props3=this.props,visible=_this$props3.visible,determinate=_this$props3.determinate;var scale=visible?1:0;var opacity=visible?1:0;_reactNative.Animated.parallel([_reactNative.Animated.timing(trackScaleY,{toValue:scale,duration:300}),_reactNative.Animated.timing(trackOpacity,{toValue:opacity,duration:300})]).start(function(){if(determinate){_this2.startDeterminateAnimation();}else{_this2.startIndeterminateAnimation();}});}},{key:"startDeterminateAnimation",value:function startDeterminateAnimation(){var _this3=this;var _this$state2=this.state,indicatorWidth=_this$state2.indicatorWidth,trackWidth=_this$state2.trackWidth;var _this$props4=this.props,animationDuration=_this$props4.animationDuration,value=_this$props4.value;if(trackWidth==0){setTimeout(function(){return _this3.startDeterminateAnimation();},100);}_reactNative.Animated.parallel([_reactNative.Animated.timing(indicatorWidth,{toValue:trackWidth*(value/100),duration:animationDuration})]).start();}},{key:"startIndeterminateAnimation",value:function startIndeterminateAnimation(){var _this4=this;var _this$state3=this.state,indicatorPosition=_this$state3.indicatorPosition,indicatorScaleX=_this$state3.indicatorScaleX,trackWidth=_this$state3.trackWidth;var _this$props5=this.props,animationDuration=_this$props5.animationDuration,animationEasing=_this$props5.animationEasing;if(trackWidth==0){setTimeout(function(){return _this4.startIndeterminateAnimation();},100);}_reactNative.Animated.loop(_reactNative.Animated.parallel([_reactNative.Animated.timing(indicatorPosition,{toValue:trackWidth,duration:animationDuration,animationEasing:animationEasing,useNativeDriver:true}),_reactNative.Animated.timing(indicatorScaleX,{toValue:2,duration:animationDuration/4,animationEasing:animationEasing,useNativeDriver:true})]),{iterations:-1}).start();}},{key:"render",value:function render(){var _this$props6=this.props,height=_this$props6.height,color=_this$props6.color,trackStyle=_this$props6.trackStyle,determinate=_this$props6.determinate,theme=_this$props6.theme,testID=_this$props6.testID;var _this$state4=this.state,indicatorPosition=_this$state4.indicatorPosition,indicatorScaleX=_this$state4.indicatorScaleX,indicatorWidth=_this$state4.indicatorWidth,trackScaleY=_this$state4.trackScaleY,trackOpacity=_this$state4.trackOpacity;var trackColor=color?(0,_color.default)(color).fade(0.4).string():(0,_color.default)(theme.primary.main).fade(0.4).string();var indicatorColor=color?color:theme.primary.main;return _react.default.createElement(_reactNative.Animated.View,{onLayout:this.onTrackLayout,style:[_ProgressBar.default.track,{backgroundColor:trackColor,height:height?height:4,opacity:trackOpacity,transform:[{scaleY:trackScaleY}]},trackStyle],testID:testID,__source:{fileName:_jsxFileName,lineNumber:164}},_react.default.createElement(_reactNative.Animated.View,{style:[_ProgressBar.default.indicator,{backgroundColor:indicatorColor,height:height?height:4,width:determinate?indicatorWidth:112,transform:[{translateX:indicatorPosition},{scaleX:indicatorScaleX}]}],__source:{fileName:_jsxFileName,lineNumber:177}}));}}]);return ProgressBar;}(_react.PureComponent);(0,_defineProperty2.default)(ProgressBar,"propTypes",{color:_propTypes.default.string,height:_propTypes.default.number,trackStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),determinate:_propTypes.default.bool,indicatorStartPosition:_propTypes.default.number,animationEasing:_propTypes.default.func,animationDuration:_propTypes.default.number,value:_propTypes.default.number,visible:_propTypes.default.bool,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,testID:_propTypes.default.string});(0,_defineProperty2.default)(ProgressBar,"defaultProps",{animationDuration:1000,indicatorStartPosition:0,animationEasing:_reactNative.Easing.bezier(0.65,0.815,0.735,0.395)});var _default=(0,_withTheme.default)(ProgressBar);exports.default=_default; ================================================ FILE: dist/Components/Progress/ProgressBar/ProgressBar.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../..");var _storybookState=require("@sambego/storybook-state");var _Header=_interopRequireDefault(require("../../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../../storybook/components/Container"));var _storiesOf=require("../../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Progress/ProgressBar/ProgressBar.stories.js";var store=new _storybookState.Store({value3:30,visible2:true,circleValue3:40});var _default=(0,_storiesOf.storiesOf)('Components|Progress/ProgressBar',module).addParameters({jest:['ProgressBar']}).add('Indeterminate',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:19}},_react.default.createElement(_Header.default,{title:'Progress Bar',__source:{fileName:_jsxFileName,lineNumber:20}}),_react.default.createElement(_.ProgressBar,{visible:true,__source:{fileName:_jsxFileName,lineNumber:22}}),_react.default.createElement(_.ProgressBar,{visible:true,indicatorStartPosition:100,trackStyle:{marginTop:20},color:'#E91E63',__source:{fileName:_jsxFileName,lineNumber:23}}),_react.default.createElement(_.ProgressBar,{visible:true,indicatorStartPosition:100,trackStyle:{marginTop:20},color:'#009688',animationDuration:2000,__source:{fileName:_jsxFileName,lineNumber:29}}),_react.default.createElement(_.ProgressBar,{visible:true,indicatorStartPosition:100,trackStyle:{marginTop:20},color:'#673AB7',animationDuration:4000,__source:{fileName:_jsxFileName,lineNumber:36}}),_react.default.createElement(_.ProgressBar,{visible:true,indicatorStartPosition:100,trackStyle:{marginTop:20},color:'#8BC34A',animationDuration:3000,height:5,__source:{fileName:_jsxFileName,lineNumber:43}}),_react.default.createElement(_.ProgressBar,{visible:true,indicatorStartPosition:100,trackStyle:{marginTop:20},color:'#03A9F4',animationDuration:4000,height:10,__source:{fileName:_jsxFileName,lineNumber:51}}));}).add('Determinate',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:62}},_react.default.createElement(_Header.default,{title:'Progress Bar',__source:{fileName:_jsxFileName,lineNumber:63}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:65}},function(state){return _react.default.createElement(_reactNative.View,{style:{marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:67}},_react.default.createElement(_.ProgressBar,{determinate:true,value:state.value3,animationDuration:2000,trackStyle:{marginTop:40},visible:state.visible2,__source:{fileName:_jsxFileName,lineNumber:68}}),_react.default.createElement(_.Button,{type:"outlined",style:{marginTop:20},text:' Change Value',onPress:function onPress(){store.set({value3:Math.floor(Math.random()*Math.floor(100))});},__source:{fileName:_jsxFileName,lineNumber:75}}),_react.default.createElement(_.Button,{type:"outlined",style:{marginTop:20},animationDuration:500,text:'Hide / Show Animate',onPress:function onPress(){store.set({visible2:!state.visible2});},__source:{fileName:_jsxFileName,lineNumber:86}}));}),_react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:101}},_react.default.createElement(_.ProgressBar,{determinate:true,value:25,color:'#E91E63',animationDuration:2000,trackStyle:{marginBottom:40},visible:true,__source:{fileName:_jsxFileName,lineNumber:102}}),_react.default.createElement(_.ProgressBar,{determinate:true,value:50,color:'#009688',animationDuration:500,trackStyle:{marginBottom:40},visible:true,__source:{fileName:_jsxFileName,lineNumber:110}}),_react.default.createElement(_.ProgressBar,{determinate:true,value:75,color:'#673AB7',animationDuration:400,trackStyle:{marginBottom:40},visible:true,height:5,__source:{fileName:_jsxFileName,lineNumber:118}})));});exports.default=_default; ================================================ FILE: dist/Components/Progress/ProgressBar/ProgressBar.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({track:{width:'100%',position:'relative',overflow:'hidden'}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Progress/ProgressBar/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _ProgressBar.default;}});var _ProgressBar=_interopRequireDefault(require("./ProgressBar")); ================================================ FILE: dist/Components/Progress/ProgressCircle/ProgressCircle.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _propTypes=_interopRequireDefault(require("prop-types"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _ProgressCircleDeterminate=_interopRequireDefault(require("./ProgressCircleDeterminate"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Progress/ProgressCircle/ProgressCircle.js";var ProgressCircle=function(_PureComponent){(0,_inherits2.default)(ProgressCircle,_PureComponent);function ProgressCircle(props){var _this;(0,_classCallCheck2.default)(this,ProgressCircle);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(ProgressCircle).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{frames:60*_this.props.animationDuration/1000,progress:new _reactNative.Animated.Value(0)});return _this;}(0,_createClass2.default)(ProgressCircle,[{key:"componentDidMount",value:function componentDidMount(){var _this$props=this.props,visible=_this$props.visible,determinate=_this$props.determinate;if(visible&&!determinate){this.startIndeterminateAnimation();}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var _this$props2=this.props,visible=_this$props2.visible,determinate=_this$props2.determinate;if(visible&&!prevProps.visible||!visible&&prevProps.visible){if(determinate)this.startIndeterminateAnimation();}}},{key:"startIndeterminateAnimation",value:function startIndeterminateAnimation(){var progress=this.state.progress;var _this$props3=this.props,animationEasing=_this$props3.animationEasing,animationDuration=_this$props3.animationDuration;_reactNative.Animated.loop(_reactNative.Animated.timing(progress,{duration:animationDuration,easing:animationEasing,toValue:1,useNativeDriver:true}),{iterations:-1}).start();}},{key:"stopAnimation",value:function stopAnimation(){this.state.progress.stopAnimation();}},{key:"getLayerStyle",value:function getLayerStyle(){var size=this.props.size;var progress=this.state.progress;var inputRange=[0,1];var outputRange=[0+30+15+'deg',2*360+30+15+'deg'];var rotate={rotate:progress.interpolate({inputRange:inputRange,outputRange:outputRange})};return{width:size,height:size,transform:[rotate]};}},{key:"getViewportStyle",value:function getViewportStyle(){var size=this.props.size;var progress=this.state.progress;var rotate={rotate:progress.interpolate({inputRange:this.getInputRange(progress),outputRange:this.getOutputRange(progress)})};return{width:size,height:size,transform:[rotate]};}},{key:"getInputRange",value:function getInputRange(){var frames=this.state.frames;var inputRange=Array.from(new Array(frames),function(undefined,frameIndex){return frameIndex/(frames-1);});return inputRange;}},{key:"getOutputRange",value:function getOutputRange(){var easing=_reactNative.Easing.bezier(0.4,0.0,0.7,1.0);var frames=this.state.frames;var outputRange=Array.from(new Array(frames),function(undefined,frameIndex){var progress=2*frameIndex/(frames-1);var rotation=-(180-15);if(progress>1.0){progress=2.0-progress;}var direction=+1;return direction*(180-30)*easing(progress)+rotation+'deg';});return outputRange;}},{key:"render",value:function render(){var _this$props4=this.props,style=_this$props4.style,size=_this$props4.size,color=_this$props4.color,determinate=_this$props4.determinate,widthOfBorder=_this$props4.widthOfBorder,testID=_this$props4.testID;var layerStyle=this.getLayerStyle();var viewportStyle=this.getViewportStyle();var containerStyle={width:size,height:size/2,overflow:'hidden'};var lineStyle={width:size,height:size,borderColor:color,borderWidth:size/widthOfBorder,borderRadius:size/2};if(determinate)return _react.default.createElement(_ProgressCircleDeterminate.default,(0,_extends2.default)({},this.props,{__source:{fileName:_jsxFileName,lineNumber:177}}));return _react.default.createElement(_reactNative.View,{style:style,testID:testID,__source:{fileName:_jsxFileName,lineNumber:180}},_react.default.createElement(_reactNative.Animated.View,{style:layerStyle,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:181}},_react.default.createElement(_reactNative.Animated.View,{style:containerStyle,collapsable:false,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:182}},_react.default.createElement(_reactNative.Animated.View,{style:viewportStyle,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:186}},_react.default.createElement(_reactNative.Animated.View,{style:containerStyle,collapsable:false,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:187}},_react.default.createElement(_reactNative.Animated.View,{style:lineStyle,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:191}}))))));}}]);return ProgressCircle;}(_react.PureComponent);(0,_defineProperty2.default)(ProgressCircle,"propTypes",{color:_propTypes.default.string,size:_propTypes.default.number,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),animationDuration:_propTypes.default.number,animationEasing:_propTypes.default.func,visible:_propTypes.default.bool,determinate:_propTypes.default.bool,widthOfBorder:_propTypes.default.number,testID:_propTypes.default.string});(0,_defineProperty2.default)(ProgressCircle,"defaultProps",{color:'rgb(0, 0, 0)',size:48,animationEasing:_reactNative.Easing.linear,animationDuration:2400,visible:true,determinate:false,widthOfBorder:10});var _default=(0,_withTheme.default)(ProgressCircle);exports.default=_default; ================================================ FILE: dist/Components/Progress/ProgressCircle/ProgressCircle.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../..");var _storybookState=require("@sambego/storybook-state");var _Header=_interopRequireDefault(require("../../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../../storybook/components/Container"));var _storiesOf=require("../../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Progress/ProgressCircle/ProgressCircle.stories.js";var store=new _storybookState.Store({value3:30,visible2:true,circleValue3:40});var _default=(0,_storiesOf.storiesOf)('Components|Progress/ProgressCircle',module).addParameters({jest:['ProgressCircle']}).add('Indeterminate',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:20}},_react.default.createElement(_Header.default,{title:'Progress Circle',__source:{fileName:_jsxFileName,lineNumber:21}}),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap',marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:23}},_react.default.createElement(_.ProgressCircle,{__source:{fileName:_jsxFileName,lineNumber:25}}),_react.default.createElement(_.ProgressCircle,{color:'#03A9F4',__source:{fileName:_jsxFileName,lineNumber:26}}),_react.default.createElement(_.ProgressCircle,{color:'#E91E63',__source:{fileName:_jsxFileName,lineNumber:27}}),_react.default.createElement(_.ProgressCircle,{color:'#009688',__source:{fileName:_jsxFileName,lineNumber:28}})),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap',marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:30}},_react.default.createElement(_.ProgressCircle,{animationDuration:4800,__source:{fileName:_jsxFileName,lineNumber:32}}),_react.default.createElement(_.ProgressCircle,{color:'#03A9F4',animationDuration:4800,__source:{fileName:_jsxFileName,lineNumber:33}}),_react.default.createElement(_.ProgressCircle,{color:'#E91E63',animationDuration:4800,__source:{fileName:_jsxFileName,lineNumber:34}}),_react.default.createElement(_.ProgressCircle,{color:'#009688',animationDuration:4800,__source:{fileName:_jsxFileName,lineNumber:35}})),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap',marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:37}},_react.default.createElement(_.ProgressCircle,{animationDuration:1200,__source:{fileName:_jsxFileName,lineNumber:39}}),_react.default.createElement(_.ProgressCircle,{color:'#03A9F4',animationDuration:1200,__source:{fileName:_jsxFileName,lineNumber:40}}),_react.default.createElement(_.ProgressCircle,{color:'#E91E63',animationDuration:1200,__source:{fileName:_jsxFileName,lineNumber:41}}),_react.default.createElement(_.ProgressCircle,{color:'#009688',animationDuration:1200,__source:{fileName:_jsxFileName,lineNumber:42}})));}).add('Determinate',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:47}},_react.default.createElement(_Header.default,{title:'Progress Circle',__source:{fileName:_jsxFileName,lineNumber:48}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:49}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'column',marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:51}},_react.default.createElement(_.ProgressCircle,{value:state.circleValue3,size:48,thickness:4,color:"#2b80ff",unfilledColor:"#f2f2f2",animationMethod:"timing",animationConfig:{speed:1},shouldAnimateFirstValue:true,determinate:true,__source:{fileName:_jsxFileName,lineNumber:52}}),_react.default.createElement(_.Button,{type:"outlined",style:{marginTop:20},text:'Change Value',onPress:function onPress(){store.set({circleValue3:Math.floor(Math.random()*Math.floor(100))});},__source:{fileName:_jsxFileName,lineNumber:64}}));}),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row',marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:77}},_react.default.createElement(_.ProgressCircle,{value:25,size:48,thickness:4,color:"#E91E63",animationMethod:"timing",animationConfig:{duration:1000},shouldAnimateFirstValue:true,determinate:true,__source:{fileName:_jsxFileName,lineNumber:78}}),_react.default.createElement(_.ProgressCircle,{value:50,size:48,thickness:4,color:"#E91E63",animationMethod:"timing",animationConfig:{duration:1000},shouldAnimateFirstValue:true,determinate:true,__source:{fileName:_jsxFileName,lineNumber:88}}),_react.default.createElement(_.ProgressCircle,{value:75,size:48,thickness:4,color:"#E91E63",animationMethod:"timing",animationConfig:{duration:1000},shouldAnimateFirstValue:true,determinate:true,__source:{fileName:_jsxFileName,lineNumber:98}}),_react.default.createElement(_.ProgressCircle,{value:100,size:48,thickness:4,color:"#E91E63",animationMethod:"timing",animationConfig:{duration:1000},shouldAnimateFirstValue:true,determinate:true,__source:{fileName:_jsxFileName,lineNumber:108}})),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row'},__source:{fileName:_jsxFileName,lineNumber:119}},_react.default.createElement(_.ProgressCircle,{value:25,size:48,thickness:8,color:"#009688",animationMethod:"timing",animationConfig:{duration:1000},shouldAnimateFirstValue:true,determinate:true,__source:{fileName:_jsxFileName,lineNumber:120}}),_react.default.createElement(_.ProgressCircle,{value:50,size:48,thickness:8,color:"#009688",animationMethod:"timing",animationConfig:{duration:1000},shouldAnimateFirstValue:true,determinate:true,__source:{fileName:_jsxFileName,lineNumber:130}}),_react.default.createElement(_.ProgressCircle,{value:75,size:48,thickness:8,color:"#009688",animationMethod:"timing",animationConfig:{duration:1000},shouldAnimateFirstValue:true,determinate:true,__source:{fileName:_jsxFileName,lineNumber:140}}),_react.default.createElement(_.ProgressCircle,{value:100,size:48,thickness:8,color:"#009688",animationMethod:"timing",animationConfig:{duration:1000},shouldAnimateFirstValue:true,determinate:true,__source:{fileName:_jsxFileName,lineNumber:150}})));});exports.default=_default; ================================================ FILE: dist/Components/Progress/ProgressCircle/ProgressCircle.styles.js ================================================ ================================================ FILE: dist/Components/Progress/ProgressCircle/ProgressCircleDeterminate.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Progress/ProgressCircle/ProgressCircleDeterminate.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0&&arguments[0]!==undefined?arguments[0]:_this.props.value;_this.props.onChange();if(value.constructor.name==='AnimatedValue'){return;}if(_this.getAnimationMethod()){_this.animateChange(value);}else{_this.state.animatedValue.setValue(value);}});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animateChange",function(value){return _reactNative.Animated[_this.getAnimationMethod()](_this.state.animatedValue,_objectSpread({toValue:value/100,useNativeDriver:true},_this.props.animationConfig)).start(_this.props.onChangeAnimationEnd);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"renderHalfCircle",function(){var _ref=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{},_ref$isFlipped=_ref.isFlipped,isFlipped=_ref$isFlipped===void 0?false:_ref$isFlipped;var _this$props=_this.props,size=_this$props.size,color=_this$props.color,thickness=_this$props.thickness,value=_this$props.value;var valueToInterpolate=value.constructor.name==='AnimatedValue'?value:_this.state.animatedValue;return _react.default.createElement(_reactNative.View,{pointerEvents:"none",style:[_this.getHalfCircleContainerStyle(),{transform:[{scaleX:isFlipped?-1:1}]}],__source:{fileName:_jsxFileName,lineNumber:114}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{width:size,height:size,transform:[{rotate:valueToInterpolate.interpolate({inputRange:isFlipped?[0,0.5]:[0.5,1],outputRange:isFlipped?['180deg','0deg']:['-180deg','0deg'],extrapolate:'clamp'})}]},__source:{fileName:_jsxFileName,lineNumber:120}},_react.default.createElement(_reactNative.View,{style:_this.getHalfCircleContainerStyle(),__source:{fileName:_jsxFileName,lineNumber:137}},_react.default.createElement(_reactNative.View,{style:[_this.getFullCircleStyle(),{borderWidth:thickness,borderColor:color}],__source:{fileName:_jsxFileName,lineNumber:138}}))));});return _this;}(0,_createClass2.default)(ProgressCircleDeterminate,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,shouldAnimateFirstValue=_this$props2.shouldAnimateFirstValue,value=_this$props2.value;if(shouldAnimateFirstValue)this.animateChange(value);}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var value=this.props.value;if(value!=prevProps.value){this.handleChange(value);}}},{key:"getFullCircleStyle",value:function getFullCircleStyle(){return{width:this.props.size,height:this.props.size,borderRadius:this.props.size/2};}},{key:"getHalfCircleContainerStyle",value:function getHalfCircleContainerStyle(){return{width:this.props.size/2,height:this.props.size,overflow:'hidden'};}},{key:"getAnimationMethod",value:function getAnimationMethod(){return this.ANIMATION_TYPES.includes(this.props.animationMethod)?this.props.animationMethod:null;}},{key:"render",value:function render(){var _this$props3=this.props,thickness=_this$props3.thickness,unfilledColor=_this$props3.unfilledColor,children=_this$props3.children,style=_this$props3.style,noTrackColor=_this$props3.noTrackColor;return _react.default.createElement(_reactNative.View,{style:[this.getFullCircleStyle(),styles.mainContainer,style],__source:{fileName:_jsxFileName,lineNumber:160}},_react.default.createElement(_reactNative.View,{pointerEvents:"box-none",style:[this.getFullCircleStyle(),{borderWidth:noTrackColor?0:thickness,borderColor:unfilledColor},styles.innerCircleContainer],__source:{fileName:_jsxFileName,lineNumber:161}},children),this.renderHalfCircle(),this.renderHalfCircle({isFlipped:true}));}}]);return ProgressCircleDeterminate;}(_react.Component);(0,_defineProperty2.default)(ProgressCircleDeterminate,"propTypes",{value:_propTypes.default.number,size:_propTypes.default.number,thickness:_propTypes.default.number,color:_propTypes.default.string,unfilledColor:_propTypes.default.string,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),children:_propTypes.default.node,animationMethod:_propTypes.default.string,animationConfig:_propTypes.default.object,shouldAnimateFirstValue:_propTypes.default.bool,onChange:_propTypes.default.func,onChangeAnimationEnd:_propTypes.default.func,noTrackColor:_propTypes.default.bool});(0,_defineProperty2.default)(ProgressCircleDeterminate,"defaultProps",{value:0,size:64,thickness:4,color:'#4c90ff',unfilledColor:'transparent',noTrackColor:true,style:{},children:null,animationMethod:null,animationConfig:{duration:200},shouldAnimateFirstValue:false,onChange:function onChange(){},onChangeAnimationEnd:function onChangeAnimationEnd(){}});var styles=_reactNative.StyleSheet.create({mainContainer:{flexDirection:'row',borderColor:'transparent',backgroundColor:'transparent'},innerCircleContainer:{position:'absolute',justifyContent:'center',alignItems:'center'}});var _default=(0,_withTheme.default)(ProgressCircleDeterminate);exports.default=_default; ================================================ FILE: dist/Components/Progress/ProgressCircle/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _ProgressCircle.default;}});var _ProgressCircle=_interopRequireDefault(require("./ProgressCircle")); ================================================ FILE: dist/Components/RadioButton/RadioButton.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Ripple=_interopRequireDefault(require("../Ripple/Ripple"));var _RadioButton=_interopRequireDefault(require("./RadioButton.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/RadioButton/RadioButton.js";var RadioButton=function(_Component){(0,_inherits2.default)(RadioButton,_Component);function RadioButton(){(0,_classCallCheck2.default)(this,RadioButton);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(RadioButton).apply(this,arguments));}(0,_createClass2.default)(RadioButton,[{key:"_renderLabel",value:function _renderLabel(){var _this$props=this.props,label=_this$props.label,labelStyle=_this$props.labelStyle,onPress=_this$props.onPress;if(!label)return null;return _react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:35}},_react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:36}},_react.default.createElement(_reactNative.Text,{style:[_RadioButton.default.label,labelStyle],__source:{fileName:_jsxFileName,lineNumber:37}},label)));}},{key:"render",value:function render(){var _this$props2=this.props,checked=_this$props2.checked,disabled=_this$props2.disabled,onPress=_this$props2.onPress,rippleColor=_this$props2.rippleColor,radioButtonColor=_this$props2.radioButtonColor,uncheckedBorderColor=_this$props2.uncheckedBorderColor,style=_this$props2.style,labelPos=_this$props2.labelPos,error=_this$props2.error,theme=_this$props2.theme,testID=_this$props2.testID;var rippleColorApplied=rippleColor?rippleColor:'rgba(0,0,0,.8)';var radioButtonColorApplied=radioButtonColor?radioButtonColor:'rgba(33, 150, 243, 1)';var uncheckedBorderColorApplied=uncheckedBorderColor?uncheckedBorderColor:'rgba(0,0,0,.5)';if(error){radioButtonColorApplied=theme.error.main;uncheckedBorderColorApplied=theme.error.main;}if(disabled){radioButtonColorApplied='rgba(0,0,0,.5)';}return _react.default.createElement(_reactNative.View,{style:[_RadioButton.default.container,style],testID:testID,__source:{fileName:_jsxFileName,lineNumber:75}},labelPos==='left'?this._renderLabel():null,_react.default.createElement(_Ripple.default,{rippleColor:rippleColorApplied,rippleContainerBorderRadius:18,onPress:onPress,style:[_RadioButton.default.ripple],rippleCentered:true,disabled:disabled,__source:{fileName:_jsxFileName,lineNumber:77}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_RadioButton.default.radio,{borderColor:checked?radioButtonColorApplied:uncheckedBorderColorApplied}],__source:{fileName:_jsxFileName,lineNumber:84}},checked?_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_RadioButton.default.radioDot,{backgroundColor:radioButtonColorApplied}],__source:{fileName:_jsxFileName,lineNumber:95}}):null)),labelPos==='right'?this._renderLabel():null);}}]);return RadioButton;}(_react.Component);(0,_defineProperty2.default)(RadioButton,"propTypes",{checked:_propTypes.default.bool,disabled:_propTypes.default.bool,onPress:_propTypes.default.func,rippleColor:_propTypes.default.string,radioButtonColor:_propTypes.default.string,uncheckedBorderColor:_propTypes.default.string,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),label:_propTypes.default.string,labelStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),labelPos:_propTypes.default.string,error:_propTypes.default.bool,theme:_propTypes.default.object,testID:_propTypes.default.string});(0,_defineProperty2.default)(RadioButton,"defaultProps",{labelPos:'right'});var _default=(0,_withTheme.default)(RadioButton);exports.default=_default; ================================================ FILE: dist/Components/RadioButton/RadioButton.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../");var _storybookState=require("@sambego/storybook-state");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/RadioButton/RadioButton.stories.js";var store=new _storybookState.Store({checked:1,checked1:2,checked2:3,checked3:1,checked4:1});var _default=(0,_storiesOf.storiesOf)('Components|Radio Button',module).addParameters({jest:['RadioButton']}).add('simple',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:21}},_react.default.createElement(_Header.default,{title:'Radio Button',__source:{fileName:_jsxFileName,lineNumber:22}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:23}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap'},__source:{fileName:_jsxFileName,lineNumber:25}},_react.default.createElement(_.RadioButton,{checked:state.checked==1,onPress:function onPress(){return store.set({checked:1});},__source:{fileName:_jsxFileName,lineNumber:26}}),_react.default.createElement(_.RadioButton,{checked:state.checked==2,onPress:function onPress(){return store.set({checked:2});},__source:{fileName:_jsxFileName,lineNumber:30}}),_react.default.createElement(_.RadioButton,{checked:state.checked==3,onPress:function onPress(){return store.set({checked:3});},__source:{fileName:_jsxFileName,lineNumber:34}}));}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:41}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap'},__source:{fileName:_jsxFileName,lineNumber:43}},_react.default.createElement(_.RadioButton,{checked:state.checked1==1,radioButtonColor:'#E91E63',rippleColor:'#E91E63',onPress:function onPress(){return store.set({checked1:1});},__source:{fileName:_jsxFileName,lineNumber:44}}),_react.default.createElement(_.RadioButton,{checked:state.checked1==2,radioButtonColor:'#E91E63',rippleColor:'#E91E63',onPress:function onPress(){return store.set({checked1:2});},__source:{fileName:_jsxFileName,lineNumber:50}}),_react.default.createElement(_.RadioButton,{checked:state.checked1==3,radioButtonColor:'#E91E63',rippleColor:'#E91E63',onPress:function onPress(){return store.set({checked1:3});},__source:{fileName:_jsxFileName,lineNumber:56}}));}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:65}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap'},__source:{fileName:_jsxFileName,lineNumber:67}},_react.default.createElement(_.RadioButton,{checked:state.checked2==1,onPress:function onPress(){return store.set({checked2:1});},uncheckedBorderColor:'#009688',radioButtonColor:'#009688',rippleColor:'#009688',__source:{fileName:_jsxFileName,lineNumber:68}}),_react.default.createElement(_.RadioButton,{checked:state.checked2==2,onPress:function onPress(){return store.set({checked2:2});},uncheckedBorderColor:'#009688',radioButtonColor:'#009688',rippleColor:'#009688',__source:{fileName:_jsxFileName,lineNumber:75}}),_react.default.createElement(_.RadioButton,{checked:state.checked2==3,onPress:function onPress(){return store.set({checked2:3});},uncheckedBorderColor:'#009688',radioButtonColor:'#009688',rippleColor:'#009688',__source:{fileName:_jsxFileName,lineNumber:82}}));}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:92}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap'},__source:{fileName:_jsxFileName,lineNumber:94}},_react.default.createElement(_.RadioButton,{checked:state.checked3==1,onPress:function onPress(){return store.set({checked2:1});},disabled:true,__source:{fileName:_jsxFileName,lineNumber:95}}),_react.default.createElement(_.RadioButton,{checked:state.checked3==1,onPress:function onPress(){return store.set({checked2:2});},disabled:true,__source:{fileName:_jsxFileName,lineNumber:100}}),_react.default.createElement(_.RadioButton,{checked:state.checked3==1,onPress:function onPress(){return store.set({checked2:3});},disabled:true,__source:{fileName:_jsxFileName,lineNumber:105}}));}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:113}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap'},__source:{fileName:_jsxFileName,lineNumber:115}},_react.default.createElement(_.RadioButton,{checked:state.checked4==1,onPress:function onPress(){return store.set({checked4:1});},error:true,__source:{fileName:_jsxFileName,lineNumber:116}}),_react.default.createElement(_.RadioButton,{checked:state.checked4==2,onPress:function onPress(){return store.set({checked4:2});},error:true,__source:{fileName:_jsxFileName,lineNumber:121}}),_react.default.createElement(_.RadioButton,{checked:state.checked4==3,onPress:function onPress(){return store.set({checked4:3});},error:true,__source:{fileName:_jsxFileName,lineNumber:126}}));}));}).add('label',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:137}},_react.default.createElement(_Header.default,{title:'Radio Button',__source:{fileName:_jsxFileName,lineNumber:138}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:139}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'column',marginBottom:20},__source:{fileName:_jsxFileName,lineNumber:141}},_react.default.createElement(_.RadioButton,{checked:state.checked==1,onPress:function onPress(){return store.set({checked:1});},label:"Home",__source:{fileName:_jsxFileName,lineNumber:142}}),_react.default.createElement(_.RadioButton,{checked:state.checked==2,onPress:function onPress(){return store.set({checked:2});},label:"Work",__source:{fileName:_jsxFileName,lineNumber:147}}),_react.default.createElement(_.RadioButton,{checked:state.checked==3,onPress:function onPress(){return store.set({checked:3});},label:"Anywhere",__source:{fileName:_jsxFileName,lineNumber:152}}));}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:160}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap',marginBottom:20},__source:{fileName:_jsxFileName,lineNumber:162}},_react.default.createElement(_.RadioButton,{checked:state.checked1==1,radioButtonColor:'#E91E63',rippleColor:'#E91E63',onPress:function onPress(){return store.set({checked1:1});},label:"Beach",__source:{fileName:_jsxFileName,lineNumber:168}}),_react.default.createElement(_.RadioButton,{checked:state.checked1==2,radioButtonColor:'#E91E63',rippleColor:'#E91E63',onPress:function onPress(){return store.set({checked1:2});},label:"Mountain",__source:{fileName:_jsxFileName,lineNumber:175}}),_react.default.createElement(_.RadioButton,{checked:state.checked1==3,radioButtonColor:'#E91E63',rippleColor:'#E91E63',onPress:function onPress(){return store.set({checked1:3});},label:"Woods",__source:{fileName:_jsxFileName,lineNumber:182}}));}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:192}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'row',marginBottom:20},__source:{fileName:_jsxFileName,lineNumber:194}},_react.default.createElement(_.RadioButton,{checked:state.checked2==1,onPress:function onPress(){return store.set({checked2:1});},uncheckedBorderColor:'#009688',radioButtonColor:'#009688',rippleColor:'#009688',label:"Rocky",labelPos:"left",__source:{fileName:_jsxFileName,lineNumber:195}}),_react.default.createElement(_.RadioButton,{checked:state.checked2==2,onPress:function onPress(){return store.set({checked2:2});},uncheckedBorderColor:'#009688',radioButtonColor:'#009688',rippleColor:'#009688',label:"Mountain",labelPos:"left",__source:{fileName:_jsxFileName,lineNumber:204}}),_react.default.createElement(_.RadioButton,{checked:state.checked2==3,onPress:function onPress(){return store.set({checked2:3});},uncheckedBorderColor:'#009688',radioButtonColor:'#009688',rippleColor:'#009688',label:"High",labelPos:"left",__source:{fileName:_jsxFileName,lineNumber:213}}));}));});exports.default=_default; ================================================ FILE: dist/Components/RadioButton/RadioButton.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({container:{flexDirection:'row',alignItems:'center'},ripple:{borderRadius:18,alignItems:'center',justifyContent:'center',height:40,width:40},radio:{height:20,width:20,borderRadius:24,borderWidth:2,margin:2,alignItems:'center',justifyContent:'center'},radioDot:{height:10,width:10,borderRadius:5}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/RadioButton/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _RadioButton.default;}});var _RadioButton=_interopRequireDefault(require("./RadioButton")); ================================================ FILE: dist/Components/Ripple/Ripple.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _propTypes=_interopRequireDefault(require("prop-types"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _Ripple=_interopRequireWildcard(require("./Ripple.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Ripple/Ripple.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0?0.5*rippleSize:Math.sqrt(Math.pow(w2+offsetX,2)+Math.pow(h2+offsetY,2));var ripple={unique:this.unique++,progress:new _reactNative.Animated.Value(0),locationX:locationX,locationY:locationY,R:R};var animation=_reactNative.Animated.timing(ripple.progress,{toValue:1,easing:_reactNative.Easing.out(_reactNative.Easing.ease),duration:rippleDuration,useNativeDriver:true});onRippleAnimation(animation,this.onAnimationEnd);this.setState(function(_ref2){var ripples=_ref2.ripples;return{ripples:ripples.concat(ripple)};});}},{key:"renderRipple",value:function renderRipple(_ref3){var unique=_ref3.unique,progress=_ref3.progress,locationX=_ref3.locationX,locationY=_ref3.locationY,R=_ref3.R;var _this$props4=this.props,rippleColor=_this$props4.rippleColor,rippleOpacity=_this$props4.rippleOpacity;var rippleFades=this.rippleFades;var rippleStyle={top:locationY-_Ripple.radius,left:locationX-_Ripple.radius,backgroundColor:rippleColor,transform:[{scale:progress.interpolate({inputRange:[0,1],outputRange:[0.5/_Ripple.radius,R/_Ripple.radius]})}],opacity:rippleFades?progress.interpolate({inputRange:[0,1],outputRange:[rippleOpacity,0]}):rippleOpacity};return _react.default.createElement(_reactNative.Animated.View,{style:[_Ripple.default.ripple,rippleStyle],key:unique,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:251}});}},{key:"render",value:function render(){var ripples=this.state.ripples;var onPress=this.onPress,onPressIn=this.onPressIn,onPressOut=this.onPressOut,onLongPress=this.onLongPress,onLayout=this.onLayout;var _this$props5=this.props,delayLongPress=_this$props5.delayLongPress,delayPressIn=_this$props5.delayPressIn,delayPressOut=_this$props5.delayPressOut,disabled=_this$props5.disabled,hitSlop=_this$props5.hitSlop,pressRetentionOffset=_this$props5.pressRetentionOffset,children=_this$props5.children,rippleContainerBorderRadius=_this$props5.rippleContainerBorderRadius,testID=_this$props5.testID,nativeID=_this$props5.nativeID,accessible=_this$props5.accessible,accessibilityLabel=_this$props5.accessibilityLabel,panResponder=_this$props5.panResponder,props=(0,_objectWithoutProperties2.default)(_this$props5,["delayLongPress","delayPressIn","delayPressOut","disabled","hitSlop","pressRetentionOffset","children","rippleContainerBorderRadius","testID","nativeID","accessible","accessibilityLabel","panResponder"]);var touchableProps={delayLongPress:delayLongPress,delayPressIn:delayPressIn,delayPressOut:delayPressOut,disabled:disabled,hitSlop:hitSlop,pressRetentionOffset:pressRetentionOffset,onPress:onPress,onPressIn:onPressIn,testID:testID,nativeID:nativeID,accessible:accessible,accessibilityLabel:accessibilityLabel,onPressOut:onPressOut,onLongPress:props.onLongPress?onLongPress:undefined,onLayout:onLayout};var containerStyle={borderRadius:rippleContainerBorderRadius};return _react.default.createElement(_reactNative.TouchableWithoutFeedback,(0,_extends2.default)({},touchableProps,panResponder,{testID:testID,__source:{fileName:_jsxFileName,lineNumber:302}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true},props,{__source:{fileName:_jsxFileName,lineNumber:306}}),children,_react.default.createElement(_reactNative.View,{style:[_Ripple.default.container,containerStyle],pointerEvents:"none",__source:{fileName:_jsxFileName,lineNumber:308}},ripples.map(this.renderRipple))));}}]);return Ripple;}(_react.PureComponent);exports.default=Ripple;(0,_defineProperty2.default)(Ripple,"defaultProps",_objectSpread({},_reactNative.TouchableWithoutFeedback.defaultProps,{rippleColor:'rgba(0, 0, 0, .87)',rippleOpacity:0.3,rippleDuration:400,rippleSize:0,rippleContainerBorderRadius:0,rippleCentered:false,rippleSequential:false,rippleFades:true,disabled:false,displayUntilPressOut:true,onRippleAnimation:function onRippleAnimation(animation,callback){return animation.start(callback);},testID:'mb-ripple'}));(0,_defineProperty2.default)(Ripple,"propTypes",_objectSpread({},_reactNative.Animated.View.propTypes,{},_reactNative.TouchableWithoutFeedback.propTypes,{rippleColor:_propTypes.default.string,rippleOpacity:_propTypes.default.number,rippleDuration:_propTypes.default.number,rippleSize:_propTypes.default.number,rippleContainerBorderRadius:_propTypes.default.number,rippleCentered:_propTypes.default.bool,rippleSequential:_propTypes.default.bool,rippleFades:_propTypes.default.bool,disabled:_propTypes.default.bool,displayUntilPressOut:_propTypes.default.bool,onRippleAnimation:_propTypes.default.func,testID:_propTypes.default.string})); ================================================ FILE: dist/Components/Ripple/Ripple.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Ripple/Ripple.stories.js";var _default=(0,_storiesOf.storiesOf)('Components|Ripple',module).addParameters({jest:['Ripple']}).add('from click',function(){return _react.default.createElement(_Container.default,{scroll:true,__source:{fileName:_jsxFileName,lineNumber:13}},_react.default.createElement(_Header.default,{title:'Ripple from where it was clicked',__source:{fileName:_jsxFileName,lineNumber:14}}),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap'},__source:{fileName:_jsxFileName,lineNumber:15}},_react.default.createElement(_.Ripple,{rippleColor:'blue',style:{width:180,height:250,justifyContent:'center',alignItems:'center',borderWidth:1,borderColor:'black',borderRadius:5},__source:{fileName:_jsxFileName,lineNumber:16}},_react.default.createElement(_reactNative.Text,{__source:{fileName:_jsxFileName,lineNumber:27}},"Click Me")),_react.default.createElement(_.Ripple,{style:{width:200,height:200,marginLeft:40},__source:{fileName:_jsxFileName,lineNumber:29}},_react.default.createElement(_.Card,{shadow:4,style:{width:200,height:200,justifyContent:'center',alignItems:'center'},__source:{fileName:_jsxFileName,lineNumber:30}},_react.default.createElement(_reactNative.Text,{__source:{fileName:_jsxFileName,lineNumber:38}},"Click Me")))),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap',marginTop:40},__source:{fileName:_jsxFileName,lineNumber:42}},_react.default.createElement(_.Ripple,{rippleColor:'#E91E63',rippleContainerBorderRadius:100,style:{width:100,height:100,justifyContent:'center',alignItems:'center'},__source:{fileName:_jsxFileName,lineNumber:43}},_react.default.createElement(_.Avatar,{type:"icon",content:"add",size:48,color:'#E91E63',contentColor:'white',__source:{fileName:_jsxFileName,lineNumber:52}})),_react.default.createElement(_.Ripple,{rippleColor:'#9C27B0',style:{width:300,height:200,marginLeft:40,justifyContent:'center',alignItems:'center'},rippleContainerBorderRadius:100,__source:{fileName:_jsxFileName,lineNumber:60}},_react.default.createElement(_reactNative.Text,{__source:{fileName:_jsxFileName,lineNumber:70}},"Massive Button"))));}).add('from center',function(){return _react.default.createElement(_Container.default,{scroll:true,__source:{fileName:_jsxFileName,lineNumber:76}},_react.default.createElement(_Header.default,{title:'Ripple form center',__source:{fileName:_jsxFileName,lineNumber:77}}),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap'},__source:{fileName:_jsxFileName,lineNumber:78}},_react.default.createElement(_.Ripple,{rippleColor:'blue',rippleCentered:true,style:{width:180,height:250,justifyContent:'center',alignItems:'center',borderWidth:1,borderColor:'black',borderRadius:5},__source:{fileName:_jsxFileName,lineNumber:79}},_react.default.createElement(_reactNative.Text,{__source:{fileName:_jsxFileName,lineNumber:91}},"Click Me")),_react.default.createElement(_.Ripple,{rippleCentered:true,style:{width:200,height:200,marginLeft:40},__source:{fileName:_jsxFileName,lineNumber:93}},_react.default.createElement(_.Card,{shadow:4,style:{width:200,height:200,justifyContent:'center',alignItems:'center'},__source:{fileName:_jsxFileName,lineNumber:96}},_react.default.createElement(_reactNative.Text,{__source:{fileName:_jsxFileName,lineNumber:104}},"Click Me")))));}).add('sequential',function(){return _react.default.createElement(_Container.default,{scroll:true,__source:{fileName:_jsxFileName,lineNumber:111}},_react.default.createElement(_Header.default,{title:'Sequential Ripple',__source:{fileName:_jsxFileName,lineNumber:112}}),_react.default.createElement(_reactNative.Text,{style:{marginBottom:40},__source:{fileName:_jsxFileName,lineNumber:113}},"Try clicking quickly versus other demos"),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap'},__source:{fileName:_jsxFileName,lineNumber:116}},_react.default.createElement(_.Ripple,{rippleColor:'blue',rippleSequential:true,style:{width:180,height:250,justifyContent:'center',alignItems:'center',borderWidth:1,borderColor:'black',borderRadius:5},__source:{fileName:_jsxFileName,lineNumber:117}},_react.default.createElement(_reactNative.Text,{__source:{fileName:_jsxFileName,lineNumber:129}},"Click Me")),_react.default.createElement(_.Ripple,{rippleCentered:true,rippleSequential:true,style:{width:200,height:200,marginLeft:40},__source:{fileName:_jsxFileName,lineNumber:131}},_react.default.createElement(_.Card,{shadow:4,style:{width:200,height:200,justifyContent:'center',alignItems:'center'},__source:{fileName:_jsxFileName,lineNumber:135}},_react.default.createElement(_reactNative.Text,{__source:{fileName:_jsxFileName,lineNumber:143}},"Click Me")))));}).add('speed',function(){return _react.default.createElement(_Container.default,{scroll:true,__source:{fileName:_jsxFileName,lineNumber:150}},_react.default.createElement(_Header.default,{title:'Speed Ripple',__source:{fileName:_jsxFileName,lineNumber:151}}),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row',flexWrap:'wrap'},__source:{fileName:_jsxFileName,lineNumber:153}},_react.default.createElement(_.Ripple,{rippleColor:'blue',rippleDuration:250,style:{width:180,height:250,justifyContent:'center',alignItems:'center',borderWidth:1,borderColor:'black',borderRadius:5},__source:{fileName:_jsxFileName,lineNumber:154}},_react.default.createElement(_reactNative.Text,{__source:{fileName:_jsxFileName,lineNumber:166}},"Really fast")),_react.default.createElement(_.Ripple,{rippleCentered:true,rippleDuration:1000,style:{width:200,height:200,marginLeft:40},__source:{fileName:_jsxFileName,lineNumber:168}},_react.default.createElement(_.Card,{shadow:4,style:{width:200,height:200,justifyContent:'center',alignItems:'center'},__source:{fileName:_jsxFileName,lineNumber:172}},_react.default.createElement(_reactNative.Text,{__source:{fileName:_jsxFileName,lineNumber:180}},"Really Slow")))));});exports.default=_default; ================================================ FILE: dist/Components/Ripple/Ripple.styles.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.radius=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _reactNative=require("react-native");function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;iheight?{height:400}:null;return _react.default.createElement(_Menu.default,(0,_extends2.default)({style:[_Select.default.menu,{flex:1}],sameWidth:true,visible:visible,fullWidth:fullWidth,modalMenuStyle:{marginTop:textFieldProps&&textFieldProps.dense?60:71,width:'100%',marginLeft:_reactNative.Platform.OS!=='web'?6:0},onBackdropPress:function onBackdropPress(){return _this2.hideMenu();},testID:testID,button:_react.default.createElement(_reactNative.TouchableHighlight,{onPress:function onPress(){return _this2.showMenu();},style:[_Select.default.button,{width:fullWidth?'100%':'auto'},buttonStyle],underlayColor:'transparent',__source:{fileName:_jsxFileName,lineNumber:103}},_react.default.createElement(_reactNative.View,{style:_Select.default.innerView,__source:{fileName:_jsxFileName,lineNumber:111}},_react.default.createElement(_TextField.default,(0,_extends2.default)({type:type?type:'flat',label:label,value:selectedItem,focused:visible,editable:false,style:[_Select.default.textfield,platformStyles,textFieldProps&&textFieldProps.style],trailingIcon:_react.default.createElement(_Icon.default,{name:"arrow-drop-down",size:24,color:iconColor,style:_Select.default.icon,__source:{fileName:_jsxFileName,lineNumber:124}})},textFieldProps,{__source:{fileName:_jsxFileName,lineNumber:112}}))))},menuProps,{__source:{fileName:_jsxFileName,lineNumber:90}}),_react.default.createElement(_reactNative.View,{style:menuListItemsWrapperStyle,__source:{fileName:_jsxFileName,lineNumber:137}},_react.default.createElement(_reactNative.FlatList,{data:menuItems,renderItem:function renderItem(_ref){var item=_ref.item;return _react.default.createElement(_MenuItem.default,{key:item.id,text:item.name,onPress:function onPress(){return _this2.onSelect(item);},style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:142}});},__source:{fileName:_jsxFileName,lineNumber:138}})));}}]);return Select;}(_react.Component);(0,_defineProperty2.default)(Select,"propTypes",{onSelect:_propTypes.default.func,buttonStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),label:_propTypes.default.string,selectedItem:_propTypes.default.node,menuItems:_propTypes.default.array,visible:_propTypes.default.bool,textFieldProps:_propTypes.default.object,menuProps:_propTypes.default.object,type:_propTypes.default.string,onBackdropPress:_propTypes.default.func,theme:_propTypes.default.object,testID:_propTypes.default.string,fullWidth:_propTypes.default.bool});var _default=(0,_withTheme.default)(Select);exports.default=_default; ================================================ FILE: dist/Components/Select/Select.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({button:{width:'100%',minWidth:'100%',height:56,alignItems:'center',flexDirection:'row',justifyContent:'space-between',marginTop:8,borderRadius:4,position:'relative'},innerView:{alignItems:'center',flexDirection:'row',justifyContent:'space-between',width:'100%',height:56,position:'relative',zIndex:2},textfield:{width:'100%',minWidth:'100%'}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Select/SelectFilled/SelectFilled.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../..");var _storybookState=require("@sambego/storybook-state");var _Header=_interopRequireDefault(require("../../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../../storybook/components/Container"));var _storiesOf=require("../../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Select/SelectFilled/SelectFilled.stories.js";var store=new _storybookState.Store({selectedItem:''});var data=[{id:1,name:'Option 1'},{id:2,name:'Option 2'},{id:3,name:'Option 3'}];var _default=(0,_storiesOf.storiesOf)('Components|Select/Filled',module).addParameters({jest:['SelectFilled']}).add('simple',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:23}},_react.default.createElement(_Header.default,{title:'Filled Select',__source:{fileName:_jsxFileName,lineNumber:24}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:26}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:28}},_react.default.createElement(_.Select,{type:'filled',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItem:value.name});},selectedItem:state.selectedItem,__source:{fileName:_jsxFileName,lineNumber:29}}),_react.default.createElement(_.Select,{type:'filled',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItemTwo:value.name});},selectedItem:state.selectedItemTwo,textFieldProps:{error:true,helperText:'error',containerStyle:{marginTop:40}},__source:{fileName:_jsxFileName,lineNumber:36}}));}));}).add('dense',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:54}},_react.default.createElement(_Header.default,{title:'Filled Select',__source:{fileName:_jsxFileName,lineNumber:55}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:57}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:59}},_react.default.createElement(_.Select,{type:'filled',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItem:value.name});},selectedItem:state.selectedItem,textFieldProps:{dense:true},__source:{fileName:_jsxFileName,lineNumber:60}}),_react.default.createElement(_.Select,{type:'filled',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItemTwo:value.name});},selectedItem:state.selectedItemTwo,textFieldProps:{error:true,dense:true},__source:{fileName:_jsxFileName,lineNumber:70}}));}));}).add('leading icon',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:87}},_react.default.createElement(_Header.default,{title:'Filled Select',__source:{fileName:_jsxFileName,lineNumber:88}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:90}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:92}},_react.default.createElement(_.Select,{type:'filled',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItem:value.name});},selectedItem:state.selectedItem,textFieldProps:{leadingIcon:_react.default.createElement(_.Icon,{name:'date-range',size:24,color:'#6e6e6e',__source:{fileName:_jsxFileName,lineNumber:101}})},__source:{fileName:_jsxFileName,lineNumber:93}}));}));});exports.default=_default; ================================================ FILE: dist/Components/Select/SelectFlat/SelectFlat.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../..");var _storybookState=require("@sambego/storybook-state");var _Header=_interopRequireDefault(require("../../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../../storybook/components/Container"));var _storiesOf=require("../../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Select/SelectFlat/SelectFlat.stories.js";var store=new _storybookState.Store({selectedItem:''});var data=[{id:1,name:'Option 1'},{id:2,name:'Option 2'},{id:3,name:'Option 3'}];var _default=(0,_storiesOf.storiesOf)('Components|Select/Flat',module).addParameters({jest:['SelectFlat']}).add('simple',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:23}},_react.default.createElement(_Header.default,{title:'Flat Select',__source:{fileName:_jsxFileName,lineNumber:24}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:26}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:28}},_react.default.createElement(_.Select,{type:'flat',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItem:value.name});},selectedItem:state.selectedItem,__source:{fileName:_jsxFileName,lineNumber:29}}),_react.default.createElement(_.Select,{type:'flat',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItemTwo:value.name});},selectedItem:state.selectedItemTwo,textFieldProps:{error:true,helperText:'error',containerStyle:{marginTop:40}},__source:{fileName:_jsxFileName,lineNumber:36}}));}));}).add('dense',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:54}},_react.default.createElement(_Header.default,{title:'Flat Select',__source:{fileName:_jsxFileName,lineNumber:55}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:57}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:59}},_react.default.createElement(_.Select,{type:'flat',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItem:value.name});},selectedItem:state.selectedItem,textFieldProps:{dense:true},__source:{fileName:_jsxFileName,lineNumber:60}}),_react.default.createElement(_.Select,{type:'flat',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItemTwo:value.name});},selectedItem:state.selectedItemTwo,textFieldProps:{error:true,dense:true},__source:{fileName:_jsxFileName,lineNumber:70}}));}));}).add('leading icon',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:87}},_react.default.createElement(_Header.default,{title:'Flat Select',__source:{fileName:_jsxFileName,lineNumber:88}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:90}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:92}},_react.default.createElement(_.Select,{type:'flat',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItem:value.name});},selectedItem:state.selectedItem,textFieldProps:{leadingIcon:_react.default.createElement(_.Icon,{name:'date-range',size:24,color:'#6e6e6e',__source:{fileName:_jsxFileName,lineNumber:101}})},__source:{fileName:_jsxFileName,lineNumber:93}}));}));});exports.default=_default; ================================================ FILE: dist/Components/Select/SelectOutlined/SelectOutlined.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../..");var _storybookState=require("@sambego/storybook-state");var _Header=_interopRequireDefault(require("../../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../../storybook/components/Container"));var _storiesOf=require("../../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Select/SelectOutlined/SelectOutlined.stories.js";var store=new _storybookState.Store({selectedItem:'',selectedItemTwo:''});var data=[{id:1,name:'Option 1'},{id:2,name:'Option 2'},{id:3,name:'Option 3'},{id:4,name:'Option 4'},{id:5,name:'Option 5'},{id:6,name:'Option 6'},{id:7,name:'Option 7'},{id:8,name:'Option 8'},{id:9,name:'Option 9'},{id:10,name:'Option 10'},{id:11,name:'Option 11'},{id:12,name:'Option 12'},{id:13,name:'Option 13'},{id:14,name:'Option 14'},{id:15,name:'Option 15'},{id:16,name:'Option 16'},{id:17,name:'Option 17'},{id:18,name:'Option 18'},{id:19,name:'Option 19'}];var _default=(0,_storiesOf.storiesOf)('Components|Select/Outlined',module).addParameters({jest:['SelectOutlined']}).add('simple',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:40}},_react.default.createElement(_Header.default,{title:'Outlined Select',__source:{fileName:_jsxFileName,lineNumber:41}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:43}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:45}},_react.default.createElement(_.Select,{type:'outlined',label:'Select',menuItems:data.slice(0,4),onSelect:function onSelect(value){return store.set({selectedItem:value.name});},selectedItem:state.selectedItem,__source:{fileName:_jsxFileName,lineNumber:46}}),_react.default.createElement(_.Select,{type:'outlined',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItemTwo:value.name});},selectedItem:state.selectedItemTwo,textFieldProps:{error:true,helperText:'error',containerStyle:{marginTop:40}},__source:{fileName:_jsxFileName,lineNumber:53}}));}));}).add('dense',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:71}},_react.default.createElement(_Header.default,{title:'Outlined Select',__source:{fileName:_jsxFileName,lineNumber:72}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:74}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:76}},_react.default.createElement(_.Select,{type:'outlined',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItem:value.name});},selectedItem:state.selectedItem,textFieldProps:{dense:true},__source:{fileName:_jsxFileName,lineNumber:77}}),_react.default.createElement(_.Select,{type:'outlined',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItemTwo:value.name});},selectedItem:state.selectedItemTwo,textFieldProps:{error:true,dense:true},__source:{fileName:_jsxFileName,lineNumber:87}}));}));}).add('leading icon',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:104}},_react.default.createElement(_Header.default,{title:'Outlined Select',__source:{fileName:_jsxFileName,lineNumber:105}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:107}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:109}},_react.default.createElement(_.Select,{type:'outlined',label:'Select',menuItems:data,onSelect:function onSelect(value){return store.set({selectedItem:value.name});},selectedItem:state.selectedItem,textFieldProps:{leadingIcon:_react.default.createElement(_.Icon,{name:'date-range',size:24,color:'#6e6e6e',__source:{fileName:_jsxFileName,lineNumber:118}})},__source:{fileName:_jsxFileName,lineNumber:110}}));}));});exports.default=_default; ================================================ FILE: dist/Components/Select/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _Select.default;}});var _Select=_interopRequireDefault(require("./Select")); ================================================ FILE: dist/Components/SheetBottom/SheetBottom.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _SheetBottom=_interopRequireDefault(require("./SheetBottom.web"));var _default=_SheetBottom.default;exports.default=_default; ================================================ FILE: dist/Components/SheetBottom/SheetBottom.native.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetBottom=_interopRequireDefault(require("./SheetBottom.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetBottom/SheetBottom.native.js";var SheetBottom=function(_Component){(0,_inherits2.default)(SheetBottom,_Component);function SheetBottom(props){var _this;(0,_classCallCheck2.default)(this,SheetBottom);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetBottom).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _this$state=_this.state,pan=_this$state.pan,initialHeight=_this$state.initialHeight;var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;if(height==0)return;if(height<=initialHeight)return;var windowHeight=_reactNative.Dimensions.get('window').height;_this.setState({initialWidth:width,initialHeight:height,fullHeight:windowHeight},function(){pan.setValue({x:0,y:windowHeight});_this.createPanResponder();});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeDown=_this$props.onSwipeDown,onSwipeUp=_this$props.onSwipeUp,cardVerticalPadding=_this$props.cardVerticalPadding;var _this$state2=_this.state,pan=_this$state2.pan,initialHeight=_this$state2.initialHeight,fullHeight=_this$state2.fullHeight;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderMove:function onPanResponderMove(e,gestureState){if(gestureState.dy<80&&gestureState.dy>-40){_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:0,y:fullHeight-initialHeight-cardVerticalPadding+gestureState.dy},duration:0}).start();}},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(initialHeight/4-gestureState.dy<0){if(onSwipeDown)onSwipeDown();}else if(initialHeight/4+gestureState.dy>0){if(onSwipeUp)onSwipeUp();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);_this.setState({initialHeight:0});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder();return _this;}(0,_createClass2.default)(SheetBottom,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight;var pan=this.state.pan;if(visible){this._open();}this.createPanResponder();var fullHeight=pageHeight?pageHeight:_reactNative.Dimensions.get('window').height;pan.setValue({x:0,y:fullHeight});this.setState({fullHeight:fullHeight});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,cardVerticalPadding=_this$props3.cardVerticalPadding,duration=_this$props3.duration;var _this$state3=this.state,initialHeight=_this$state3.initialHeight,fullHeight=_this$state3.fullHeight,pan=_this$state3.pan;if(visible){this.setState({internalVisible:true},function(){if(initialHeight==0){setTimeout(function(){return _this2.animateSheet(true);},100);return;}_reactNative.Animated.spring(pan,{useNativeDriver:true,toValue:{x:0,y:fullHeight-initialHeight-cardVerticalPadding}}).start();});}else{_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:0,y:fullHeight},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,supportedOrientations:['portrait','landscape'],__source:{fileName:_jsxFileName,lineNumber:176}},this._renderContent());}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,cardVerticalPadding=_this$props4.cardVerticalPadding,testID=_this$props4.testID;var _this$state4=this.state,pan=_this$state4.pan,fullHeight=_this$state4.fullHeight;return _react.default.createElement(_reactNative.View,{style:[_SheetBottom.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:198}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetBottom.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:199}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true},this.panResponder.panHandlers,{style:[_SheetBottom.default.container,style,{height:fullHeight,paddingVertical:cardVerticalPadding,transform:[{translateY:pan.y}]}],__source:{fileName:_jsxFileName,lineNumber:205}}),_react.default.createElement(_reactNative.SafeAreaView,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:218}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetBottom;}(_react.Component);(0,_defineProperty2.default)(SheetBottom,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeDown:_propTypes.default.func,onSwipeUp:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,cardVerticalPadding:_propTypes.default.number,pageHeight:_propTypes.default.number,testID:_propTypes.default.string});(0,_defineProperty2.default)(SheetBottom,"defaultProps",{duration:200,cardVerticalPadding:20});var _default=SheetBottom;exports.default=_default; ================================================ FILE: dist/Components/SheetBottom/SheetBottom.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../");var _storybookState=require("@sambego/storybook-state");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetBottom/SheetBottom.stories.js";var store=new _storybookState.Store({visible:false});var _default=(0,_storiesOf.storiesOf)('Components|SheetBottom',module).addParameters({jest:['SheetBottom']}).add('Modal',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:17}},_react.default.createElement(_Header.default,{title:'SheetBottom',__source:{fileName:_jsxFileName,lineNumber:18}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:19}},function(state){return _react.default.createElement(_reactNative.View,{style:{flex:1,height:400},__source:{fileName:_jsxFileName,lineNumber:21}},_react.default.createElement(_.Button,{text:"Open Sheet",onPress:function onPress(){store.set({visible:true});},__source:{fileName:_jsxFileName,lineNumber:22}}),_react.default.createElement(_.SheetBottom,{visible:state.visible,pageHeight:_reactNative.Platform.OS=='web'?600:null,onBackdropPress:function onBackdropPress(){return store.set({visible:false});},onSwipeDown:function onSwipeDown(){return store.set({visible:false});},__source:{fileName:_jsxFileName,lineNumber:28}},_react.default.createElement(_.List,{__source:{fileName:_jsxFileName,lineNumber:33}},_react.default.createElement(_.ListItem,{text:'Attractions',icon:_react.default.createElement(_.Icon,{name:'local-movies',size:24,__source:{fileName:_jsxFileName,lineNumber:36}}),__source:{fileName:_jsxFileName,lineNumber:34}}),_react.default.createElement(_.ListItem,{text:'Dining',icon:_react.default.createElement(_.Icon,{name:'local-dining',size:24,__source:{fileName:_jsxFileName,lineNumber:40}}),__source:{fileName:_jsxFileName,lineNumber:38}}),_react.default.createElement(_.ListItem,{text:'Education',icon:_react.default.createElement(_.Icon,{name:'edit',size:24,__source:{fileName:_jsxFileName,lineNumber:44}}),__source:{fileName:_jsxFileName,lineNumber:42}}),_react.default.createElement(_.ListItem,{text:'Health',icon:_react.default.createElement(_.Icon,{name:'favorite',size:24,__source:{fileName:_jsxFileName,lineNumber:48}}),__source:{fileName:_jsxFileName,lineNumber:46}}),_react.default.createElement(_.ListItem,{text:'Family',icon:_react.default.createElement(_.Icon,{name:'group',size:24,__source:{fileName:_jsxFileName,lineNumber:52}}),__source:{fileName:_jsxFileName,lineNumber:50}}),_react.default.createElement(_.ListItem,{text:'Office',icon:_react.default.createElement(_.Icon,{name:'content-cut',size:24,__source:{fileName:_jsxFileName,lineNumber:56}}),__source:{fileName:_jsxFileName,lineNumber:54}}),_react.default.createElement(_.ListItem,{text:'Promotions',icon:_react.default.createElement(_.Icon,{name:'loyalty',size:24,__source:{fileName:_jsxFileName,lineNumber:60}}),__source:{fileName:_jsxFileName,lineNumber:58}}))));}));});exports.default=_default; ================================================ FILE: dist/Components/SheetBottom/SheetBottom.styles.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _reactNative=require("react-native");var _shadow=_interopRequireDefault(require("../../Utils/Shadow/shadow"));function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i-40){_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:0,y:fullHeight-initialHeight-cardVerticalPadding+gestureState.dy},duration:0}).start();}},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(initialHeight/4-gestureState.dy<0){if(onSwipeDown)onSwipeDown();}else if(initialHeight/4+gestureState.dy>0){if(onSwipeUp)onSwipeUp();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder(_this.props);return _this;}(0,_createClass2.default)(SheetBottom,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight;var pan=this.state.pan;if(visible){this._open();}var fullHeight=pageHeight?pageHeight:_reactNative.Dimensions.get('window').height;this.createPanResponder(this.props);pan.setValue({x:0,y:fullHeight});this.setState({fullHeight:fullHeight});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,cardVerticalPadding=_this$props3.cardVerticalPadding,duration=_this$props3.duration;var _this$state3=this.state,initialHeight=_this$state3.initialHeight,fullHeight=_this$state3.fullHeight,pan=_this$state3.pan;if(visible){this.setState({internalVisible:true},function(){if(initialHeight==0){setTimeout(function(){return _this2.animateSheet(true);},100);return;}_reactNative.Animated.spring(pan,{useNativeDriver:true,toValue:{x:0,y:fullHeight-initialHeight-cardVerticalPadding}}).start();});}else{_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:0,y:fullHeight},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;if(_reactNative.Platform.OS=='web'){return _react.default.createElement(_modalEnhancedReactNativeWeb.default,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,style:{margin:0},__source:{fileName:_jsxFileName,lineNumber:174}},this._renderContent());}else{return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,__source:{fileName:_jsxFileName,lineNumber:185}},this._renderContent());}}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,cardVerticalPadding=_this$props4.cardVerticalPadding,testID=_this$props4.testID;var _this$state4=this.state,pan=_this$state4.pan,fullHeight=_this$state4.fullHeight;return _react.default.createElement(_reactNative.View,{style:[_SheetBottom.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:207}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetBottom.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:208}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true},this.panResponder.panHandlers,{style:[_SheetBottom.default.container,style,{position:'absolute',bottom:0,height:fullHeight,paddingVertical:cardVerticalPadding,transform:[{translateY:pan.y}]}],__source:{fileName:_jsxFileName,lineNumber:214}}),_react.default.createElement(_reactNative.View,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:229}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetBottom;}(_react.Component);(0,_defineProperty2.default)(SheetBottom,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeDown:_propTypes.default.func,onSwipeUp:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,cardVerticalPadding:_propTypes.default.number,pageHeight:_propTypes.default.number,testID:_propTypes.default.string});(0,_defineProperty2.default)(SheetBottom,"defaultProps",{duration:200,cardVerticalPadding:20});var _default=SheetBottom;exports.default=_default; ================================================ FILE: dist/Components/SheetBottom/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _SheetBottom.default;}});var _SheetBottom=_interopRequireDefault(require("./SheetBottom")); ================================================ FILE: dist/Components/SheetSide/SheetSide.android.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetSide=_interopRequireDefault(require("./SheetSide.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetSide/SheetSide.android.js";var needsSafeArea=_reactNative.Platform.OS==='ios'&&parseInt(_reactNative.Platform.Version,10);var SheetSide=function(_Component){(0,_inherits2.default)(SheetSide,_Component);function SheetSide(props){var _this;(0,_classCallCheck2.default)(this,SheetSide);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetSide).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,animatedPosition:new _reactNative.Animated.Value(0),pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0,fullWidth:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({initialWidth:width,initialHeight:height},function(){_this.createPanResponder(_this.props);});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeLeft=_this$props.onSwipeLeft,onSwipeRight=_this$props.onSwipeRight,widthPercentage=_this$props.widthPercentage,sheetWidth=_this$props.sheetWidth;var fullWidth=_this.state.fullWidth;var sheetWidthCalculated=_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(sheetWidthCalculated/4-gestureState.dy<0){if(onSwipeLeft)onSwipeLeft();}else if(sheetWidthCalculated/4+gestureState.dy>0){if(onSwipeRight)onSwipeRight();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder(_this.props);return _this;}(0,_createClass2.default)(SheetSide,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight,pageWidth=_this$props2.pageWidth,side=_this$props2.side;var pan=this.state.pan;if(visible){this._open();}this.createPanResponder(this.props);var width=_reactNative.Dimensions.get('window').width;pan.setValue({x:side=='left'?-width:width,y:0});this.setState({fullHeight:pageHeight?pageHeight:_reactNative.Dimensions.get('window').height,fullWidth:pageWidth?pageWidth:width});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,duration=_this$props3.duration,widthPercentage=_this$props3.widthPercentage,side=_this$props3.side,sheetWidth=_this$props3.sheetWidth;var _this$state=this.state,fullWidth=_this$state.fullWidth,pan=_this$state.pan;var openValue=_reactNative.Platform.OS=='web'?fullWidth-sheetWidth:fullWidth*(1-widthPercentage);var closeValue=fullWidth;if(side=='left'){openValue=0;closeValue=-closeValue;}if(visible){this.setState({internalVisible:true},function(){_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:openValue,y:0},duration:duration}).start();});}else{_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:closeValue,y:0},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,__source:{fileName:_jsxFileName,lineNumber:183}},this._handleSafeView());}},{key:"_handleSafeView",value:function _handleSafeView(){var fullWidth=this.state.fullWidth;if(needsSafeArea){return _react.default.createElement(_reactNative.SafeAreaView,{style:[_SheetSide.default.safeAreaView,{backgroundColor:'transparent',width:fullWidth,height:'100%'}],__source:{fileName:_jsxFileName,lineNumber:197}},this._renderContent());}else{return this._renderContent();}}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,widthPercentage=_this$props4.widthPercentage,testID=_this$props4.testID,sheetWidth=_this$props4.sheetWidth;var _this$state2=this.state,pan=_this$state2.pan,fullWidth=_this$state2.fullWidth;return _react.default.createElement(_reactNative.View,{style:[_SheetSide.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:226}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetSide.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:227}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true},this.panResponder.panHandlers,{style:[_SheetSide.default.container,style,{height:'100%',width:_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage,transform:[{translateX:pan.x}]}],__source:{fileName:_jsxFileName,lineNumber:233}}),_react.default.createElement(_reactNative.View,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:247}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetSide;}(_react.Component);(0,_defineProperty2.default)(SheetSide,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeLeft:_propTypes.default.func,onSwipeRight:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,pageWidth:_propTypes.default.number,pageHeight:_propTypes.default.number,widthPercentage:_propTypes.default.number,side:_propTypes.default.string,testID:_propTypes.default.string,sheetWidth:_propTypes.default.number});(0,_defineProperty2.default)(SheetSide,"defaultProps",{duration:200,widthPercentage:0.8,side:'right',sheetWidth:300});var _default=SheetSide;exports.default=_default; ================================================ FILE: dist/Components/SheetSide/SheetSide.ios.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetSide=_interopRequireDefault(require("./SheetSide.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetSide/SheetSide.ios.js";var needsSafeArea=_reactNative.Platform.OS==='ios'&&parseInt(_reactNative.Platform.Version,10);var SheetSide=function(_Component){(0,_inherits2.default)(SheetSide,_Component);function SheetSide(props){var _this;(0,_classCallCheck2.default)(this,SheetSide);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetSide).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,animatedPosition:new _reactNative.Animated.Value(0),pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0,fullWidth:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({initialWidth:width,initialHeight:height},function(){_this.createPanResponder(_this.props);});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeLeft=_this$props.onSwipeLeft,onSwipeRight=_this$props.onSwipeRight,widthPercentage=_this$props.widthPercentage,sheetWidth=_this$props.sheetWidth;var fullWidth=_this.state.fullWidth;var sheetWidthCalculated=_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(sheetWidthCalculated/4-gestureState.dy<0){if(onSwipeLeft)onSwipeLeft();}else if(sheetWidthCalculated/4+gestureState.dy>0){if(onSwipeRight)onSwipeRight();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder(_this.props);return _this;}(0,_createClass2.default)(SheetSide,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight,pageWidth=_this$props2.pageWidth,side=_this$props2.side;var pan=this.state.pan;if(visible){this._open();}this.createPanResponder(this.props);var width=_reactNative.Dimensions.get('window').width;pan.setValue({x:side=='left'?-width:width,y:0});this.setState({fullHeight:pageHeight?pageHeight:_reactNative.Dimensions.get('window').height,fullWidth:pageWidth?pageWidth:width});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,duration=_this$props3.duration,widthPercentage=_this$props3.widthPercentage,side=_this$props3.side,sheetWidth=_this$props3.sheetWidth;var _this$state=this.state,fullWidth=_this$state.fullWidth,pan=_this$state.pan;var openValue=_reactNative.Platform.OS=='web'?fullWidth-sheetWidth:fullWidth*(1-widthPercentage);var closeValue=fullWidth;if(side=='left'){openValue=0;closeValue=-closeValue;}if(visible){this.setState({internalVisible:true},function(){_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:openValue,y:0},duration:duration}).start();});}else{_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:closeValue,y:0},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,__source:{fileName:_jsxFileName,lineNumber:183}},this._handleSafeView());}},{key:"_handleSafeView",value:function _handleSafeView(){var fullWidth=this.state.fullWidth;if(needsSafeArea){return _react.default.createElement(_reactNative.SafeAreaView,{style:[_SheetSide.default.safeAreaView,{backgroundColor:'transparent',width:fullWidth,height:'100%'}],__source:{fileName:_jsxFileName,lineNumber:197}},this._renderContent());}else{return this._renderContent();}}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,widthPercentage=_this$props4.widthPercentage,testID=_this$props4.testID,sheetWidth=_this$props4.sheetWidth;var _this$state2=this.state,pan=_this$state2.pan,fullWidth=_this$state2.fullWidth;return _react.default.createElement(_reactNative.View,{style:[_SheetSide.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:226}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetSide.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:227}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true},this.panResponder.panHandlers,{style:[_SheetSide.default.container,style,{height:'100%',width:_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage,transform:[{translateX:pan.x}]}],__source:{fileName:_jsxFileName,lineNumber:233}}),_react.default.createElement(_reactNative.View,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:247}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetSide;}(_react.Component);(0,_defineProperty2.default)(SheetSide,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeLeft:_propTypes.default.func,onSwipeRight:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,pageWidth:_propTypes.default.number,pageHeight:_propTypes.default.number,widthPercentage:_propTypes.default.number,side:_propTypes.default.string,testID:_propTypes.default.string,sheetWidth:_propTypes.default.number});(0,_defineProperty2.default)(SheetSide,"defaultProps",{duration:200,widthPercentage:0.8,side:'right',sheetWidth:300});var _default=SheetSide;exports.default=_default; ================================================ FILE: dist/Components/SheetSide/SheetSide.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _SheetSide=_interopRequireDefault(require("./SheetSide.web"));var _default=_SheetSide.default;exports.default=_default; ================================================ FILE: dist/Components/SheetSide/SheetSide.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../");var _storybookState=require("@sambego/storybook-state");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetSide/SheetSide.stories.js";var store=new _storybookState.Store({visible:false});var _default=(0,_storiesOf.storiesOf)('Components|SheetSide',module).addParameters({jest:['SheetSide']}).add('Modal Right',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:17}},_react.default.createElement(_Header.default,{title:'SheetSide',__source:{fileName:_jsxFileName,lineNumber:18}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:19}},function(state){return _react.default.createElement(_reactNative.View,{style:{flex:1,height:400},__source:{fileName:_jsxFileName,lineNumber:21}},_react.default.createElement(_.Button,{text:"Open Sheet",onPress:function onPress(){store.set({visible:true});},__source:{fileName:_jsxFileName,lineNumber:22}}),_react.default.createElement(_.SheetSide,{visible:state.visible,pageHeight:_reactNative.Platform.OS=='web'?600:null,onBackdropPress:function onBackdropPress(){return store.set({visible:false});},onSwipeRight:function onSwipeRight(){return store.set({visible:false});},__source:{fileName:_jsxFileName,lineNumber:28}},_react.default.createElement(_.List,{__source:{fileName:_jsxFileName,lineNumber:33}},_react.default.createElement(_.ListItem,{text:'Attractions',icon:_react.default.createElement(_.Icon,{name:'local-movies',size:24,__source:{fileName:_jsxFileName,lineNumber:36}}),__source:{fileName:_jsxFileName,lineNumber:34}}),_react.default.createElement(_.ListItem,{text:'Dining',icon:_react.default.createElement(_.Icon,{name:'local-dining',size:24,__source:{fileName:_jsxFileName,lineNumber:40}}),__source:{fileName:_jsxFileName,lineNumber:38}}),_react.default.createElement(_.ListItem,{text:'Education',icon:_react.default.createElement(_.Icon,{name:'edit',size:24,__source:{fileName:_jsxFileName,lineNumber:44}}),__source:{fileName:_jsxFileName,lineNumber:42}}),_react.default.createElement(_.ListItem,{text:'Health',icon:_react.default.createElement(_.Icon,{name:'favorite',size:24,__source:{fileName:_jsxFileName,lineNumber:48}}),__source:{fileName:_jsxFileName,lineNumber:46}}),_react.default.createElement(_.ListItem,{text:'Family',icon:_react.default.createElement(_.Icon,{name:'group',size:24,__source:{fileName:_jsxFileName,lineNumber:52}}),__source:{fileName:_jsxFileName,lineNumber:50}}),_react.default.createElement(_.ListItem,{text:'Office',icon:_react.default.createElement(_.Icon,{name:'content-cut',size:24,__source:{fileName:_jsxFileName,lineNumber:56}}),__source:{fileName:_jsxFileName,lineNumber:54}}),_react.default.createElement(_.ListItem,{text:'Promotions',icon:_react.default.createElement(_.Icon,{name:'loyalty',size:24,__source:{fileName:_jsxFileName,lineNumber:60}}),__source:{fileName:_jsxFileName,lineNumber:58}}))));}));}).add('Modal Left',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:70}},_react.default.createElement(_Header.default,{title:'SheetSide',__source:{fileName:_jsxFileName,lineNumber:71}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:72}},function(state){return _react.default.createElement(_reactNative.View,{style:{flex:1,height:400},__source:{fileName:_jsxFileName,lineNumber:74}},_react.default.createElement(_.Button,{text:"Open Sheet",onPress:function onPress(){store.set({visible:true});},__source:{fileName:_jsxFileName,lineNumber:75}}),_react.default.createElement(_.SheetSide,{visible:state.visible,side:'left',pageHeight:_reactNative.Platform.OS=='web'?600:null,onBackdropPress:function onBackdropPress(){return store.set({visible:false});},onSwipeLeft:function onSwipeLeft(){return store.set({visible:false});},__source:{fileName:_jsxFileName,lineNumber:81}},_react.default.createElement(_.List,{__source:{fileName:_jsxFileName,lineNumber:87}},_react.default.createElement(_.ListItem,{text:'Attractions',icon:_react.default.createElement(_.Icon,{name:'local-movies',size:24,__source:{fileName:_jsxFileName,lineNumber:90}}),__source:{fileName:_jsxFileName,lineNumber:88}}),_react.default.createElement(_.ListItem,{text:'Dining',icon:_react.default.createElement(_.Icon,{name:'local-dining',size:24,__source:{fileName:_jsxFileName,lineNumber:94}}),__source:{fileName:_jsxFileName,lineNumber:92}}),_react.default.createElement(_.ListItem,{text:'Education',icon:_react.default.createElement(_.Icon,{name:'edit',size:24,__source:{fileName:_jsxFileName,lineNumber:98}}),__source:{fileName:_jsxFileName,lineNumber:96}}),_react.default.createElement(_.ListItem,{text:'Health',icon:_react.default.createElement(_.Icon,{name:'favorite',size:24,__source:{fileName:_jsxFileName,lineNumber:102}}),__source:{fileName:_jsxFileName,lineNumber:100}}),_react.default.createElement(_.ListItem,{text:'Family',icon:_react.default.createElement(_.Icon,{name:'group',size:24,__source:{fileName:_jsxFileName,lineNumber:106}}),__source:{fileName:_jsxFileName,lineNumber:104}}),_react.default.createElement(_.ListItem,{text:'Office',icon:_react.default.createElement(_.Icon,{name:'content-cut',size:24,__source:{fileName:_jsxFileName,lineNumber:110}}),__source:{fileName:_jsxFileName,lineNumber:108}}),_react.default.createElement(_.ListItem,{text:'Promotions',icon:_react.default.createElement(_.Icon,{name:'loyalty',size:24,__source:{fileName:_jsxFileName,lineNumber:114}}),__source:{fileName:_jsxFileName,lineNumber:112}}))));}));});exports.default=_default; ================================================ FILE: dist/Components/SheetSide/SheetSide.styles.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _reactNative=require("react-native");var _shadow=_interopRequireDefault(require("../../Utils/Shadow/shadow"));function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0){if(onSwipeRight)onSwipeRight();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder(_this.props);return _this;}(0,_createClass2.default)(SheetSide,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight,pageWidth=_this$props2.pageWidth,side=_this$props2.side;var pan=this.state.pan;if(visible){this._open();}this.createPanResponder(this.props);var width=_reactNative.Dimensions.get('window').width;pan.setValue({x:side=='left'?-width:width,y:0});this.setState({fullHeight:pageHeight?pageHeight:_reactNative.Dimensions.get('window').height,fullWidth:pageWidth?pageWidth:width});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,duration=_this$props3.duration,side=_this$props3.side;var _this$state=this.state,fullWidth=_this$state.fullWidth,pan=_this$state.pan;var openValue=0;var closeValue=fullWidth;if(side=='left'){openValue=0;closeValue=-closeValue;}if(visible){this.setState({internalVisible:true},function(){_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:openValue,y:0},duration:duration}).start();});}else{_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:closeValue,y:0},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;if(_reactNative.Platform.OS=='web'){return _react.default.createElement(_modalEnhancedReactNativeWeb.default,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,style:{margin:0},__source:{fileName:_jsxFileName,lineNumber:181}},this._handleSafeView());}else{return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,__source:{fileName:_jsxFileName,lineNumber:192}},this._handleSafeView());}}},{key:"_handleSafeView",value:function _handleSafeView(){var fullWidth=this.state.fullWidth;if(needsSafeArea){return _react.default.createElement(_reactNative.SafeAreaView,{style:[_SheetSide.default.safeAreaView,{backgroundColor:'transparent',width:fullWidth,height:'100%'}],__source:{fileName:_jsxFileName,lineNumber:207}},this._renderContent());}else{return this._renderContent();}}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,widthPercentage=_this$props4.widthPercentage,testID=_this$props4.testID,sheetWidth=_this$props4.sheetWidth,side=_this$props4.side;var _this$state2=this.state,pan=_this$state2.pan,fullWidth=_this$state2.fullWidth;return _react.default.createElement(_reactNative.View,{style:[_SheetSide.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:237}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetSide.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:238}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true},this.panResponder.panHandlers,{style:[_SheetSide.default.container,style,{height:'100%',position:'absolute',right:side=='right'?0:'auto',width:_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage,transform:[{translateX:pan.x}]}],__source:{fileName:_jsxFileName,lineNumber:244}}),_react.default.createElement(_reactNative.View,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:260}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetSide;}(_react.Component);(0,_defineProperty2.default)(SheetSide,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeLeft:_propTypes.default.func,onSwipeRight:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,pageWidth:_propTypes.default.number,pageHeight:_propTypes.default.number,widthPercentage:_propTypes.default.number,side:_propTypes.default.string,testID:_propTypes.default.string,sheetWidth:_propTypes.default.number});(0,_defineProperty2.default)(SheetSide,"defaultProps",{duration:200,widthPercentage:0.8,side:'right',sheetWidth:300});var _default=SheetSide;exports.default=_default; ================================================ FILE: dist/Components/SheetSide/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _SheetSide.default;}});var _SheetSide=_interopRequireDefault(require("./SheetSide")); ================================================ FILE: dist/Components/Slider/Marker/Marker.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _Marker=_interopRequireDefault(require("./Marker.styles"));var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _Ripple=_interopRequireDefault(require("../../Ripple/Ripple.js"));var _Hoverable=_interopRequireDefault(require("../../../Utils/Hoverable/Hoverable.js"));var _color=_interopRequireDefault(require("color"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Slider/Marker/Marker.js";var Marker=function(_Component){(0,_inherits2.default)(Marker,_Component);function Marker(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Marker);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Marker)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{backgroundColorHover:'transparent'});return _this;}(0,_createClass2.default)(Marker,[{key:"render",value:function render(){var _this2=this;var _this$props=this.props,disabled=_this$props.disabled,color=_this$props.color,theme=_this$props.theme,markerSize=_this$props.markerSize;var backgroundColorHover=this.state.backgroundColorHover;var backgroundColor=color?color:theme.primary.main;if(disabled)backgroundColor='#d3d3d3';return _react.default.createElement(_Hoverable.default,{onHoverIn:function onHoverIn(){return _this2.setState({backgroundColorHover:(0,_color.default)(backgroundColor).alpha(0.3)});},onHoverOut:function onHoverOut(){return _this2.setState({backgroundColorHover:'transparent'});},__source:{fileName:_jsxFileName,lineNumber:33}},_react.default.createElement(_Ripple.default,{rippleColor:backgroundColor,style:[_Marker.default.ripple,{height:markerSize*2.33,width:markerSize*2.33,borderRadius:markerSize*1.67},{backgroundColor:backgroundColorHover}],rippleContainerBorderRadius:100,__source:{fileName:_jsxFileName,lineNumber:42}},_react.default.createElement(_reactNative.View,{style:[{backgroundColor:backgroundColor,height:markerSize,width:markerSize,borderRadius:markerSize},disabled&&_Marker.default.disabled],__source:{fileName:_jsxFileName,lineNumber:54}})));}}]);return Marker;}(_react.Component);(0,_defineProperty2.default)(Marker,"propTypes",{pressed:_propTypes.default.bool,disabled:_propTypes.default.bool,color:_propTypes.default.string,theme:_propTypes.default.object,onPress:_propTypes.default.func,markerSize:_propTypes.default.number});var _default=(0,_withTheme.default)(Marker);exports.default=_default; ================================================ FILE: dist/Components/Slider/Marker/Marker.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({ripple:{justifyContent:'center',alignItems:'center'}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Slider/MarkerContainer/MarkerContainer.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _MarkerContainer=_interopRequireDefault(require("./MarkerContainer.styles"));var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _Marker=_interopRequireDefault(require("../Marker/Marker"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Slider/MarkerContainer/MarkerContainer.js";var MarkerContainer=function(_Component){(0,_inherits2.default)(MarkerContainer,_Component);function MarkerContainer(){(0,_classCallCheck2.default)(this,MarkerContainer);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(MarkerContainer).apply(this,arguments));}(0,_createClass2.default)(MarkerContainer,[{key:"render",value:function render(){var _this$props=this.props,sliderLength=_this$props.sliderLength,position=_this$props.position,pressed=_this$props.pressed,disabled=_this$props.disabled,color=_this$props.color,panResponder=_this$props.panResponder,onPress=_this$props.onPress,markerSize=_this$props.markerSize,trackHeight=_this$props.trackHeight;return _react.default.createElement(_reactNative.View,{style:[_MarkerContainer.default.markerContainer,{top:-markerSize*2+trackHeight/2,right:sliderLength-position-markerSize*2,height:markerSize*4,width:markerSize*4}],__source:{fileName:_jsxFileName,lineNumber:36}},_react.default.createElement(_reactNative.View,(0,_extends2.default)({style:[_MarkerContainer.default.touch]},panResponder,{__source:{fileName:_jsxFileName,lineNumber:46}}),_react.default.createElement(_Marker.default,{pressed:pressed,disabled:disabled,color:color,onPress:onPress,markerSize:markerSize,__source:{fileName:_jsxFileName,lineNumber:47}})));}}]);return MarkerContainer;}(_react.Component);(0,_defineProperty2.default)(MarkerContainer,"propTypes",{pressed:_propTypes.default.bool,disabled:_propTypes.default.bool,color:_propTypes.default.string,theme:_propTypes.default.object,sliderLength:_propTypes.default.number,position:_propTypes.default.number,panResponder:_propTypes.default.object,onPress:_propTypes.default.func,markerSize:_propTypes.default.number,trackHeight:_propTypes.default.number});var _default=(0,_withTheme.default)(MarkerContainer);exports.default=_default; ================================================ FILE: dist/Components/Slider/MarkerContainer/MarkerContainer.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({markerContainer:{position:'absolute',backgroundColor:'transparent',justifyContent:'center',alignItems:'center'},topMarkerContainer:{zIndex:1},touch:{backgroundColor:'transparent',justifyContent:'center',alignItems:'center',alignSelf:'stretch'}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Slider/Slider.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _MarkerContainer=_interopRequireDefault(require("./MarkerContainer/MarkerContainer"));var _Track=_interopRequireDefault(require("./Track/Track"));var _converts=require("./converts");var _Slider=_interopRequireDefault(require("./Slider.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Slider/Slider.js";var Slider=function(_Component){(0,_inherits2.default)(Slider,_Component);function Slider(props){var _this;(0,_classCallCheck2.default)(this,Slider);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Slider).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"startMarkerLeft",function(){var disableOne=_this.props.disableOne;var onePressed=_this.state.onePressed;if(!disableOne){_this.setState({onePressed:!onePressed});}});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"startMarkerRight",function(){var disableTwo=_this.props.disableTwo;var twoPressed=_this.state.twoPressed;if(!disableTwo){_this.setState({twoPressed:!twoPressed});}});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"moveMarkerLeft",function(gestureState){var _this$props=_this.props,disableOne=_this$props.disableOne,allowOverlap=_this$props.allowOverlap,sliderLength=_this$props.sliderLength,onValuesChange=_this$props.onValuesChange;var _this$state=_this.state,pastOne=_this$state.pastOne,positionTwo=_this$state.positionTwo,valueOne=_this$state.valueOne;if(disableOne){return;}var accumDistance=gestureState.dx;var unconfined=accumDistance+pastOne;var bottom=0;var trueTop=positionTwo-(allowOverlap?0:_this.stepLength);var top=trueTop===0?0:trueTop||sliderLength;var confined=unconfinedtop?top:unconfined;var value=(0,_converts.positionToValue)(confined,_this.optionsArray,sliderLength);_this.setState({positionOne:confined});if(value!==valueOne){_this.setState({valueOne:value},function(){var _this$state2=_this.state,newValOne=_this$state2.valueOne,valueTwo=_this$state2.valueTwo;var change=[newValOne];if(valueTwo){change.push(valueTwo);}onValuesChange(change);});}});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"moveMarkerRight",function(gestureState){var _this$props2=_this.props,disableTwo=_this$props2.disableTwo,allowOverlap=_this$props2.allowOverlap,sliderLength=_this$props2.sliderLength,onValuesChange=_this$props2.onValuesChange;var _this$state3=_this.state,pastTwo=_this$state3.pastTwo,positionOne=_this$state3.positionOne,valueTwo=_this$state3.valueTwo;if(disableTwo){return;}var accumDistance=gestureState.dx;var unconfined=accumDistance+pastTwo;var bottom=positionOne+(allowOverlap?0:_this.stepLength);var top=sliderLength;var confined=unconfinedtop?top:unconfined;var value=(0,_converts.positionToValue)(confined,_this.optionsArray,sliderLength);_this.setState({positionTwo:confined});if(value!==valueTwo){_this.setState({valueTwo:value},function(){var _this$state4=_this.state,valueOne=_this$state4.valueOne,newValTwo=_this$state4.valueTwo;onValuesChange([valueOne,newValTwo]);});}});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"endMarkerLeft",function(){var onValuesChangeEnd=_this.props.onValuesChangeEnd;var _this$state5=_this.state,positionOne=_this$state5.positionOne,onePressed=_this$state5.onePressed;_this.setState({pastOne:positionOne,onePressed:!onePressed},function(){var _this$state6=_this.state,valueOne=_this$state6.valueOne,valueTwo=_this$state6.valueTwo;var change=[valueOne];if(valueTwo){change.push(valueTwo);}onValuesChangeEnd(change);});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"endMarkerRight",function(){var _this$state7=_this.state,twoPressed=_this$state7.twoPressed,positionTwo=_this$state7.positionTwo;_this.setState({twoPressed:!twoPressed,pastTwo:positionTwo},function(){var _this$state8=_this.state,valueOne=_this$state8.valueOne,valueTwo=_this$state8.valueTwo;_this.props.onValuesChangeEnd([valueOne,valueTwo]);});});var _this$props3=_this.props,_sliderLength=_this$props3.sliderLength,values=_this$props3.values,min=_this$props3.min,max=_this$props3.max,step=_this$props3.step,trackHeight=_this$props3.trackHeight,trackStyle=_this$props3.trackStyle;_this.optionsArray=(0,_converts.createArray)(min,max,step);_this.stepLength=_sliderLength/_this.optionsArray.length;_this.finalTrackHeight=trackHeight||_reactNative.StyleSheet.flatten(trackStyle).height||2;var initialValues=values.map(function(value){return(0,_converts.valueToPosition)(value,_this.optionsArray,_sliderLength);});var customPanResponder=function customPanResponder(start,move,end){return _reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onStartShouldSetPanResponderCapture:function onStartShouldSetPanResponderCapture(){return false;},onMoveShouldSetPanResponder:function onMoveShouldSetPanResponder(){return true;},onMoveShouldSetPanResponderCapture:function onMoveShouldSetPanResponderCapture(){return true;},onPanResponderGrant:function onPanResponderGrant(){return start();},onPanResponderMove:function onPanResponderMove(evt,gestureState){return move(gestureState);},onPanResponderTerminationRequest:function onPanResponderTerminationRequest(){return false;},onPanResponderRelease:function onPanResponderRelease(evt,gestureState){return end(gestureState);},onPanResponderTerminate:function onPanResponderTerminate(evt,gestureState){return end(gestureState);},onShouldBlockNativeResponder:function onShouldBlockNativeResponder(){return true;}});};_this._panResponderOne=customPanResponder(_this.startMarkerLeft,_this.moveMarkerLeft,_this.endMarkerLeft);_this._panResponderTwo=customPanResponder(_this.startMarkerRight,_this.moveMarkerRight,_this.endMarkerRight);_this.state={pressedOne:true,valueOne:values[0],valueTwo:values[1],pastOne:initialValues[0],pastTwo:initialValues[1],positionOne:initialValues[0],positionTwo:initialValues[1]};return _this;}(0,_createClass2.default)(Slider,[{key:"componentWillReceiveProps",value:function componentWillReceiveProps(nextProps){var _this$props4=this.props,sliderLength=_this$props4.sliderLength,min=_this$props4.min,max=_this$props4.max,step=_this$props4.step;var _this$state9=this.state,onePressed=_this$state9.onePressed,twoPressed=_this$state9.twoPressed,valueOne=_this$state9.valueOne,valueTwo=_this$state9.valueTwo;if(onePressed||twoPressed){return;}var nextState={};if(nextProps.min!==min||nextProps.max!==max||nextProps.step!==step||nextProps.values[0]!==valueOne||nextProps.sliderLength!==sliderLength||nextProps.values[1]!==valueTwo||nextProps.sliderLength!==sliderLength&&nextProps.values[1]){this.optionsArray=(0,_converts.createArray)(nextProps.min,nextProps.max,nextProps.step);this.stepLength=sliderLength/this.optionsArray.length;var positionOne=(0,_converts.valueToPosition)(nextProps.values[0],this.optionsArray,nextProps.sliderLength);nextState.valueOne=nextProps.values[0];nextState.pastOne=positionOne;nextState.positionOne=positionOne;var positionTwo=(0,_converts.valueToPosition)(nextProps.values[1],this.optionsArray,nextProps.sliderLength);nextState.valueTwo=nextProps.values[1];nextState.pastTwo=positionTwo;nextState.positionTwo=positionTwo;}if(nextState!={}){this.setState(nextState);}}},{key:"_renderMarkerRight",value:function _renderMarkerRight(){var _this$props5=this.props,sliderLength=_this$props5.sliderLength,disableTwo=_this$props5.disableTwo,markerColor=_this$props5.markerColor,onPress=_this$props5.onPress,markerSize=_this$props5.markerSize;var _this$state10=this.state,positionTwo=_this$state10.positionTwo,twoPressed=_this$state10.twoPressed;return _react.default.createElement(_MarkerContainer.default,{sliderLength:sliderLength,position:positionTwo,pressed:twoPressed,disabled:disableTwo,panResponder:this._panResponderTwo.panHandlers,color:markerColor,onPress:onPress,markerSize:markerSize,trackHeight:this.finalTrackHeight,__source:{fileName:_jsxFileName,lineNumber:310}});}},{key:"_renderMarkerLeft",value:function _renderMarkerLeft(){var _this$props6=this.props,sliderLength=_this$props6.sliderLength,disableOne=_this$props6.disableOne,markerColor=_this$props6.markerColor,onPress=_this$props6.onPress,markerSize=_this$props6.markerSize;var _this$state11=this.state,positionOne=_this$state11.positionOne,onePressed=_this$state11.onePressed;return _react.default.createElement(_MarkerContainer.default,{sliderLength:sliderLength,position:positionOne,pressed:onePressed,disabled:disableOne,panResponder:this._panResponderOne.panHandlers,color:markerColor,onPress:onPress,markerSize:markerSize,trackHeight:this.finalTrackHeight,__source:{fileName:_jsxFileName,lineNumber:335}});}},{key:"_renderTracks",value:function _renderTracks(){var _this$props7=this.props,sliderLength=_this$props7.sliderLength,values=_this$props7.values,trackColor=_this$props7.trackColor,backgroundTrackColor=_this$props7.backgroundTrackColor,disableOne=_this$props7.disableOne,disableTwo=_this$props7.disableTwo,trackStyle=_this$props7.trackStyle;var _this$state12=this.state,positionOne=_this$state12.positionOne,positionTwo=_this$state12.positionTwo;return _react.default.createElement(_Track.default,{twoMarkers:values.length==2,sliderLength:sliderLength,positionTwo:positionTwo,positionOne:positionOne,trackColor:trackColor,backgroundTrackColor:backgroundTrackColor,bothDisabled:disableOne&&disableTwo,oneDisabled:disableOne,trackHeight:this.finalTrackHeight,trackStyle:trackStyle,__source:{fileName:_jsxFileName,lineNumber:362}});}},{key:"render",value:function render(){var _this$props8=this.props,sliderLength=_this$props8.sliderLength,values=_this$props8.values,style=_this$props8.style,testID=_this$props8.testID;var twoMarkers=values.length==2;return _react.default.createElement(_reactNative.View,{style:[_Slider.default.container,style],testID:testID,__source:{fileName:_jsxFileName,lineNumber:382}},_react.default.createElement(_reactNative.View,{style:[_Slider.default.fullTrack,{width:sliderLength}],__source:{fileName:_jsxFileName,lineNumber:383}},this._renderTracks(),this._renderMarkerLeft(),twoMarkers?this._renderMarkerRight():null));}}]);return Slider;}(_react.Component);(0,_defineProperty2.default)(Slider,"propTypes",{values:_propTypes.default.array,sliderLength:_propTypes.default.number,min:_propTypes.default.number,max:_propTypes.default.number,step:_propTypes.default.number,disableOne:_propTypes.default.bool,disableTwo:_propTypes.default.bool,onValuesChange:_propTypes.default.func,onValuesChangeEnd:_propTypes.default.func,trackColor:_propTypes.default.string,backgroundTrackColor:_propTypes.default.string,markerColor:_propTypes.default.string,allowOverlap:_propTypes.default.bool,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),testID:_propTypes.default.string,markerSize:_propTypes.default.number,trackHeight:_propTypes.default.number,trackStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array])});(0,_defineProperty2.default)(Slider,"defaultProps",{values:[0],onValuesChange:function onValuesChange(){},onValuesChangeEnd:function onValuesChangeEnd(){},step:1,min:0,max:100,sliderLength:280,disableOne:false,disableTwo:false,allowOverlap:false,snapped:false,minMarkerOverlapDistance:0,markerSize:12,trackStyle:{}});var _default=(0,_withTheme.default)(Slider);exports.default=_default; ================================================ FILE: dist/Components/Slider/Slider.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../");var _storybookState=require("@sambego/storybook-state");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Slider/Slider.stories.js";var store=new _storybookState.Store({slider:20,sliderOne:10,sliderTwo:40});var _default=(0,_storiesOf.storiesOf)('Components|Slider',module).addParameters({jest:['Slider']}).add('Simple',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:19}},_react.default.createElement(_Header.default,{title:'Slider',__source:{fileName:_jsxFileName,lineNumber:20}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:21}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:23}},_react.default.createElement(_.Slider,{value:state.slider,sliderLength:200,onValueChange:function onValueChange(value){return store.set({slider:value});},valuePrefix:'test',__source:{fileName:_jsxFileName,lineNumber:24}}),_react.default.createElement(_.Slider,{value:state.slider,sliderLength:200,disableOne:true,onValueChange:function onValueChange(value){return store.set({slider:value});},__source:{fileName:_jsxFileName,lineNumber:31}}));}));}).add('Ranged',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:43}},_react.default.createElement(_Header.default,{title:'Slider',__source:{fileName:_jsxFileName,lineNumber:44}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:45}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:47}},_react.default.createElement(_.Slider,{values:[state.sliderOne,state.sliderTwo],sliderLength:280,onValueChange:function onValueChange(value){return store.set({slider:value});},allowOverlap:true,__source:{fileName:_jsxFileName,lineNumber:48}}),_react.default.createElement(_.Slider,{values:[state.sliderOne,state.sliderTwo],sliderLength:280,onValueChange:function onValueChange(value){return store.set({slider:value});},min:0,max:100,step:1,disableOne:true,allowOverlap:true,__source:{fileName:_jsxFileName,lineNumber:54}}),_react.default.createElement(_.Slider,{values:[state.sliderOne,state.sliderTwo],sliderLength:280,onValueChange:function onValueChange(value){return store.set({slider:value});},min:0,max:100,step:1,disableTwo:true,allowOverlap:true,__source:{fileName:_jsxFileName,lineNumber:64}}),_react.default.createElement(_.Slider,{values:[state.sliderOne,state.sliderTwo],sliderLength:280,onValueChange:function onValueChange(value){return store.set({slider:value});},min:0,max:100,step:1,disableOne:true,disableTwo:true,allowOverlap:true,__source:{fileName:_jsxFileName,lineNumber:74}}));}));});exports.default=_default; ================================================ FILE: dist/Components/Slider/Slider.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({container:{position:'relative',height:50,justifyContent:'center'},fullTrack:{flexDirection:_reactNative.I18nManager.isRTL?'row-reverse':'row'}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Slider/Track/Track.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _Track=_interopRequireDefault(require("./Track.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Slider/Track/Track.js";var Track=function(_Component){(0,_inherits2.default)(Track,_Component);function Track(){(0,_classCallCheck2.default)(this,Track);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Track).apply(this,arguments));}(0,_createClass2.default)(Track,[{key:"render",value:function render(){var _this$props=this.props,backgroundTrackColor=_this$props.backgroundTrackColor,sliderLength=_this$props.sliderLength,positionOne=_this$props.positionOne,positionTwo=_this$props.positionTwo,twoMarkers=_this$props.twoMarkers,theme=_this$props.theme,trackColor=_this$props.trackColor,bothDisabled=_this$props.bothDisabled,oneDisabled=_this$props.oneDisabled,trackHeight=_this$props.trackHeight,trackStyle=_this$props.trackStyle;var selectedColor=trackColor?trackColor:theme.primary.main;var unselectedColor=backgroundTrackColor?backgroundTrackColor:'#CECECE';var trackOneLength=positionOne;var trackThreeLength=twoMarkers?sliderLength-positionTwo:0;var trackTwoLength=sliderLength-trackOneLength-trackThreeLength;var commonStyles=[_Track.default.track,trackStyle,{height:trackHeight}];return _react.default.createElement(_react.Fragment,{__source:{fileName:_jsxFileName,lineNumber:50}},_react.default.createElement(_reactNative.View,{style:[].concat(commonStyles,[{width:trackOneLength,backgroundColor:twoMarkers||oneDisabled?unselectedColor:selectedColor}]),__source:{fileName:_jsxFileName,lineNumber:51}}),_react.default.createElement(_reactNative.View,{style:[].concat(commonStyles,[{width:trackTwoLength,backgroundColor:twoMarkers&&!bothDisabled?selectedColor:unselectedColor}]),__source:{fileName:_jsxFileName,lineNumber:61}}),twoMarkers&&_react.default.createElement(_reactNative.View,{style:[].concat(commonStyles,[{width:trackThreeLength,backgroundColor:twoMarkers?unselectedColor:selectedColor}]),__source:{fileName:_jsxFileName,lineNumber:72}}));}}]);return Track;}(_react.Component);(0,_defineProperty2.default)(Track,"propTypes",{backgroundTrackColor:_propTypes.default.string,twoMarkers:_propTypes.default.bool,sliderLength:_propTypes.default.number,positionOne:_propTypes.default.number,positionTwo:_propTypes.default.number,theme:_propTypes.default.object,trackColor:_propTypes.default.string,bothDisabled:_propTypes.default.bool,oneDisabled:_propTypes.default.bool,trackHeight:_propTypes.default.number,trackStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array])});var _default=(0,_withTheme.default)(Track);exports.default=_default; ================================================ FILE: dist/Components/Slider/Track/Track.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({track:{backgroundColor:'#CECECE'},selectedTrack:{backgroundColor:'#0D8675'}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Slider/converts.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.valueToPosition=valueToPosition;exports.positionToValue=positionToValue;exports.createArray=createArray;var closest=function closest(array,n){var minI=0;var maxI=array.length-1;if(array[minI]>n){return minI;}else if(array[maxI]n){maxI=midI;}else{closestIndex=-1;}}return closestIndex;}return-1;};function valueToPosition(value,valuesArray,sliderLength){var index=closest(valuesArray,value);var arrLength=valuesArray.length-1;var validIndex=index===-1?arrLength:index;return sliderLength*validIndex/arrLength;}function positionToValue(position,valuesArray,sliderLength){var arrLength;var index;if(position<0||sliderLength0?-1:1;var result=[];if(!step){return result;}else{length=Math.abs((start-end)/step)+1;for(i=0;i20||offsetY-lastOffsetY<-20){if(offsetY>lastOffsetY){_this.animateHeader(true);}else{_this.animateHeader(false);}}if(footer&&offsetY-lastOffsetY<-20||offsetY-lastOffsetY>20){if(offsetY=0;}},{key:"getAnimateValues",value:function getAnimateValues(){var _this$props=this.props,selectedIndex=_this$props.selectedIndex,scrollEnabled=_this$props.scrollEnabled,actionItems=_this$props.actionItems;var _this$state=this.state,tabWidth=_this$state.tabWidth,barWidth=_this$state.barWidth;var index=selectedIndex;var scrollValue=!scrollEnabled?tabWidth:barWidth*0.4;if(scrollValue<90)scrollValue=90;if(!scrollEnabled&&scrollValue>90){return{indicatorPosition:index===0?0:index*scrollValue,scrollPosition:0};}switch(index){case 0:return{indicatorPosition:0,scrollPosition:0};case 1:return{indicatorPosition:barWidth*0.5-scrollValue/4,scrollPosition:scrollValue*0.25};case actionItems.length-1:return{indicatorPosition:scrollValue*(index-1)+(barWidth*0.5-scrollValue/4),scrollPosition:scrollValue*(index-2)+scrollValue*0.5};default:return{indicatorPosition:scrollValue*(index-1)+(barWidth*0.5-scrollValue/4),scrollPosition:scrollValue*0.25+scrollValue*(index-1)};}}},{key:"selectTab",value:function selectTab(){var _this$getAnimateValue=this.getAnimateValues(),indicatorPosition=_this$getAnimateValue.indicatorPosition,scrollPosition=_this$getAnimateValue.scrollPosition;_reactNative.Animated.spring(this.state.indicatorPosition,{toValue:_reactNative.I18nManager.isRTL?-indicatorPosition:indicatorPosition,tension:300,friction:20,useNativeDriver:true}).start();if(this.scrollView){this.scrollView.scrollTo({x:scrollPosition});}}},{key:"getTabWidth",value:function getTabWidth(width){var _this$props2=this.props,scrollEnabled=_this$props2.scrollEnabled,actionItems=_this$props2.actionItems;if(!scrollEnabled){var tabWidth=width/actionItems.length;this.setState({tabWidth:tabWidth});}this.setState({barWidth:width});}},{key:"getColor",value:function getColor(){var _this$props3=this.props,backgroundColor=_this$props3.backgroundColor,theme=_this$props3.theme;var implementedColor=backgroundColor?backgroundColor:theme.primary.main;return implementedColor;}},{key:"_renderTabs",value:function _renderTabs(){var _this$props4=this.props,scrollEnabled=_this$props4.scrollEnabled,actionItems=_this$props4.actionItems,handleChange=_this$props4.handleChange,selectedIndex=_this$props4.selectedIndex;var _this$state2=this.state,tabWidth=_this$state2.tabWidth,barWidth=_this$state2.barWidth;var tabWidthImplemented=!scrollEnabled?tabWidth:barWidth*0.4;if(tabWidthImplemented<90)tabWidthImplemented=90;return actionItems.map(function(item,index){if(!item.props){return _react.default.createElement(_Tab.default,{key:index,label:item.label,icon:item.icon,onPress:function onPress(){handleChange(index);if(item.onPress)item.onPress();},active:index===selectedIndex,tabWidth:tabWidthImplemented,__source:{fileName:_jsxFileName,lineNumber:157}});}else{return _react.default.cloneElement(item,{key:index,active:index===selectedIndex,tabWidth:tabWidthImplemented,onPress:function onPress(){handleChange(index);if(item.props.onPress)item.onPress();}});}});}},{key:"_renderContent",value:function _renderContent(){var _this$props5=this.props,scrollEnabled=_this$props5.scrollEnabled,underlineColor=_this$props5.underlineColor,underlineHeight=_this$props5.underlineHeight;var _this$state3=this.state,tabWidth=_this$state3.tabWidth,indicatorPosition=_this$state3.indicatorPosition,barWidth=_this$state3.barWidth;var tabWidthImplemented=!scrollEnabled?tabWidth:barWidth*0.4;if(tabWidthImplemented<90)tabWidthImplemented=90;return _react.default.createElement(_react.Fragment,{__source:{fileName:_jsxFileName,lineNumber:191}},_react.default.createElement(_reactNative.View,{style:_Tabs.default.tabsWrapper,__source:{fileName:_jsxFileName,lineNumber:192}},this._renderTabs()),_react.default.createElement(_Underline.default,{underlineHeight:underlineHeight,color:underlineColor,value:indicatorPosition,tabWidth:tabWidthImplemented,__source:{fileName:_jsxFileName,lineNumber:194}}));}},{key:"_renderScrollView",value:function _renderScrollView(){var _this3=this;var scrollEnabled=this.props.scrollEnabled;var _this$state4=this.state,tabWidth=_this$state4.tabWidth,barWidth=_this$state4.barWidth;var tabWidthImplemented=!scrollEnabled?tabWidth:barWidth*0.4;if(scrollEnabled||tabWidthImplemented<90){return _react.default.createElement(_reactNative.ScrollView,{horizontal:true,ref:function ref(_ref){_this3.scrollView=_ref;},showsHorizontalScrollIndicator:false,keyboardShouldPersistTaps:'never',scrollEnabled:scrollEnabled||tabWidthImplemented<90,__source:{fileName:_jsxFileName,lineNumber:212}},this._renderContent());}else{return this._renderContent();}}},{key:"render",value:function render(){var _this4=this;var _this$props6=this.props,style=_this$props6.style,testID=_this$props6.testID;return _react.default.createElement(TabsContext.Provider,{__source:{fileName:_jsxFileName,lineNumber:232}},_react.default.createElement(_reactNative.View,{style:[_Tabs.default.container,{backgroundColor:this.getColor()},style],testID:testID,ref:function ref(_ref2){_this4.container=_ref2;},onLayout:function onLayout(event){return _this4.getTabWidth(event.nativeEvent.layout.width);},__source:{fileName:_jsxFileName,lineNumber:233}},this._renderScrollView()));}}]);return Tabs;}(_react.Component);(0,_defineProperty2.default)(Tabs,"propTypes",{actionItems:_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.element])),selectedIndex:_propTypes.default.number,backgroundColor:_propTypes.default.string,underlineColor:_propTypes.default.string,underlineHeight:_propTypes.default.number,scrollEnabled:_propTypes.default.bool,handleChange:_propTypes.default.func,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,testID:_propTypes.default.string});(0,_defineProperty2.default)(Tabs,"defaultProps",{selectedIndex:0,underlineColor:'#fff',scrollEnabled:false});var _default=(0,_withTheme.default)(Tabs);exports.default=_default; ================================================ FILE: dist/Components/Tabs/Tabs.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _storybookState=require("@sambego/storybook-state");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Tabs/Tabs.stories.js";var store=new _storybookState.Store({selectedTab:1});var _default=(0,_storiesOf.storiesOf)('Components|Tabs',module).addParameters({jest:['Tabs']}).add('label',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:17}},_react.default.createElement(_Header.default,{title:'Tabs',__source:{fileName:_jsxFileName,lineNumber:18}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:19}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:21}},_react.default.createElement(_.Tabs,{selectedIndex:state.selectedTab,handleChange:function handleChange(index){return store.set({selectedTab:index});},actionItems:[{label:'Dogs'},{label:'Cats'},{label:'Birds'}],__source:{fileName:_jsxFileName,lineNumber:22}}));}));}).add('icon',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:37}},_react.default.createElement(_Header.default,{title:'Tabs',__source:{fileName:_jsxFileName,lineNumber:38}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:39}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:41}},_react.default.createElement(_.Tabs,{selectedIndex:state.selectedTab,handleChange:function handleChange(index){return store.set({selectedTab:index});},backgroundColor:'#009688',actionItems:[{icon:'phone'},{icon:'favorite'},{icon:'map'}],__source:{fileName:_jsxFileName,lineNumber:42}}));}));}).add('icon + label',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:58}},_react.default.createElement(_Header.default,{title:'Tabs',__source:{fileName:_jsxFileName,lineNumber:59}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:60}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:62}},_react.default.createElement(_.Tabs,{selectedIndex:state.selectedTab,handleChange:function handleChange(index){return store.set({selectedTab:index});},backgroundColor:'#9C27B0',actionItems:[{icon:'phone',label:'Recents'},{icon:'favorite',label:'Favorites'},{icon:'map',label:'Nearby'}],__source:{fileName:_jsxFileName,lineNumber:63}}));}));}).add('scrollable',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:79}},_react.default.createElement(_Header.default,{title:'Tabs',__source:{fileName:_jsxFileName,lineNumber:80}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:81}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:83}},_react.default.createElement(_.Tabs,{selectedIndex:state.selectedTab,handleChange:function handleChange(index){return store.set({selectedTab:index});},scrollEnabled:true,actionItems:[{icon:'phone',label:'Recents'},{icon:'favorite',label:'Favorites'},{icon:'map',label:'Nearby'},{icon:'account-circle',label:'Account'},{icon:'album',label:'Music'}],__source:{fileName:_jsxFileName,lineNumber:84}}));}));});exports.default=_default; ================================================ FILE: dist/Components/Tabs/Tabs.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({container:{minHeight:48,maxHeight:78},tabsWrapper:{flexDirection:'row',minHeight:48,maxHeight:78}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Tabs/Underline/Underline.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _Undrline=_interopRequireDefault(require("./Undrline.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Tabs/Underline/Underline.js";var Underline=function(_Component){(0,_inherits2.default)(Underline,_Component);function Underline(){(0,_classCallCheck2.default)(this,Underline);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Underline).apply(this,arguments));}(0,_createClass2.default)(Underline,[{key:"render",value:function render(){var _this$props=this.props,tabWidth=_this$props.tabWidth,color=_this$props.color,value=_this$props.value,underlineHeight=_this$props.underlineHeight;return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_Undrline.default.underline,{width:tabWidth,backgroundColor:color,transform:[{translateX:value}],height:underlineHeight}],__source:{fileName:_jsxFileName,lineNumber:27}});}}]);return Underline;}(_react.Component);(0,_defineProperty2.default)(Underline,"propTypes",{color:_propTypes.default.string,value:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.instanceOf(_reactNative.Animated.Value)]),tabWidth:_propTypes.default.number,underlineHeight:_propTypes.default.number});(0,_defineProperty2.default)(Underline,"defaultProps",{underlineHeight:2});var _default=(0,_withTheme.default)(Underline);exports.default=_default; ================================================ FILE: dist/Components/Tabs/Underline/Undrline.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({underline:{height:2,position:'absolute',bottom:0}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/Tabs/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _Tabs.default;}});Object.defineProperty(exports,"Tab",{enumerable:true,get:function get(){return _Tab.default;}});var _Tabs=_interopRequireDefault(require("./Tabs"));var _Tab=_interopRequireDefault(require("./Tab")); ================================================ FILE: dist/Components/TextField/Searchfield/Searchfield.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _IconButton=_interopRequireDefault(require("../../IconButton/IconButton"));var _Searchfield=_interopRequireDefault(require("./Searchfield.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/TextField/Searchfield/Searchfield.js";var Searchfield=function(_Component){(0,_inherits2.default)(Searchfield,_Component);function Searchfield(){(0,_classCallCheck2.default)(this,Searchfield);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Searchfield).apply(this,arguments));}(0,_createClass2.default)(Searchfield,[{key:"render",value:function render(){var _this$props=this.props,color=_this$props.color,searchIconProps=_this$props.searchIconProps,closeIconProps=_this$props.closeIconProps,inputProps=_this$props.inputProps,inputRef=_this$props.inputRef,onBlur=_this$props.onBlur,onChangeText=_this$props.onChangeText,onCloseIcon=_this$props.onCloseIcon,onFocus=_this$props.onFocus,placeholder=_this$props.placeholder,style=_this$props.style,textStyle=_this$props.textStyle,value=_this$props.value;return _react.default.createElement(_reactNative.View,{style:[_Searchfield.default.container,{backgroundColor:color?color:'rgba(255,255,255,.15)'},style],__source:{fileName:_jsxFileName,lineNumber:43}},_react.default.createElement(_IconButton.default,(0,_extends2.default)({name:'search',size:20,color:'white'},searchIconProps,{__source:{fileName:_jsxFileName,lineNumber:49}})),_react.default.createElement(_reactNative.TextInput,(0,_extends2.default)({ref:inputRef,style:[_Searchfield.default.searchInput,textStyle],placeholder:placeholder?placeholder:'Search',value:value,onChangeText:onChangeText,placeholderTextColor:'rgba(255,255,255,.57)',onFocus:onFocus,onBlur:onBlur},inputProps,{__source:{fileName:_jsxFileName,lineNumber:56}})),_react.default.createElement(_IconButton.default,(0,_extends2.default)({name:'close',size:20,style:{opacity:!value||value&&value.length<1?0:1},onPress:onCloseIcon,color:'white'},closeIconProps,{__source:{fileName:_jsxFileName,lineNumber:68}})));}}]);return Searchfield;}(_react.Component);(0,_defineProperty2.default)(Searchfield,"propTypes",{color:_propTypes.default.string,inputRef:_propTypes.default.func,onBlur:_propTypes.default.func,onChangeText:_propTypes.default.func,onCloseIcon:_propTypes.default.func,onFocus:_propTypes.default.func,placeholder:_propTypes.default.string,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),textStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),value:_propTypes.default.string,searchIconProps:_propTypes.default.object,closeIconProps:_propTypes.default.object,inputProps:_propTypes.default.object});var _default=(0,_withTheme.default)(Searchfield);exports.default=_default; ================================================ FILE: dist/Components/TextField/Searchfield/Searchfield.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../../");var _storybookState=require("@sambego/storybook-state");var _Header=_interopRequireDefault(require("../../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../../storybook/components/Container"));var _storiesOf=require("../../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/TextField/Searchfield/Searchfield.stories.js";var store=new _storybookState.Store({searchOne:''});var _default=(0,_storiesOf.storiesOf)('Components|TextField/SearchField',module).addParameters({jest:['Searchfield']}).add('Simple',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:17}},_react.default.createElement(_Header.default,{title:'Searchfield',__source:{fileName:_jsxFileName,lineNumber:18}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:19}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:21}},_react.default.createElement(_.Searchfield,{color:'#E91E63',value:state.search,onChangeText:function onChangeText(search){return store.set({search:search});},onCloseIcon:function onCloseIcon(){return store.set({search:''});},__source:{fileName:_jsxFileName,lineNumber:22}}));}));});exports.default=_default; ================================================ FILE: dist/Components/TextField/Searchfield/Searchfield.styles.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _reactNative=require("react-native");var _shadow=_interopRequireDefault(require("../../../Utils/Shadow/shadow.js"));function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0&&multiline){this.setState({height:56});}}},{key:"_renderLeadingIcon",value:function _renderLeadingIcon(){var leadingIcon=this.props.leadingIcon;var isFunc=typeof leadingIcon==='function';return _react.default.createElement(_reactNative.View,{style:{position:'absolute',left:8,top:16},__source:{fileName:_jsxFileName,lineNumber:58}},isFunc?leadingIcon():leadingIcon);}},{key:"_renderTrailingIcon",value:function _renderTrailingIcon(){var trailingIcon=this.props.trailingIcon;var isFunc=typeof trailingIcon==='function';return _react.default.createElement(_reactNative.View,{style:{position:'absolute',right:12,top:16},__source:{fileName:_jsxFileName,lineNumber:69}},isFunc?trailingIcon():trailingIcon);}},{key:"_renderPrefix",value:function _renderPrefix(){var prefix=this.props.prefix;return _react.default.createElement(_reactNative.View,{style:{position:'absolute',left:16,top:20},__source:{fileName:_jsxFileName,lineNumber:78}},_react.default.cloneElement(prefix,{color:prefix.props.color?prefix.props.color:'rgba(0, 0, 0, .57)',fontSize:prefix.props.fontSize?prefix.props.fontSize:16}));}},{key:"_renderSuffix",value:function _renderSuffix(){var suffix=this.props.suffix;return _react.default.createElement(_reactNative.View,{style:{position:'absolute',right:16,top:28},__source:{fileName:_jsxFileName,lineNumber:91}},_react.default.cloneElement(suffix,{color:suffix.props.color?suffix.props.color:'rgba(0, 0, 0, .57)',fontSize:suffix.props.fontSize?suffix.props.fontSize:12}));}},{key:"render",value:function render(){var _this2=this;var _this$props2=this.props,style=_this$props2.style,containerStyle=_this$props2.containerStyle,error=_this$props2.error,label=_this$props2.label,labelColor=_this$props2.labelColor,labelStyle=_this$props2.labelStyle,handleFocus=_this$props2.handleFocus,handleBlur=_this$props2.handleBlur,focused=_this$props2.focused,helperText=_this$props2.helperText,helperVisible=_this$props2.helperVisible,helperTextStyle=_this$props2.helperTextStyle,leadingIcon=_this$props2.leadingIcon,trailingIcon=_this$props2.trailingIcon,dense=_this$props2.dense,suffix=_this$props2.suffix,prefix=_this$props2.prefix,testID=_this$props2.testID,focusedLabelColor=_this$props2.focusedLabelColor,rest=(0,_objectWithoutProperties2.default)(_this$props2,["style","containerStyle","error","label","labelColor","labelStyle","handleFocus","handleBlur","focused","helperText","helperVisible","helperTextStyle","leadingIcon","trailingIcon","dense","suffix","prefix","testID","focusedLabelColor"]);var borderColor=focused?'rgba(33, 150, 243, 1)':'rgb(192, 192, 192)';if(error)borderColor='red';var height=rest.multiline||rest.numberOfLines>1?this.state.height:56;if(dense){height=40;}var paddingLeft=leadingIcon?44:_TextFieldOutline.OUTLINED_LEFT_PADDING;if(prefix)paddingLeft=32;var platformStyles=_reactNative.Platform.OS=='web'?{outlineWidth:0}:{};return _react.default.createElement(_reactNative.View,{style:[_TextFieldOutline.default.containerStyle,{marginBottom:helperText&&helperVisible?20:0,marginTop:8},containerStyle],__source:{fileName:_jsxFileName,lineNumber:149}},label?_react.default.createElement(_TextFieldLabel.default,{label:label,focused:focused,error:error,value:rest.value,type:'outlined',labelColor:labelColor,style:labelStyle,leadingIcon:!!leadingIcon,dense:dense,prefix:prefix,focusedLabelColor:focusedLabelColor,__source:{fileName:_jsxFileName,lineNumber:159}}):null,leadingIcon?this._renderLeadingIcon():null,prefix?this._renderPrefix():null,_react.default.createElement(_reactNative.TextInput,(0,_extends2.default)({style:[_TextFieldOutline.default.textField,_TextFieldOutline.default.outlinedInput,platformStyles,{borderWidth:focused?2:1,borderColor:borderColor,minHeight:dense?40:56,height:height,paddingBottom:rest.multiline?8:0,paddingTop:rest.multiline?20:0,paddingLeft:paddingLeft,paddingRight:trailingIcon||suffix?36:0},style],testID:testID,onContentSizeChange:function onContentSizeChange(e){return _this2._updateTextInputHeight(e);}},rest,{onFocus:handleFocus,onBlur:handleBlur,__source:{fileName:_jsxFileName,lineNumber:175}})),trailingIcon?this._renderTrailingIcon():null,suffix?this._renderSuffix():null,_react.default.createElement(_TextFieldHelperText.default,{error:error,visible:helperVisible||error,style:helperTextStyle,__source:{fileName:_jsxFileName,lineNumber:202}},helperText));}}]);return TextFieldOutlined;}(_react.Component);(0,_defineProperty2.default)(TextFieldOutlined,"propTypes",{style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),error:_propTypes.default.bool,label:_propTypes.default.string,labelColor:_propTypes.default.string,labelStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),handleFocus:_propTypes.default.func,handleBlur:_propTypes.default.func,focused:_propTypes.default.bool,helperText:_propTypes.default.string,helperVisible:_propTypes.default.bool,helperTextStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),leadingIcon:_propTypes.default.oneOfType([_propTypes.default.func,_propTypes.default.node]),trailingIcon:_propTypes.default.oneOfType([_propTypes.default.func,_propTypes.default.node]),dense:_propTypes.default.bool,value:_propTypes.default.string,multiline:_propTypes.default.bool,suffix:_propTypes.default.node,prefix:_propTypes.default.node,testID:_propTypes.default.string,focusedLabelColor:_propTypes.default.string});(0,_defineProperty2.default)(TextFieldOutlined,"defaultProps",{helperVisible:true});var _default=(0,_withTheme.default)(TextFieldOutlined);exports.default=_default; ================================================ FILE: dist/Components/TextField/TextFieldOutline/TextFieldOutline.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _storybookState=require("@sambego/storybook-state");var _Header=_interopRequireDefault(require("../../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../../storybook/components/Container"));var _storiesOf=require("../../../storybook/helpers/storiesOf");var _=require("../../../");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/TextField/TextFieldOutline/TextFieldOutline.stories.js";var store=new _storybookState.Store({outlinedOne:'',outlinedTwo:'',outlinedThree:''});var _default=(0,_storiesOf.storiesOf)('Components|TextField/Outlined',module).addParameters({jest:['TextFieldOutlined']}).add('simple',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:20}},_react.default.createElement(_Header.default,{title:'Outlined TextField',__source:{fileName:_jsxFileName,lineNumber:21}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:22}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:24}},_react.default.createElement(_.TextField,{type:'outlined',containerStyle:{marginTop:20},label:'Label',value:state.outlinedOne,onChangeText:function onChangeText(value){return store.set({outlinedOne:value});},__source:{fileName:_jsxFileName,lineNumber:25}}),_react.default.createElement(_.TextField,{type:'outlined',containerStyle:{marginTop:20},label:'Label',error:true,value:state.outlinedhree,onChangeText:function onChangeText(value){return store.set({outlinedhree:value});},helperText:'There is an error',__source:{fileName:_jsxFileName,lineNumber:33}}));}));}).add('multiline',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:48}},_react.default.createElement(_Header.default,{title:'Outlined TextField',__source:{fileName:_jsxFileName,lineNumber:49}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:50}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:52}},_react.default.createElement(_.TextField,{type:'outlined',containerStyle:{marginTop:20},label:'Multiline',multiline:true,value:state.outlinedTwo,onChangeText:function onChangeText(value){return store.set({outlinedTwo:value});},__source:{fileName:_jsxFileName,lineNumber:53}}));}));}).add('with leadingIcon',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:67}},_react.default.createElement(_Header.default,{title:'Outlined TextField',__source:{fileName:_jsxFileName,lineNumber:68}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:69}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:71}},_react.default.createElement(_.TextField,{type:'outlined',containerStyle:{marginTop:20},label:'Icon',leadingIcon:_react.default.createElement(_.Icon,{name:'date-range',size:24,color:'#6e6e6e',__source:{fileName:_jsxFileName,lineNumber:77}}),value:state.outlinedOne,onChangeText:function onChangeText(value){return store.set({outlinedOne:value});},__source:{fileName:_jsxFileName,lineNumber:72}}));}));}).add('with trailingIcon',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:88}},_react.default.createElement(_Header.default,{title:'Outlined TextField',__source:{fileName:_jsxFileName,lineNumber:89}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:90}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:92}},_react.default.createElement(_.TextField,{type:'outlined',containerStyle:{marginTop:20},label:'Icon',trailingIcon:_react.default.createElement(_.Icon,{name:'date-range',size:24,color:'#6e6e6e',__source:{fileName:_jsxFileName,lineNumber:98}}),value:state.outlinedOne,onChangeText:function onChangeText(value){return store.set({outlinedOne:value});},__source:{fileName:_jsxFileName,lineNumber:93}}));}));}).add('with prefix',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:109}},_react.default.createElement(_Header.default,{title:'Outlined TextField',__source:{fileName:_jsxFileName,lineNumber:110}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:111}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:113}},_react.default.createElement(_.TextField,{type:'outlined',containerStyle:{marginTop:20},label:'Pounds',prefix:_react.default.createElement(_.BodyText,{text:"$",__source:{fileName:_jsxFileName,lineNumber:118}}),value:state.outlinedOne,onChangeText:function onChangeText(value){return store.set({outlinedOne:value});},__source:{fileName:_jsxFileName,lineNumber:114}}));}));}).add('with suffix',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:128}},_react.default.createElement(_Header.default,{title:'Outlined TextField',__source:{fileName:_jsxFileName,lineNumber:129}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:130}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:132}},_react.default.createElement(_.TextField,{type:'outlined',containerStyle:{marginTop:20},label:'Pounds',suffix:_react.default.createElement(_.Caption,{text:"lbs",__source:{fileName:_jsxFileName,lineNumber:137}}),value:state.outlinedOne,onChangeText:function onChangeText(value){return store.set({outlinedOne:value});},__source:{fileName:_jsxFileName,lineNumber:133}}));}));}).add('with helperText',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:147}},_react.default.createElement(_Header.default,{title:'Outlined TextField',__source:{fileName:_jsxFileName,lineNumber:148}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:149}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:151}},_react.default.createElement(_.TextField,{type:'outlined',containerStyle:{marginTop:20},label:'Label',value:state.outlinedOne,onChangeText:function onChangeText(value){return store.set({outlinedOne:value});},helperText:'This is some helper text',__source:{fileName:_jsxFileName,lineNumber:152}}),_react.default.createElement(_.TextField,{type:'outlined',containerStyle:{marginTop:20},label:'Label',error:true,value:state.outlinedhree,onChangeText:function onChangeText(value){return store.set({outlinedhree:value});},helperText:'There is an error',__source:{fileName:_jsxFileName,lineNumber:161}}));}));}).add('dense',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:176}},_react.default.createElement(_Header.default,{title:'Outlined TextField',__source:{fileName:_jsxFileName,lineNumber:177}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:178}},function(state){return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:180}},_react.default.createElement(_.TextField,{type:'outlined',containerStyle:{marginTop:20},label:'Label',value:state.outlinedOne,onChangeText:function onChangeText(value){return store.set({outlinedOne:value});},dense:true,__source:{fileName:_jsxFileName,lineNumber:181}}),_react.default.createElement(_.TextField,{type:'outlined',containerStyle:{marginTop:20},error:true,value:state.outlinedhree,onChangeText:function onChangeText(value){return store.set({outlinedhree:value});},dense:true,__source:{fileName:_jsxFileName,lineNumber:190}}));}));});exports.default=_default; ================================================ FILE: dist/Components/TextField/TextFieldOutline/TextFieldOutline.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.OUTLINED_LEFT_PADDING=void 0;var _reactNative=require("react-native");var OUTLINED_LEFT_PADDING=14;exports.OUTLINED_LEFT_PADDING=OUTLINED_LEFT_PADDING;var styles=_reactNative.StyleSheet.create({containerStyle:{},textField:{height:56,paddingHorizontal:OUTLINED_LEFT_PADDING},outlinedInput:{borderRadius:4}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/TextField/TextFieldUnderline/TextFieldUnderline.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _TextFieldUnderline=_interopRequireDefault(require("./TextFieldUnderline.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/TextField/TextFieldUnderline/TextFieldUnderline.js";var TextFieldUnderline=function(_Component){(0,_inherits2.default)(TextFieldUnderline,_Component);function TextFieldUnderline(props){var _this;(0,_classCallCheck2.default)(this,TextFieldUnderline);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(TextFieldUnderline).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{underLineXAnimation:new _reactNative.Animated.Value(0),animationDuration:200,animationEasing:_reactNative.Easing.bounce});return _this;}(0,_createClass2.default)(TextFieldUnderline,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var _this$props=this.props,focused=_this$props.focused,error=_this$props.error;if(focused!==prevProps.focused&&!error){this._handleUnderlineAnimation();}}},{key:"_handleUnderlineAnimation",value:function _handleUnderlineAnimation(){var focused=this.props.focused;var _this$state=this.state,underLineXAnimation=_this$state.underLineXAnimation,animationEasing=_this$state.animationEasing,animationDuration=_this$state.animationDuration;var value=focused?1:0;_reactNative.Animated.timing(underLineXAnimation,{toValue:value,duration:animationDuration,easing:animationEasing,useNativeDriver:true}).start();}},{key:"render",value:function render(){var _this$props2=this.props,error=_this$props2.error,underlineColor=_this$props2.underlineColor,underlineActiveColor=_this$props2.underlineActiveColor,focused=_this$props2.focused;var underLineXAnimation=this.state.underLineXAnimation;var baseUnderlineScale=0.5;if(!underlineColor)underlineColor='rgba(0, 0, 0, 0.42)';if(!underlineActiveColor)underlineActiveColor='rgba(33, 150, 243, 1)';if(error){underlineColor='red';baseUnderlineScale=1;}return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_TextFieldUnderline.default.underline,{backgroundColor:underlineColor,transform:[{scaleY:baseUnderlineScale}]}],__source:{fileName:_jsxFileName,lineNumber:66}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_TextFieldUnderline.default.underline,{backgroundColor:underlineActiveColor,opacity:focused&&!error?1:0,transform:[{scaleX:underLineXAnimation},{scaleY:focused?2:0}]}],__source:{fileName:_jsxFileName,lineNumber:75}}));}}]);return TextFieldUnderline;}(_react.Component);(0,_defineProperty2.default)(TextFieldUnderline,"propTypes",{style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),error:_propTypes.default.bool,underlineColor:_propTypes.default.string,underlineActiveColor:_propTypes.default.string,focused:_propTypes.default.bool});var _default=(0,_withTheme.default)(TextFieldUnderline);exports.default=_default; ================================================ FILE: dist/Components/TextField/TextFieldUnderline/TextFieldUnderline.styles.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var styles=_reactNative.StyleSheet.create({underline:{position:'absolute',left:0,right:0,bottom:0,height:2}});var _default=styles;exports.default=_default; ================================================ FILE: dist/Components/TextField/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _TextField.default;}});Object.defineProperty(exports,"TextFieldHelperText",{enumerable:true,get:function get(){return _TextFieldHelperText.default;}});var _TextField=_interopRequireDefault(require("./TextField"));var _TextFieldHelperText=_interopRequireDefault(require("./TextFieldHelperText")); ================================================ FILE: dist/Components/ToggleButton/ToggleButton.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Ripple=_interopRequireDefault(require("../Ripple/Ripple.js"));var _ToggleButtonGroup=require("./ToggleButtonGroup/ToggleButtonGroup");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/ToggleButton/ToggleButton.js";var ToggleButton=function(_Component){(0,_inherits2.default)(ToggleButton,_Component);function ToggleButton(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,ToggleButton);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(ToggleButton)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{isActive:false});return _this;}(0,_createClass2.default)(ToggleButton,[{key:"componentDidMount",value:function componentDidMount(){var active=this.props.active;if(active){this.setState({isActive:true});}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var active=this.props.active;if(active!=prevProps.active){this.setState({isActive:active});}}},{key:"handleToggle",value:function handleToggle(){var onPress=this.props.onPress;var isActive=this.state.isActive;this.setState({isActive:!isActive});if(onPress)onPress();}},{key:"render",value:function render(){var _this2=this;var _this$props=this.props,style=_this$props.style,size=_this$props.size,rippleColor=_this$props.rippleColor,value=_this$props.value,activeNode=_this$props.activeNode,inActiveNode=_this$props.inActiveNode,rippleContainerBorderRadius=_this$props.rippleContainerBorderRadius,testID=_this$props.testID;var isActive=this.state.isActive;return _react.default.createElement(_ToggleButtonGroup.ToggleButtonContext.Consumer,{__source:{fileName:_jsxFileName,lineNumber:65}},function(context){return _react.default.createElement(_Ripple.default,{rippleContainerBorderRadius:rippleContainerBorderRadius||rippleContainerBorderRadius==0?rippleContainerBorderRadius:100,rippleColor:rippleColor?rippleColor:'rgb(0, 0, 0)',onPress:function onPress(){if(context&&context.updateActive){return context.updateActive(value);}else{return _this2.handleToggle();}},testID:testID,style:[style,{height:size*1.2,width:size*1.2,justifyContent:'center',alignItems:'center'}],__source:{fileName:_jsxFileName,lineNumber:67}},isActive||context.active==value?activeNode:inActiveNode);});}}]);return ToggleButton;}(_react.Component);(0,_defineProperty2.default)(ToggleButton,"propTypes",{style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),active:_propTypes.default.bool,onPress:_propTypes.default.func,value:_propTypes.default.string,activeNode:_propTypes.default.node,inActiveNode:_propTypes.default.node,rippleColor:_propTypes.default.string,size:_propTypes.default.number,rippleContainerBorderRadius:_propTypes.default.number,testID:_propTypes.default.string});(0,_defineProperty2.default)(ToggleButton,"defaultProps",{size:30});var _default=(0,_withTheme.default)(ToggleButton);exports.default=_default; ================================================ FILE: dist/Components/ToggleButton/ToggleButton.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/ToggleButton/ToggleButton.stories.js";var _default=(0,_storiesOf.storiesOf)('Components|Toggle Button',module).addParameters({jest:['ToggleButton']}).add('Single',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:12}},_react.default.createElement(_Header.default,{title:'Toggle Button',__source:{fileName:_jsxFileName,lineNumber:13}}),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row'},__source:{fileName:_jsxFileName,lineNumber:14}},_react.default.createElement(_.ToggleButton,{activeNode:_react.default.createElement(_.Icon,{name:"alarm",size:32,__source:{fileName:_jsxFileName,lineNumber:16}}),inActiveNode:_react.default.createElement(_.Icon,{name:"alarm",size:32,style:{opacity:0.5},__source:{fileName:_jsxFileName,lineNumber:18}}),size:32,__source:{fileName:_jsxFileName,lineNumber:15}}),_react.default.createElement(_.ToggleButton,{activeNode:_react.default.createElement(_.Icon,{name:"face",size:32,color:'purple',__source:{fileName:_jsxFileName,lineNumber:23}}),inActiveNode:_react.default.createElement(_.Icon,{name:"face",size:32,style:{opacity:0.5},color:'purple',__source:{fileName:_jsxFileName,lineNumber:25}}),size:32,__source:{fileName:_jsxFileName,lineNumber:22}}),_react.default.createElement(_.ToggleButton,{activeNode:_react.default.createElement(_.Icon,{name:"arrow-back",size:32,color:'orange',__source:{fileName:_jsxFileName,lineNumber:35}}),inActiveNode:_react.default.createElement(_.Icon,{name:"arrow-back",size:32,style:{opacity:0.5},color:'orange',__source:{fileName:_jsxFileName,lineNumber:37}}),size:32,__source:{fileName:_jsxFileName,lineNumber:34}})),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row'},__source:{fileName:_jsxFileName,lineNumber:47}},_react.default.createElement(_.ToggleButton,{activeNode:_react.default.createElement(_.Icon,{name:"favorite",size:32,__source:{fileName:_jsxFileName,lineNumber:49}}),inActiveNode:_react.default.createElement(_.Icon,{name:"favorite-border",size:32,__source:{fileName:_jsxFileName,lineNumber:50}}),size:32,__source:{fileName:_jsxFileName,lineNumber:48}}),_react.default.createElement(_.ToggleButton,{activeNode:_react.default.createElement(_.Icon,{name:"brightness-1",size:32,color:'purple',__source:{fileName:_jsxFileName,lineNumber:54}}),inActiveNode:_react.default.createElement(_.Icon,{name:"adjust",size:32,color:'purple',__source:{fileName:_jsxFileName,lineNumber:55}}),size:32,__source:{fileName:_jsxFileName,lineNumber:53}}),_react.default.createElement(_.ToggleButton,{activeNode:_react.default.createElement(_.Icon,{name:"label",size:32,color:'orange',__source:{fileName:_jsxFileName,lineNumber:59}}),inActiveNode:_react.default.createElement(_.Icon,{name:"label-outline",size:32,style:{opacity:0.5},color:'orange',__source:{fileName:_jsxFileName,lineNumber:61}}),size:32,__source:{fileName:_jsxFileName,lineNumber:58}})));}).add('Custom',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:74}},_react.default.createElement(_Header.default,{title:'Toggle Button',__source:{fileName:_jsxFileName,lineNumber:75}}),_react.default.createElement(_reactNative.View,{style:{flexDirection:'row'},__source:{fileName:_jsxFileName,lineNumber:76}},_react.default.createElement(_.ToggleButton,{activeNode:_react.default.createElement(_reactNative.View,{style:{backgroundColor:'rgba(0,0,0,.12)',borderWidth:1,borderColor:'rgba(0,0,0,.12)',padding:8},__source:{fileName:_jsxFileName,lineNumber:79}},_react.default.createElement(_.Icon,{name:"format-italic",size:20,__source:{fileName:_jsxFileName,lineNumber:86}})),inActiveNode:_react.default.createElement(_reactNative.View,{style:{backgroundColor:'white',borderWidth:1,borderColor:'rgba(0,0,0,.12)',padding:8},__source:{fileName:_jsxFileName,lineNumber:90}},_react.default.createElement(_.Icon,{name:"format-italic",size:20,__source:{fileName:_jsxFileName,lineNumber:97}})),rippleContainerBorderRadius:0,__source:{fileName:_jsxFileName,lineNumber:77}}),_react.default.createElement(_.ToggleButton,{activeNode:_react.default.createElement(_reactNative.View,{style:{backgroundColor:'rgba(0,0,0,.12)',borderWidth:1,borderRightWidth:0,borderLeftWidth:0,borderColor:'rgba(0,0,0,.12)',padding:8},__source:{fileName:_jsxFileName,lineNumber:104}},_react.default.createElement(_.Icon,{name:"format-bold",size:20,__source:{fileName:_jsxFileName,lineNumber:113}})),inActiveNode:_react.default.createElement(_reactNative.View,{style:{backgroundColor:'white',borderWidth:1,borderRightWidth:0,borderLeftWidth:0,borderColor:'rgba(0,0,0,.12)',padding:8},__source:{fileName:_jsxFileName,lineNumber:117}},_react.default.createElement(_.Icon,{name:"format-bold",size:20,__source:{fileName:_jsxFileName,lineNumber:126}})),rippleContainerBorderRadius:0,__source:{fileName:_jsxFileName,lineNumber:102}}),_react.default.createElement(_.ToggleButton,{activeNode:_react.default.createElement(_reactNative.View,{style:{backgroundColor:'rgba(0,0,0,.12)',borderWidth:1,borderColor:'rgba(0,0,0,.12)',padding:8},__source:{fileName:_jsxFileName,lineNumber:133}},_react.default.createElement(_.Icon,{name:"format-underlined",size:20,__source:{fileName:_jsxFileName,lineNumber:140}})),inActiveNode:_react.default.createElement(_reactNative.View,{style:{backgroundColor:'white',borderWidth:1,borderColor:'rgba(0,0,0,.12)',padding:8},__source:{fileName:_jsxFileName,lineNumber:144}},_react.default.createElement(_.Icon,{name:"format-underlined",size:20,__source:{fileName:_jsxFileName,lineNumber:151}})),rippleContainerBorderRadius:0,__source:{fileName:_jsxFileName,lineNumber:131}})));}).add('Group',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:160}},_react.default.createElement(_Header.default,{title:'Toggle Button Group',__source:{fileName:_jsxFileName,lineNumber:161}}),_react.default.createElement(_.ToggleButtonGroup,{__source:{fileName:_jsxFileName,lineNumber:162}},_react.default.createElement(_reactNative.View,{style:{flexDirection:'row'},__source:{fileName:_jsxFileName,lineNumber:163}},_react.default.createElement(_.ToggleButton,{activeNode:_react.default.createElement(_reactNative.View,{style:{backgroundColor:'rgba(0,0,0,.12)',borderWidth:1,borderColor:'rgba(0,0,0,.12)',padding:8},__source:{fileName:_jsxFileName,lineNumber:166}},_react.default.createElement(_.Icon,{name:"format-align-center",size:20,__source:{fileName:_jsxFileName,lineNumber:173}})),inActiveNode:_react.default.createElement(_reactNative.View,{style:{backgroundColor:'white',borderWidth:1,borderColor:'rgba(0,0,0,.12)',padding:8},__source:{fileName:_jsxFileName,lineNumber:177}},_react.default.createElement(_.Icon,{name:"format-align-center",size:20,__source:{fileName:_jsxFileName,lineNumber:184}})),rippleContainerBorderRadius:0,value:'center',__source:{fileName:_jsxFileName,lineNumber:164}}),_react.default.createElement(_.ToggleButton,{value:'bold',activeNode:_react.default.createElement(_reactNative.View,{style:{backgroundColor:'rgba(0,0,0,.12)',borderWidth:1,borderRightWidth:0,borderLeftWidth:0,borderColor:'rgba(0,0,0,.12)',padding:8},__source:{fileName:_jsxFileName,lineNumber:193}},_react.default.createElement(_.Icon,{name:"format-align-left",size:20,__source:{fileName:_jsxFileName,lineNumber:202}})),inActiveNode:_react.default.createElement(_reactNative.View,{style:{backgroundColor:'white',borderWidth:1,borderRightWidth:0,borderLeftWidth:0,borderColor:'rgba(0,0,0,.12)',padding:8},__source:{fileName:_jsxFileName,lineNumber:206}},_react.default.createElement(_.Icon,{name:"format-align-left",size:20,__source:{fileName:_jsxFileName,lineNumber:215}})),rippleContainerBorderRadius:0,__source:{fileName:_jsxFileName,lineNumber:190}}),_react.default.createElement(_.ToggleButton,{value:'underlined',activeNode:_react.default.createElement(_reactNative.View,{style:{backgroundColor:'rgba(0,0,0,.12)',borderWidth:1,borderColor:'rgba(0,0,0,.12)',padding:8},__source:{fileName:_jsxFileName,lineNumber:223}},_react.default.createElement(_.Icon,{name:"format-align-right",size:20,__source:{fileName:_jsxFileName,lineNumber:230}})),inActiveNode:_react.default.createElement(_reactNative.View,{style:{backgroundColor:'white',borderWidth:1,borderColor:'rgba(0,0,0,.12)',padding:8},__source:{fileName:_jsxFileName,lineNumber:234}},_react.default.createElement(_.Icon,{name:"format-align-right",size:20,__source:{fileName:_jsxFileName,lineNumber:241}})),rippleContainerBorderRadius:0,__source:{fileName:_jsxFileName,lineNumber:220}}))));});exports.default=_default; ================================================ FILE: dist/Components/ToggleButton/ToggleButton.styles.js ================================================ ================================================ FILE: dist/Components/ToggleButton/ToggleButtonGroup/ToggleButtonGroup.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.ToggleButtonContext=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/ToggleButton/ToggleButtonGroup/ToggleButtonGroup.js";var ToggleButtonContext=_react.default.createContext({updateActive:'',active:''});exports.ToggleButtonContext=ToggleButtonContext;var ToggleButtonGroup=function(_Component){(0,_inherits2.default)(ToggleButtonGroup,_Component);function ToggleButtonGroup(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,ToggleButtonGroup);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(ToggleButtonGroup)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{active:''});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"updateActive",function(value){_this.setState({active:value});if(_this.props.onPress)_this.props.onPress(value);});return _this;}(0,_createClass2.default)(ToggleButtonGroup,[{key:"render",value:function render(){var children=this.props.children;return _react.default.createElement(ToggleButtonContext.Provider,{value:{updateActive:this.updateActive,active:this.state.active},__source:{fileName:_jsxFileName,lineNumber:27}},children);}}]);return ToggleButtonGroup;}(_react.Component);(0,_defineProperty2.default)(ToggleButtonGroup,"propTypes",{onPress:_propTypes.default.func,children:_propTypes.default.node});var _default=(0,_withTheme.default)(ToggleButtonGroup);exports.default=_default; ================================================ FILE: dist/Components/ToggleButton/ToggleButtonGroup/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _ToggleButtonGroup.default;}});var _ToggleButtonGroup=_interopRequireDefault(require("./ToggleButtonGroup")); ================================================ FILE: dist/Components/ToggleButton/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"default",{enumerable:true,get:function get(){return _ToggleButton.default;}});Object.defineProperty(exports,"ToggleButtonGroup",{enumerable:true,get:function get(){return _ToggleButtonGroup.default;}});var _ToggleButton=_interopRequireDefault(require("./ToggleButton"));var _ToggleButtonGroup=_interopRequireDefault(require("./ToggleButtonGroup")); ================================================ FILE: dist/Components/Tooltip/Tooltip.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _Paper=_interopRequireDefault(require("../Paper/Paper.js"));var _Menu=_interopRequireDefault(require("../Menu/Menu.js"));var _shadow=_interopRequireDefault(require("../../Utils/Shadow/shadow.js"));var _Hoverable=_interopRequireDefault(require("../../Utils/Hoverable/Hoverable.js"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Tooltip=_interopRequireDefault(require("./Tooltip.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Tooltip/Tooltip.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i6){textStyle=theme.headingOne;}textStyle=this.numberToStyle(type);return _react.default.createElement(_BaseText.default,(0,_extends2.default)({typographyStyles:textStyle,theme:theme},this.props,{__source:{fileName:_jsxFileName,lineNumber:37}}),children?children:text);}}]);return Heading;}(_react.Component);(0,_defineProperty2.default)(Heading,"propTypes",{type:_propTypes.default.number,children:_propTypes.default.node,theme:_propTypes.default.object,text:_propTypes.default.string});var _default=(0,_withTheme.default)(Heading);exports.default=_default; ================================================ FILE: dist/Components/Typography/Overline/Overline.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _BaseText=_interopRequireDefault(require("../BaseText/BaseText"));var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Typography/Overline/Overline.js";var Overline=function(_Component){(0,_inherits2.default)(Overline,_Component);function Overline(){(0,_classCallCheck2.default)(this,Overline);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Overline).apply(this,arguments));}(0,_createClass2.default)(Overline,[{key:"render",value:function render(){var _this$props=this.props,theme=_this$props.theme,children=_this$props.children,text=_this$props.text;return _react.default.createElement(_BaseText.default,(0,_extends2.default)({typographyStyles:theme.overline,theme:theme},this.props,{__source:{fileName:_jsxFileName,lineNumber:16}}),children?children:text);}}]);return Overline;}(_react.Component);(0,_defineProperty2.default)(Overline,"propTypes",{children:_propTypes.default.node,theme:_propTypes.default.object,text:_propTypes.default.string});var _default=(0,_withTheme.default)(Overline);exports.default=_default; ================================================ FILE: dist/Components/Typography/Subtitle/Subtitle.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _BaseText=_interopRequireDefault(require("../BaseText/BaseText"));var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Typography/Subtitle/Subtitle.js";var Subtitle=function(_Component){(0,_inherits2.default)(Subtitle,_Component);function Subtitle(){(0,_classCallCheck2.default)(this,Subtitle);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Subtitle).apply(this,arguments));}(0,_createClass2.default)(Subtitle,[{key:"numberToStyle",value:function numberToStyle(num){var theme=this.props.theme;var numArray=[theme.subtitleOne,theme.subtitleTwo];return numArray[num-1];}},{key:"render",value:function render(){var _this$props=this.props,type=_this$props.type,theme=_this$props.theme,children=_this$props.children,text=_this$props.text;var textStyle;if(type<1&&type>2){textStyle=theme.subtitleOne;}textStyle=this.numberToStyle(type);return _react.default.createElement(_BaseText.default,(0,_extends2.default)({typographyStyles:textStyle,theme:theme},this.props,{__source:{fileName:_jsxFileName,lineNumber:29}}),children?children:text);}}]);return Subtitle;}(_react.Component);(0,_defineProperty2.default)(Subtitle,"propTypes",{type:_propTypes.default.number,children:_propTypes.default.node,theme:_propTypes.default.object,text:_propTypes.default.string});var _default=(0,_withTheme.default)(Subtitle);exports.default=_default; ================================================ FILE: dist/Components/Typography/Typography.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _reactNative=require("react-native");var _=require("../..");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Typography/Typography.stories.js";var _default=(0,_storiesOf.storiesOf)('Components|Typography',module).addParameters({jest:['BodyText','Caption','Heading','Overline','Subtitle']}).add('Components',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:14}},_react.default.createElement(_Header.default,{title:'Typography',__source:{fileName:_jsxFileName,lineNumber:15}}),_react.default.createElement(_reactNative.View,{style:{marginTop:50},__source:{fileName:_jsxFileName,lineNumber:16}},_react.default.createElement(_.Heading,{type:1,text:"h1",__source:{fileName:_jsxFileName,lineNumber:17}}),_react.default.createElement(_.Heading,{type:2,text:"h2",__source:{fileName:_jsxFileName,lineNumber:18}}),_react.default.createElement(_.Heading,{type:3,text:"h3",__source:{fileName:_jsxFileName,lineNumber:19}}),_react.default.createElement(_.Heading,{type:4,text:"h4",__source:{fileName:_jsxFileName,lineNumber:20}}),_react.default.createElement(_.Heading,{type:5,text:"h5",__source:{fileName:_jsxFileName,lineNumber:21}}),_react.default.createElement(_.Heading,{type:6,text:"h6",__source:{fileName:_jsxFileName,lineNumber:22}}),_react.default.createElement(_.Subtitle,{type:1,text:"Subtitle 1",__source:{fileName:_jsxFileName,lineNumber:23}}),_react.default.createElement(_.Subtitle,{type:2,text:"Subtitle 2",__source:{fileName:_jsxFileName,lineNumber:24}}),_react.default.createElement(_.BodyText,{type:1,text:"Body 1",__source:{fileName:_jsxFileName,lineNumber:25}}),_react.default.createElement(_.BodyText,{type:1,text:"Body 1 secondary",themeColor:"secondary",__source:{fileName:_jsxFileName,lineNumber:26}}),_react.default.createElement(_.BodyText,{type:2,text:"Body 2",__source:{fileName:_jsxFileName,lineNumber:27}}),_react.default.createElement(_.BodyText,{type:2,text:"Body 2 secondary",themeColor:"secondary",__source:{fileName:_jsxFileName,lineNumber:28}}),_react.default.createElement(_.Caption,{text:"Caption",__source:{fileName:_jsxFileName,lineNumber:29}}),_react.default.createElement(_.Overline,{text:"Overline",__source:{fileName:_jsxFileName,lineNumber:30}})));});exports.default=_default; ================================================ FILE: dist/Components/Typography/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"BodyText",{enumerable:true,get:function get(){return _BodyText.default;}});Object.defineProperty(exports,"Caption",{enumerable:true,get:function get(){return _Caption.default;}});Object.defineProperty(exports,"Heading",{enumerable:true,get:function get(){return _Heading.default;}});Object.defineProperty(exports,"Overline",{enumerable:true,get:function get(){return _Overline.default;}});Object.defineProperty(exports,"Subtitle",{enumerable:true,get:function get(){return _Subtitle.default;}});var _BodyText=_interopRequireDefault(require("./BodyText/BodyText.js"));var _Caption=_interopRequireDefault(require("./Caption/Caption.js"));var _Heading=_interopRequireDefault(require("./Heading/Heading.js"));var _Overline=_interopRequireDefault(require("./Overline/Overline.js"));var _Subtitle=_interopRequireDefault(require("./Subtitle/Subtitle.js")); ================================================ FILE: dist/Core/BreadProvider.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _ThemeContext=_interopRequireDefault(require("../Theme/ThemeContext"));var _jsxFileName="/Users/cody/projects/material-bread/src/Core/BreadProvider.js";var BreadProvider=function(_Component){(0,_inherits2.default)(BreadProvider,_Component);function BreadProvider(){(0,_classCallCheck2.default)(this,BreadProvider);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(BreadProvider).apply(this,arguments));}(0,_createClass2.default)(BreadProvider,[{key:"render",value:function render(){var _this$props=this.props,children=_this$props.children,value=_this$props.value;return _react.default.createElement(_ThemeContext.default.Provider,{value:value,__source:{fileName:_jsxFileName,lineNumber:18}},children);}}]);return BreadProvider;}(_react.Component);exports.default=BreadProvider;(0,_defineProperty2.default)(BreadProvider,"propTypes",{children:_propTypes.default.node.isRequired,value:_propTypes.default.object});(0,_defineProperty2.default)(BreadProvider,"defaultProps",{value:{}}); ================================================ FILE: dist/Core/colors/amber.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var amber={50:'#fff8e1',100:'#ffecb3',200:'#ffe082',300:'#ffd54f',400:'#ffca28',500:'#ffc107',600:'#ffb300',700:'#ffa000',800:'#ff8f00',900:'#ff6f00',A100:'#ffe57f',A200:'#ffd740',A400:'#ffc400',A700:'#ffab00'};var _default=amber;exports.default=_default; ================================================ FILE: dist/Core/colors/blue.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var blue={50:'#e3f2fd',100:'#bbdefb',200:'#90caf9',300:'#64b5f6',400:'#42a5f5',500:'#2196f3',600:'#1e88e5',700:'#1976d2',800:'#1565c0',900:'#0d47a1',A100:'#82b1ff',A200:'#448aff',A400:'#2979ff',A700:'#2962ff'};var _default=blue;exports.default=_default; ================================================ FILE: dist/Core/colors/blueGrey.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var blueGrey={50:'#eceff1',100:'#cfd8dc',200:'#b0bec5',300:'#90a4ae',400:'#78909c',500:'#607d8b',600:'#546e7a',700:'#455a64',800:'#37474f',900:'#263238',A100:'#cfd8dc',A200:'#b0bec5',A400:'#78909c',A700:'#455a64'};var _default=blueGrey;exports.default=_default; ================================================ FILE: dist/Core/colors/brown.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var brown={50:'#efebe9',100:'#d7ccc8',200:'#bcaaa4',300:'#a1887f',400:'#8d6e63',500:'#795548',600:'#6d4c41',700:'#5d4037',800:'#4e342e',900:'#3e2723',A100:'#d7ccc8',A200:'#bcaaa4',A400:'#8d6e63',A700:'#5d4037'};var _default=brown;exports.default=_default; ================================================ FILE: dist/Core/colors/cyan.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var cyan={50:'#e0f7fa',100:'#b2ebf2',200:'#80deea',300:'#4dd0e1',400:'#26c6da',500:'#00bcd4',600:'#00acc1',700:'#0097a7',800:'#00838f',900:'#006064',A100:'#84ffff',A200:'#18ffff',A400:'#00e5ff',A700:'#00b8d4'};var _default=cyan;exports.default=_default; ================================================ FILE: dist/Core/colors/deepOrange.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var deepOrange={50:'#fbe9e7',100:'#ffccbc',200:'#ffab91',300:'#ff8a65',400:'#ff7043',500:'#ff5722',600:'#f4511e',700:'#e64a19',800:'#d84315',900:'#bf360c',A100:'#ff9e80',A200:'#ff6e40',A400:'#ff3d00',A700:'#dd2c00'};var _default=deepOrange;exports.default=_default; ================================================ FILE: dist/Core/colors/deepPurple.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var deepPurple={50:'#ede7f6',100:'#d1c4e9',200:'#b39ddb',300:'#9575cd',400:'#7e57c2',500:'#673ab7',600:'#5e35b1',700:'#512da8',800:'#4527a0',900:'#311b92',A100:'#b388ff',A200:'#7c4dff',A400:'#651fff',A700:'#6200ea'};var _default=deepPurple;exports.default=_default; ================================================ FILE: dist/Core/colors/green.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var green={50:'#e8f5e9',100:'#c8e6c9',200:'#a5d6a7',300:'#81c784',400:'#66bb6a',500:'#4caf50',600:'#43a047',700:'#388e3c',800:'#2e7d32',900:'#1b5e20',A100:'#b9f6ca',A200:'#69f0ae',A400:'#00e676',A700:'#00c853'};var _default=green;exports.default=_default; ================================================ FILE: dist/Core/colors/grey.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var grey={50:'#fafafa',100:'#f5f5f5',200:'#eeeeee',300:'#e0e0e0',400:'#bdbdbd',500:'#9e9e9e',600:'#757575',700:'#616161',800:'#424242',900:'#212121',A100:'#d5d5d5',A200:'#aaaaaa',A400:'#303030',A700:'#616161'};var _default=grey;exports.default=_default; ================================================ FILE: dist/Core/colors/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _amber=_interopRequireDefault(require("./amber"));var _blue=_interopRequireDefault(require("./blue"));var _blueGrey=_interopRequireDefault(require("./blueGrey"));var _brown=_interopRequireDefault(require("./brown"));var _cyan=_interopRequireDefault(require("./cyan"));var _deepOrange=_interopRequireDefault(require("./deepOrange"));var _deepPurple=_interopRequireDefault(require("./deepPurple"));var _green=_interopRequireDefault(require("./green"));var _grey=_interopRequireDefault(require("./grey"));var _indigo=_interopRequireDefault(require("./indigo"));var _lightBlue=_interopRequireDefault(require("./lightBlue"));var _lightGreen=_interopRequireDefault(require("./lightGreen"));var _lime=_interopRequireDefault(require("./lime"));var _orange=_interopRequireDefault(require("./orange"));var _pink=_interopRequireDefault(require("./pink"));var _purple=_interopRequireDefault(require("./purple"));var _red=_interopRequireDefault(require("./red"));var _teal=_interopRequireDefault(require("./teal"));var _yellow=_interopRequireDefault(require("./yellow"));var Colors={amber:_amber.default,blue:_blue.default,blueGrey:_blueGrey.default,brown:_brown.default,cyan:_cyan.default,deepOrange:_deepOrange.default,deepPurple:_deepPurple.default,green:_green.default,grey:_grey.default,indigo:_indigo.default,lightBlue:_lightBlue.default,lightGreen:_lightGreen.default,lime:_lime.default,orange:_orange.default,pink:_pink.default,purple:_purple.default,red:_red.default,teal:_teal.default,yellow:_yellow.default};var _default=Colors;exports.default=_default; ================================================ FILE: dist/Core/colors/indigo.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var indigo={50:'#e8eaf6',100:'#c5cae9',200:'#9fa8da',300:'#7986cb',400:'#5c6bc0',500:'#3f51b5',600:'#3949ab',700:'#303f9f',800:'#283593',900:'#1a237e',A100:'#8c9eff',A200:'#536dfe',A400:'#3d5afe',A700:'#304ffe'};var _default=indigo;exports.default=_default; ================================================ FILE: dist/Core/colors/lightBlue.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var lightBlue={50:'#e1f5fe',100:'#b3e5fc',200:'#81d4fa',300:'#4fc3f7',400:'#29b6f6',500:'#03a9f4',600:'#039be5',700:'#0288d1',800:'#0277bd',900:'#01579b',A100:'#80d8ff',A200:'#40c4ff',A400:'#00b0ff',A700:'#0091ea'};var _default=lightBlue;exports.default=_default; ================================================ FILE: dist/Core/colors/lightGreen.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var lightGreen={50:'#f1f8e9',100:'#dcedc8',200:'#c5e1a5',300:'#aed581',400:'#9ccc65',500:'#8bc34a',600:'#7cb342',700:'#689f38',800:'#558b2f',900:'#33691e',A100:'#ccff90',A200:'#b2ff59',A400:'#76ff03',A700:'#64dd17'};var _default=lightGreen;exports.default=_default; ================================================ FILE: dist/Core/colors/lime.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var lime={50:'#f9fbe7',100:'#f0f4c3',200:'#e6ee9c',300:'#dce775',400:'#d4e157',500:'#cddc39',600:'#c0ca33',700:'#afb42b',800:'#9e9d24',900:'#827717',A100:'#f4ff81',A200:'#eeff41',A400:'#c6ff00',A700:'#aeea00'};var _default=lime;exports.default=_default; ================================================ FILE: dist/Core/colors/orange.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var orange={50:'#fff3e0',100:'#ffe0b2',200:'#ffcc80',300:'#ffb74d',400:'#ffa726',500:'#ff9800',600:'#fb8c00',700:'#f57c00',800:'#ef6c00',900:'#e65100',A100:'#ffd180',A200:'#ffab40',A400:'#ff9100',A700:'#ff6d00'};var _default=orange;exports.default=_default; ================================================ FILE: dist/Core/colors/pink.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var pink={50:'#fce4ec',100:'#f8bbd0',200:'#f48fb1',300:'#f06292',400:'#ec407a',500:'#e91e63',600:'#d81b60',700:'#c2185b',800:'#ad1457',900:'#880e4f',A100:'#ff80ab',A200:'#ff4081',A400:'#f50057',A700:'#c51162'};var _default=pink;exports.default=_default; ================================================ FILE: dist/Core/colors/purple.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var purple={50:'#f3e5f5',100:'#e1bee7',200:'#ce93d8',300:'#ba68c8',400:'#ab47bc',500:'#9c27b0',600:'#8e24aa',700:'#7b1fa2',800:'#6a1b9a',900:'#4a148c',A100:'#ea80fc',A200:'#e040fb',A400:'#d500f9',A700:'#aa00ff'};var _default=purple;exports.default=_default; ================================================ FILE: dist/Core/colors/red.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var red={50:'#ffebee',100:'#ffcdd2',200:'#ef9a9a',300:'#e57373',400:'#ef5350',500:'#f44336',600:'#e53935',700:'#d32f2f',800:'#c62828',900:'#b71c1c',A100:'#ff8a80',A200:'#ff5252',A400:'#ff1744',A700:'#d50000'};var _default=red;exports.default=_default; ================================================ FILE: dist/Core/colors/teal.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var teal={50:'#e0f2f1',100:'#b2dfdb',200:'#80cbc4',300:'#4db6ac',400:'#26a69a',500:'#009688',600:'#00897b',700:'#00796b',800:'#00695c',900:'#004d40',A100:'#a7ffeb',A200:'#64ffda',A400:'#1de9b6',A700:'#00bfa5'};var _default=teal;exports.default=_default; ================================================ FILE: dist/Core/colors/yellow.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var yellow={50:'#fffde7',100:'#fff9c4',200:'#fff59d',300:'#fff176',400:'#ffee58',500:'#ffeb3b',600:'#fdd835',700:'#fbc02d',800:'#f9a825',900:'#f57f17',A100:'#ffff8d',A200:'#ffff00',A400:'#ffea00',A700:'#ffd600'};var _default=yellow;exports.default=_default; ================================================ FILE: dist/Theme/ThemeContext.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _defaultTheme=_interopRequireDefault(require("./defaultTheme"));var ThemeContext=_react.default.createContext(_defaultTheme.default);var _default=ThemeContext;exports.default=_default; ================================================ FILE: dist/Theme/defaultTheme.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _reactNative=require("react-native");var _shadow=_interopRequireDefault(require("../Utils/Shadow/shadow"));function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i export const defaultTheme: Theme export type WithThemeProps = { theme: Theme } type WithTheme =

( Component: React.ElementType

, ) => React.ElementType> export const withTheme: WithTheme export interface BreadProviderProps { children: React.ReactNode value?: Theme } export class BreadProvider extends React.Component { render(): React.ReactElement } export interface AnchorProps { url?: string children?: React.ReactNode target?: string testID?: string } export class Anchor extends React.Component { render(): React.ReactElement } export interface HoverableProps { children?: React.ReactNode | ((...args: any[]) => any) onHoverIn?: (...args: any[]) => void onHoverOut?: (...args: any[]) => void testID?: string } export class Hoverable extends React.Component { render(): React.ReactElement } export type ShadowElevation = | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 export type ShadowAndroidReturn = { elevation: ShadowElevation } export type ShadowDefaultReturn = { shadowColor: Color shadowOffset: { width: number height: number } shadowOpacity: number shadowRadius: number } export const shadow: ( elevation: ShadowElevation, ) => ShadowAndroidReturn | ShadowDefaultReturn export type ColorRange = { 50: Color 100: Color 200: Color 300: Color 400: Color 500: Color 600: Color 700: Color 800: Color 900: Color A100: Color A200: Color A400: Color A700: Color } export const Colors: { amber: ColorRange blue: ColorRange blueGrey: ColorRange brown: ColorRange cyan: ColorRange deepOrange: ColorRange deepPurple: ColorRange green: ColorRange grey: ColorRange indigo: ColorRange lightBlue: ColorRange lightGreen: ColorRange lime: ColorRange orange: ColorRange pink: ColorRange purple: ColorRange red: ColorRange teal: ColorRange yellow: ColorRange } export interface AvatarProps { style?: StyleProp theme?: Theme color?: Color type?: 'image' | 'icon' | 'text' size?: number contentSize?: number contentColor?: Color contentStyles?: StyleProp content?: string image?: React.ReactNode onPress?: (e: GestureResponderEvent) => void ripple?: boolean rippleProps?: RippleProps testID?: string children?: React.ReactNode } export class Avatar extends React.Component { render(): React.ReactElement } export interface BadgeProps { color?: Color textColor?: Color content?: string | number maxValue?: number children?: React.ReactNode size?: number style?: StyleProp position?: 'right' | 'left' onPress?: (e: GestureResponderEvent) => void theme?: Theme containerStyle?: StyleProp right?: number | string left?: number | string top?: number | string visible?: boolean testID?: string } export class Badge extends React.Component { render(): React.ReactElement } export interface BaseButtonProps { text?: string icon?: React.ReactNode iconPosition?: 'left' | 'right' textStyle?: StyleProp theme?: Theme style?: StyleProp children?: React.ReactNode type?: 'outlined' | 'contained' | 'flat' | 'text' onPress?: (e: GestureResponderEvent) => void loading?: boolean loader?: React.ReactNode hideLabel?: boolean color?: Color radius?: number fullWidth?: boolean density?: boolean disabled?: boolean disableRipple?: boolean useInputCasing?: boolean textColor?: Color buttonStyles?: StyleProp rippleColor?: Color onPressIn?: (e: GestureResponderEvent) => void onPressOut?: (e: GestureResponderEvent) => void testID?: string } export interface ContainedButtonProps { disabled?: boolean color?: Color textColor?: Color rippleColor?: Color theme?: Theme onPressIn?: (e: GestureResponderEvent) => void onPressOut?: (e: GestureResponderEvent) => void containerStyle?: StyleProp radius?: number fullWidth?: boolean } export interface FlatButtonProps { disabled?: boolean color?: Color textColor?: Color rippleColor?: Color theme?: Theme onPressIn?: (e: GestureResponderEvent) => void onPressOut?: (e: GestureResponderEvent) => void containerStyle?: StyleProp } export interface OutlinedButtonProps { disabled?: boolean color?: Color textColor?: Color rippleColor?: Color theme?: Theme borderSize?: number containerStyle?: StyleProp } export interface TextButtonProps { disabled?: boolean color?: Color textColor?: Color rippleColor?: Color theme?: Theme containerStyle?: StyleProp } type SpecificButtonProps = | ContainedButtonProps | FlatButtonProps | OutlinedButtonProps | TextButtonProps export type ButtonProps = BaseButtonProps & SpecificButtonProps export class Button extends React.Component { render(): React.ReactElement } export interface CheckboxProps { checked: boolean disabled?: boolean onPress?: (e: GestureResponderEvent) => void rippleColor?: Color checkboxColor?: Color unCheckedColor?: Color style?: StyleProp checkboxStyle?: StyleProp theme?: Theme rippleMatchesCheckbox?: boolean indeterminate?: boolean label?: string labelStyle?: StyleProp labelPos?: string icon?: React.ReactNode | string size?: number checkedIcon?: React.ReactNode | string ios?: boolean error?: boolean testID?: string } export class Checkbox extends React.Component { render(): React.ReactElement } export interface ChipProps { children?: React.ReactNode style?: StyleProp theme?: Theme chipStyle?: StyleProp color?: Color themeColor?: Color radius?: number onPress?: (e: GestureResponderEvent) => void onDelete?: (...args: any[]) => void visible?: boolean text?: string textStyles?: StyleProp leftIcon?: React.ReactNode rightIcon?: React.ReactNode selected?: boolean disabled?: boolean testID?: string | (() => any) } export class Chip extends React.Component { render(): React.ReactElement } export interface DividerProps { style?: StyleProp theme?: Theme marginVertical?: number subheader?: string insetHeader?: number insetLeft?: number testID?: string } export class Divider extends React.Component { render(): React.ReactElement } export interface FabProps { style?: StyleProp backgroundColor?: Color onPress?: (e: GestureResponderEvent) => void disabled?: boolean rippleColor?: Color icon?: React.ReactNode | string shadow?: number mini?: boolean theme?: Theme children?: React.ReactNode visible?: boolean initialScale?: number animated?: boolean label?: string testID?: string containerStyle?: StyleProp } export class Fab extends React.Component { render(): React.ReactElement } export interface IconProps { name: string style?: StyleProp theme?: Theme color?: Color size?: number testID?: string iconComponent?: React.Component } export class Icon extends React.Component { render(): React.ReactElement } export interface IconButtonProps { name: string style?: StyleProp theme?: Theme color?: Color size?: number onPress?: (e: GestureResponderEvent) => void rippleColor?: Color disabled?: boolean testID?: string iconComponent?: React.Component } export class IconButton extends React.Component { render(): React.ReactElement } export interface ListExpandProps { expanded?: boolean onPress?: (e: GestureResponderEvent) => void children?: React.ReactNode style?: StyleProp title?: string titleStyle?: StyleProp theme?: Theme icon?: React.ReactNode expandIconStyle?: StyleProp rippleProps?: RippleProps } export class ListExpand extends React.Component { render(): React.ReactElement } export interface ListItemProps { children?: React.ReactNode style?: StyleProp onPress?: (e: GestureResponderEvent) => void disabled?: boolean selected?: boolean text?: string textProps?: StyleProp secondaryText?: string | React.ReactElement secondaryTextProps?: StyleProp media?: React.ReactNode icon?: React.ReactNode actionItem?: React.ReactNode leadingActionItem?: React.ReactNode textStyle?: StyleProp secondaryTextStyle?: StyleProp rippleProps?: RippleProps backgroundColor?: Color } export class ListItem extends React.Component { render(): React.ReactElement } export interface ListSectionProps { children?: React.ReactNode style?: StyleProp label?: string labelStyle?: StyleProp topDivider?: boolean bottomDivider?: boolean inset?: boolean contentStyle?: StyleProp theme?: Theme } export class ListSection extends React.Component { render(): React.ReactElement } export interface ListProps { children?: React.ReactNode style?: StyleProp shadow?: number subheader?: string testID?: string } export class List extends React.Component { render(): React.ReactElement } export interface ModalProps { buttons: React.ReactElement visible: boolean onRequestClose: (...args: any[]) => void onShow: (...args: any[]) => void onTouchOutside: (e: GestureResponderEvent) => void containerStyle: StyleProp NativeModalProps: StyleProp children: React.ReactNode } export class Modal extends React.Component { render(): React.ReactElement } export interface PaperProps { children?: React.ReactNode style?: StyleProp theme?: Theme shadow?: number radius?: number testID?: string elevation?: number } export class Paper extends React.Component { render(): React.ReactElement } export interface ProgressBarProps { visible: boolean color?: Color height?: number trackStyle?: StyleProp determinate?: boolean indicatorStartPosition?: number animationEasing?: (...args: any[]) => any animationDuration?: number value?: number style?: StyleProp theme?: Theme testID?: string } export class ProgressBar extends React.Component { render(): React.ReactElement } export interface ProgressCircleProps { color?: Color size?: number style?: StyleProp animationDuration?: number animationEasing?: (...args: any[]) => any visible?: boolean determinate?: boolean widthOfBorder?: number testID?: string } export interface ProgressCircleDeterminateProps { value?: number size?: number thickness?: number color?: Color unfilledColor?: Color style?: StyleProp children?: React.ReactNode animationMethod?: string animationConfig?: {} shouldAnimateFirstValue?: boolean onChange?: (...args: any[]) => void onChangeAnimationEnd?: (...args: any[]) => void noTrackColor?: boolean } export class ProgressCircle extends React.Component< ProgressCircleProps | ProgressCircleDeterminateProps > { render(): React.ReactElement } export interface RadioButtonProps { checked: boolean disabled?: boolean onPress?: (e: GestureResponderEvent) => void rippleColor?: Color radioButtonColor?: Color uncheckedBorderColor?: Color style?: StyleProp label?: string labelStyle?: StyleProp labelPos?: string error?: boolean theme?: Theme testID?: string } export class RadioButton extends React.Component { render(): React.ReactElement } export interface RippleProps extends ViewProps, TouchableWithoutFeedbackProps { rippleColor?: Color rippleOpacity?: number rippleDuration?: number rippleSize?: number rippleContainerBorderRadius?: number rippleCentered?: boolean rippleSequential?: boolean rippleFades?: boolean disabled?: boolean displayUntilPressOut?: boolean onRippleAnimation?: (...args: any[]) => void testID?: string } export class Ripple extends React.Component { render(): React.ReactElement } export interface SliderProps { value?: number values?: number[] sliderLength?: number min?: number max?: number step?: number disableOne?: boolean disableTwo?: boolean onValueChange?: (...args: any[]) => void onValueChangeEnd?: (...args: any[]) => void onValuesChange?: (...args: any[]) => void onValuesChangeEnd?: (...args: any[]) => void trackColor?: Color markerColor?: Color allowOverlap?: boolean style?: StyleProp testID?: string markerSize?: number trackHeight?: number trackStyle?: StyleProp } export class Slider extends React.Component { render(): React.ReactElement } export interface SwitchProps { checked: boolean onPress?: (e: GestureResponderEvent) => void style?: StyleProp trackStyle?: StyleProp thumbStyle?: StyleProp label?: React.ReactNode labelPos?: string theme?: Theme color?: Color loading?: boolean testID?: string width?: number } export class Switch extends React.Component { render(): React.ReactElement } export interface SearchfieldProps { color?: Color iconProps?: IconProps inputRef?: (...args: any[]) => any onBlur?: (...args: any[]) => void onChangeText?: (text: string) => void onCloseIcon?: (...args: any[]) => void onFocus?: (...args: any[]) => void placeholder?: string style?: StyleProp textStyle?: StyleProp value?: string } export class Searchfield extends React.Component { render(): React.ReactElement } export interface TextFieldFilledProps { style?: StyleProp containerStyle?: StyleProp error?: boolean label?: string labelColor?: Color labelStyle?: StyleProp handleFocus?: (...args: any[]) => void handleBlur?: (...args: any[]) => void focused?: boolean helperText?: string helperVisible?: boolean helperTextStyle?: StyleProp underlineColor?: Color underlineActiveColor?: Color leadingIcon?: React.ReactNode trailingIcon?: React.ReactNode dense?: boolean value?: string multiline?: boolean suffix?: React.ReactNode prefix?: React.ReactNode testID?: string focusedLabelColor?: string } export interface TextFieldFlatProps { style?: StyleProp containerStyle?: StyleProp error?: boolean label?: string labelColor?: string labelStyle?: StyleProp handleFocus?: (...args: any[]) => void handleBlur?: (...args: any[]) => void focused?: boolean helperText?: string helperVisible?: boolean helperTextStyle?: StyleProp underlineColor?: string underlineActiveColor?: StyleProp | Color leadingIcon?: React.ReactNode trailingIcon?: React.ReactNode dense?: boolean value?: string multiline?: boolean suffix?: React.ReactNode prefix?: React.ReactNode testID?: string focusedLabelColor?: string } export interface TextFieldOutlineProps { style?: StyleProp containerStyle?: StyleProp error?: boolean label?: string labelColor?: string labelStyle?: StyleProp handleFocus?: (...args: any[]) => void handleBlur?: (...args: any[]) => void focused?: boolean helperText?: string helperVisible?: boolean helperTextStyle?: StyleProp leadingIcon?: React.ReactNode trailingIcon?: React.ReactNode dense?: boolean value?: string multiline?: boolean suffix?: React.ReactNode prefix?: React.ReactNode testID?: string focusedLabelColor?: Color } export interface TextFieldPropsBase { type?: 'outlined' | 'filled' | 'flat' onFocus?: (...args: any[]) => void onBlur?: (...args: any[]) => void disabled?: boolean placeholder?: string onChangeText?: (text: string) => void } type TextFieldSpecialProps = | TextFieldFilledProps | TextFieldOutlineProps | TextFieldFlatProps export type TextFieldProps = TextFieldPropsBase & TextFieldSpecialProps export class TextField extends React.Component { render(): React.ReactElement } export interface TextFieldHelperTextProps { error?: boolean children?: React.ReactNode visible?: boolean style?: StyleProp } export class TextFieldHelperText extends React.Component { render(): React.ReactElement } export interface ToggleButtonProps { style?: StyleProp active?: boolean onPress?: (e: GestureResponderEvent) => void value?: string activeNode?: React.ReactNode inActiveNode?: React.ReactNode rippleColor?: Color size?: number rippleContainerBorderRadius?: number testID?: string } export class ToggleButton extends React.Component { render(): React.ReactElement } export interface ToggleButtonGroupProps { onPress?: (e: GestureResponderEvent) => void children?: React.ReactNode } export class ToggleButtonGroup extends React.Component< ToggleButtonGroupProps > { render(): React.ReactElement } export interface TooltipProps { content: string children?: React.ReactNode style?: StyleProp tooltipPosition?: MenuProps['tooltipPosition'] testID?: string } export class Tooltip extends React.Component { render(): React.ReactElement } export interface BaseTextProps { style?: StyleProp children?: React.ReactNode typographyStyles?: StyleProp align?: 'center' | 'left' | 'right' color?: Color gutterBottom?: boolean theme?: Theme themeColor?: string } export class BaseText extends React.Component { render(): React.ReactElement } export interface BodyTextProps extends BaseTextProps { text?: string type?: number children?: React.ReactNode theme?: Theme style?: StyleProp } export class BodyText extends React.Component { render(): React.ReactElement } export interface CaptionProps extends BaseTextProps { text?: string children?: React.ReactNode theme?: Theme } export class Caption extends React.Component { render(): React.ReactElement } export interface HeadingProps extends BaseTextProps { text?: string type?: 1 | 2 | 3 | 4 | 5 | 6 children?: React.ReactNode theme?: Theme } export class Heading extends React.Component { render(): React.ReactElement } export interface OverlineProps extends BaseTextProps { text?: string children?: React.ReactNode theme?: Theme } export class Overline extends React.Component { render(): React.ReactElement } export interface SubtitleProps extends BaseTextProps { text?: string type?: number children?: React.ReactNode theme?: Theme } export class Subtitle extends React.Component { render(): React.ReactElement } export interface AppbarProps { color?: Color style?: StyleProp theme?: Theme barType?: 'normal' | 'simple' | 'prominent' | 'dense' | 'prominent dense' backgroundImage?: React.ReactNode position?: string elevation?: number navigation?: string | React.ReactNode onNavigation?: (...args: any[]) => void title?: string titleStyles?: StyleProp onTitle?: (...args: any[]) => void subtitle?: string subtitleStyles?: StyleProp textContainerStyles?: StyleProp actionItems?: React.ReactNode children?: React.ReactNode } export class Appbar extends React.Component { render(): React.ReactElement } export interface AppbarBottomProps { color?: Color style?: StyleProp theme?: Theme fab?: React.ReactNode | string fabStyles?: StyleProp fabPosition?: string fabCutout?: boolean navigation?: React.ReactNode | string onNavigation?: (...args: any[]) => void actionItems?: React.ReactNode children?: React.ReactNode appbarStyles?: StyleProp } export class AppbarBottom extends React.Component { render(): React.ReactElement } export interface BackdropProps { backLayerConcealed: React.ReactNode backLayerRevealed: React.ReactNode backLayerStyle?: StyleProp frontLayerStyle?: StyleProp headerButtonStyle?: StyleProp style?: StyleProp offset?: number initialOffset?: number children?: React.ReactNode theme?: Theme subheader?: string testID?: string } export class Backdrop extends React.Component { render(): React.ReactElement } export interface BannerProps { mobileLayout?: boolean style?: StyleProp actionItems?: any[] singleLine?: boolean media?: React.ReactNode visible?: boolean message?: string position?: string testID?: string } export class Banner extends React.Component { render(): React.ReactElement } export interface BottomNavigationProps { value: string | number actionItems: any[] backgroundColor?: Color children?: React.ReactNode style?: StyleProp showLabels?: boolean handleChange?: (...args: any[]) => void horizontalWhenLandscape?: boolean testID?: string } export class BottomNavigation extends React.Component { render(): React.ReactElement } export interface BottomNavigationItemProps { children?: React.ReactNode active?: boolean icon?: string label?: string showLabel?: boolean onPress?: (e: GestureResponderEvent) => void handleChange?: (...args: any[]) => void value?: number | string showLabels?: boolean style?: StyleProp badgeProps?: BadgeProps rippleProps?: RippleProps testID?: string isLandscape?: boolean onItemLayout?: (...args: any[]) => void maxWidth?: number horizontal?: boolean } export class BottomNavigationItem extends React.Component< BottomNavigationItemProps > { render(): React.ReactElement } export interface CardActionsProps { children?: React.ReactNode style?: StyleProp leftActionItems?: any[] rightActionItems?: any[] } export class CardActions extends React.Component { render(): React.ReactElement } export interface CardContentProps { children?: React.ReactNode style?: StyleProp rippleProps?: RippleProps onPress?: (e: GestureResponderEvent) => void } export class CardContent extends React.Component { render(): React.ReactElement } export interface CardHeaderProps { children?: React.ReactNode thumbnail?: React.ReactNode action?: React.ReactNode title?: string titleStyles?: StyleProp subtitle?: string subtitleStyles?: StyleProp style?: StyleProp } export class CardHeader extends React.Component { render(): React.ReactElement } export interface CardMediaProps { children?: React.ReactNode image?: React.ReactNode style?: StyleProp title?: string titleStyles?: StyleProp subtitle?: string subtitleStyles?: StyleProp height?: number } export class CardMedia extends React.Component { render(): React.ReactElement } export interface CardProps { children?: React.ReactNode style?: StyleProp outlined?: boolean shadow?: number radius?: number onPress?: (e: GestureResponderEvent) => void rippleProps?: RippleProps testID?: string } export class Card extends React.Component { render(): React.ReactElement } export interface DataTableCellProps { text: string type?: 'up' | 'header' children?: React.ReactNode style?: StyleProp right?: boolean borderRight?: boolean borderLeft?: boolean minWidth?: number onPress?: (e: GestureResponderEvent) => void sortingIcon?: string relativeWidth?: number textStyle?: StyleProp } export class DataTableCell extends React.Component { render(): React.ReactElement } export interface DataTableHeaderProps { children?: React.ReactNode style?: StyleProp rightActions?: React.ReactNode leftActions?: React.ReactNode title?: string } export class DataTableHeader extends React.Component { render(): React.ReactElement } export interface DataTablePaginationProps { page: number numberOfPages: number numberOfRows: number perPage: number children?: React.ReactNode style?: StyleProp possibleNumberPerPage?: number onChangePage?: (page: number) => void onChangeRowsPerPage?: (perPage: number) => void } export class DataTablePagination extends React.Component< DataTablePaginationProps > { render(): React.ReactElement } export interface DataTableRowProps { children?: React.ReactNode style?: StyleProp borderBottomColor?: Color selected?: boolean onPressCheckbox?: (...args: any[]) => void showCheckbox?: boolean checkboxOffset?: boolean onPress?: (e: GestureResponderEvent) => void hover?: boolean type?: string } export class DataTableRow extends React.Component { render(): React.ReactElement } export interface DataTableProps { children?: React.ReactNode style?: StyleProp testID?: string } export class DataTable extends React.Component { render(): React.ReactElement } export interface DialogProps { visible: boolean actionItems?: React.ReactNode[] style?: StyleProp children?: React.ReactNode onRequestClose?: (...args: any[]) => void onShow?: (...args: any[]) => void onTouchOutside?: (...args: any[]) => void title?: string titleStyle?: StyleProp supportingText?: string supportingTextStyle?: StyleProp contentStyle?: StyleProp testID?: string } export class Dialog extends React.Component { render(): React.ReactElement } export interface DrawerHeaderProps { children?: React.ReactNode style?: StyleProp title?: string subtitle?: string avatar?: React.ReactNode } export class DrawerHeader extends React.Component { render(): React.ReactElement } export interface DrawerItemProps { children?: React.ReactNode style?: StyleProp text?: string icon?: string onPress?: (e: GestureResponderEvent) => void active?: boolean } export class DrawerItem extends React.Component { render(): React.ReactElement } export interface DrawerSectionProps { children?: React.ReactNode style?: StyleProp label?: string topDivider?: boolean bottomDivider?: boolean fullWidth?: boolean } export class DrawerSection extends React.Component { render(): React.ReactElement } export interface DrawerProps { open: boolean drawerContent: React.ReactNode onClose: (...args: any[]) => void type?: 'push' | 'permanent' children?: React.ReactNode animationTime?: number pageHeight?: number pageWidth?: number widthPercentage?: number width?: number fullHeight?: boolean position?: string appbar?: React.ReactNode scrim?: boolean scrimColor?: string scrimOpacity?: number style?: StyleProp contentContainerStyle?: StyleProp drawerStyle?: StyleProp scrimStyles?: StyleProp testID?: string } export class Drawer extends React.Component { render(): React.ReactElement } export interface DrawerBottomProps extends SheetBottomProps { children?: React.ReactNode style?: StyleProp } export class DrawerBottom extends React.Component { render(): React.ReactElement } export interface FabSpeedDialProps { fab?: React.ReactNode | string actions?: React.ReactNode extended?: boolean style?: StyleProp onPress?: (e: GestureResponderEvent) => void testID?: string } export class FabSpeedDial extends React.Component { render(): React.ReactElement } export interface MenuItemProps { text?: string children?: React.ReactNode disabled?: boolean onPress?: (e: GestureResponderEvent) => void style?: StyleProp textStyle?: StyleProp icon?: React.ReactNode keyboardCommand?: React.ReactNode } export class MenuItem extends React.Component { render(): React.ReactElement } export interface MenuProps { button?: React.ReactNode children?: React.ReactNode onHidden?: (...args: any[]) => void style?: StyleProp visible?: boolean menuStyle?: StyleProp sameWidth?: boolean onBackdropPress?: (...args: any[]) => void modalMenuStyle?: StyleProp contentContainerStyle?: StyleProp noBackDrop?: boolean tooltip?: boolean tooltipPosition?: string testID?: string } export class Menu extends React.Component { render(): React.ReactElement } export interface SearchbarProps { value?: string style?: StyleProp onChangeText?: (text: string) => void onCloseIcon?: (...args: any[]) => void onNavigation?: (...args: any[]) => void placeholder?: string } export class Searchbar extends React.Component { render(): React.ReactElement } export interface SelectProps { onSelect?: (...args: any[]) => void buttonStyle?: StyleProp label?: string selectedItem?: React.ReactNode menuItems?: any[] visible?: boolean textFieldProps?: TextFieldProps menuProps?: MenuProps type?: TextFieldProps['type'] onBackdropPress?: (e: GestureResponderEvent) => void theme?: Theme testID?: string } export class Select extends React.Component { render(): React.ReactElement } export interface SheetBottomProps { visible: boolean duration?: number onBackdropPress?: (...args: any[]) => void onSwipeDown?: (...args: any[]) => void onSwipeUp?: (...args: any[]) => void children?: React.ReactNode wrapperStyles?: StyleProp style?: StyleProp cardVerticalPadding?: number pageHeight?: number testID?: string } export class SheetBottom extends React.Component { render(): React.ReactElement } export interface SheetSideProps { duration?: number onBackdropPress?: (...args: any[]) => void onSwipeLeft?: (...args: any[]) => void onSwipeRight?: (...args: any[]) => void children?: React.ReactNode wrapperStyles?: StyleProp style?: StyleProp visible?: boolean pageWidth?: number pageHeight?: number widthPercentage?: number side?: string testID?: string } export class SheetSide extends React.Component { render(): React.ReactElement } export interface SnackbarProps { visible?: boolean animationDuration?: number children?: React.ReactNode style?: StyleProp onButtonPress?: (e: GestureResponderEvent) => void buttonLabel?: string buttonTextColor?: Color testID?: string } export class Snackbar extends React.Component { render(): React.ReactElement } export interface SwipeNavProps { header?: React.ReactNode footer?: React.ReactNode scrollViewProps?: ScrollViewProps scrollComponent?: React.ReactNode style?: StyleProp headerContainerStyle?: StyleProp footerContainerStyle?: StyleProp scrollViewStyle?: StyleProp children?: React.ReactNode } export class SwipeNav extends React.Component { render(): React.ReactElement } export interface TabsProps { actionItems?: string | React.ReactNode selectedIndex?: number backgroundColor?: string underlineColor?: string scrollEnabled?: boolean handleChange?: (...args: any[]) => void style?: StyleProp theme?: Theme testID?: string } export class Tabs extends React.Component { render(): React.ReactElement } export interface TabProps { label?: string active?: boolean activeTextColor?: string inActiveTextColor?: string textStyle?: StyleProp iconStyles?: StyleProp onPress?: (e: GestureResponderEvent) => void tabWidth?: number style?: StyleProp icon?: string rippleProps?: RippleProps } export class Tab extends React.Component { render(): React.ReactElement } ================================================ FILE: dist/index.js ================================================ var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"Hoverable",{enumerable:true,get:function get(){return _Hoverable.default;}});Object.defineProperty(exports,"shadow",{enumerable:true,get:function get(){return _shadow.default;}});Object.defineProperty(exports,"Anchor",{enumerable:true,get:function get(){return _Anchor.default;}});Object.defineProperty(exports,"Appbar",{enumerable:true,get:function get(){return _Appbar.default;}});Object.defineProperty(exports,"AppbarBottom",{enumerable:true,get:function get(){return _AppbarBottom.default;}});Object.defineProperty(exports,"Avatar",{enumerable:true,get:function get(){return _Avatar.default;}});Object.defineProperty(exports,"Backdrop",{enumerable:true,get:function get(){return _Backdrop.default;}});Object.defineProperty(exports,"Badge",{enumerable:true,get:function get(){return _Badge.default;}});Object.defineProperty(exports,"Banner",{enumerable:true,get:function get(){return _Banner.default;}});Object.defineProperty(exports,"BottomNavigation",{enumerable:true,get:function get(){return _BottomNavigation.default;}});Object.defineProperty(exports,"BottomNavigationItem",{enumerable:true,get:function get(){return _BottomNavigation.BottomNavigationItem;}});Object.defineProperty(exports,"Button",{enumerable:true,get:function get(){return _Button.default;}});Object.defineProperty(exports,"Card",{enumerable:true,get:function get(){return _Card.default;}});Object.defineProperty(exports,"CardActions",{enumerable:true,get:function get(){return _Card.CardActions;}});Object.defineProperty(exports,"CardContent",{enumerable:true,get:function get(){return _Card.CardContent;}});Object.defineProperty(exports,"CardHeader",{enumerable:true,get:function get(){return _Card.CardHeader;}});Object.defineProperty(exports,"CardMedia",{enumerable:true,get:function get(){return _Card.CardMedia;}});Object.defineProperty(exports,"Checkbox",{enumerable:true,get:function get(){return _Checkbox.default;}});Object.defineProperty(exports,"Chip",{enumerable:true,get:function get(){return _Chip.default;}});Object.defineProperty(exports,"DataTable",{enumerable:true,get:function get(){return _DataTable.default;}});Object.defineProperty(exports,"DataTableHeader",{enumerable:true,get:function get(){return _DataTable.DataTableHeader;}});Object.defineProperty(exports,"DataTableCell",{enumerable:true,get:function get(){return _DataTable.DataTableCell;}});Object.defineProperty(exports,"DataTablePagination",{enumerable:true,get:function get(){return _DataTable.DataTablePagination;}});Object.defineProperty(exports,"DataTableRow",{enumerable:true,get:function get(){return _DataTable.DataTableRow;}});Object.defineProperty(exports,"Dialog",{enumerable:true,get:function get(){return _Dialog.default;}});Object.defineProperty(exports,"Drawer",{enumerable:true,get:function get(){return _Drawer.default;}});Object.defineProperty(exports,"DrawerHeader",{enumerable:true,get:function get(){return _Drawer.DrawerHeader;}});Object.defineProperty(exports,"DrawerItem",{enumerable:true,get:function get(){return _Drawer.DrawerItem;}});Object.defineProperty(exports,"DrawerSection",{enumerable:true,get:function get(){return _Drawer.DrawerSection;}});Object.defineProperty(exports,"DrawerBottom",{enumerable:true,get:function get(){return _DrawerBottom.default;}});Object.defineProperty(exports,"Divider",{enumerable:true,get:function get(){return _Divider.default;}});Object.defineProperty(exports,"Fab",{enumerable:true,get:function get(){return _Fab.default;}});Object.defineProperty(exports,"FabSpeedDial",{enumerable:true,get:function get(){return _Fab.FabSpeedDial;}});Object.defineProperty(exports,"Icon",{enumerable:true,get:function get(){return _Icon.default;}});Object.defineProperty(exports,"IconButton",{enumerable:true,get:function get(){return _IconButton.default;}});Object.defineProperty(exports,"List",{enumerable:true,get:function get(){return _List.default;}});Object.defineProperty(exports,"ListSection",{enumerable:true,get:function get(){return _List.ListSection;}});Object.defineProperty(exports,"ListExpand",{enumerable:true,get:function get(){return _List.ListExpand;}});Object.defineProperty(exports,"ListItem",{enumerable:true,get:function get(){return _List.ListItem;}});Object.defineProperty(exports,"Menu",{enumerable:true,get:function get(){return _Menu.default;}});Object.defineProperty(exports,"MenuItem",{enumerable:true,get:function get(){return _Menu.MenuItem;}});Object.defineProperty(exports,"Paper",{enumerable:true,get:function get(){return _Paper.default;}});Object.defineProperty(exports,"ProgressBar",{enumerable:true,get:function get(){return _ProgressBar.default;}});Object.defineProperty(exports,"ProgressCircle",{enumerable:true,get:function get(){return _ProgressCircle.default;}});Object.defineProperty(exports,"RadioButton",{enumerable:true,get:function get(){return _RadioButton.default;}});Object.defineProperty(exports,"Ripple",{enumerable:true,get:function get(){return _Ripple.default;}});Object.defineProperty(exports,"Select",{enumerable:true,get:function get(){return _Select.default;}});Object.defineProperty(exports,"Searchfield",{enumerable:true,get:function get(){return _Searchfield.default;}});Object.defineProperty(exports,"Searchbar",{enumerable:true,get:function get(){return _Searchbar.default;}});Object.defineProperty(exports,"SheetBottom",{enumerable:true,get:function get(){return _SheetBottom.default;}});Object.defineProperty(exports,"SheetSide",{enumerable:true,get:function get(){return _SheetSide.default;}});Object.defineProperty(exports,"Slider",{enumerable:true,get:function get(){return _Slider.default;}});Object.defineProperty(exports,"Snackbar",{enumerable:true,get:function get(){return _Snackbar.default;}});Object.defineProperty(exports,"SwipeNav",{enumerable:true,get:function get(){return _SwipeNav.default;}});Object.defineProperty(exports,"Switch",{enumerable:true,get:function get(){return _Switch.default;}});Object.defineProperty(exports,"Tabs",{enumerable:true,get:function get(){return _Tabs.default;}});Object.defineProperty(exports,"Tab",{enumerable:true,get:function get(){return _Tabs.Tab;}});Object.defineProperty(exports,"TextField",{enumerable:true,get:function get(){return _TextField.default;}});Object.defineProperty(exports,"TextFieldHelperText",{enumerable:true,get:function get(){return _TextField.TextFieldHelperText;}});Object.defineProperty(exports,"ToggleButton",{enumerable:true,get:function get(){return _ToggleButton.default;}});Object.defineProperty(exports,"ToggleButtonGroup",{enumerable:true,get:function get(){return _ToggleButton.ToggleButtonGroup;}});Object.defineProperty(exports,"Tooltip",{enumerable:true,get:function get(){return _Tooltip.default;}});Object.defineProperty(exports,"Heading",{enumerable:true,get:function get(){return _Typography.Heading;}});Object.defineProperty(exports,"Subtitle",{enumerable:true,get:function get(){return _Typography.Subtitle;}});Object.defineProperty(exports,"BodyText",{enumerable:true,get:function get(){return _Typography.BodyText;}});Object.defineProperty(exports,"Caption",{enumerable:true,get:function get(){return _Typography.Caption;}});Object.defineProperty(exports,"Overline",{enumerable:true,get:function get(){return _Typography.Overline;}});Object.defineProperty(exports,"ThemeContext",{enumerable:true,get:function get(){return _ThemeContext.default;}});Object.defineProperty(exports,"withTheme",{enumerable:true,get:function get(){return _withTheme.default;}});Object.defineProperty(exports,"defaultTheme",{enumerable:true,get:function get(){return _defaultTheme.default;}});Object.defineProperty(exports,"BreadProvider",{enumerable:true,get:function get(){return _BreadProvider.default;}});Object.defineProperty(exports,"Colors",{enumerable:true,get:function get(){return _index.default;}});Object.defineProperty(exports,"VueMaterialBread",{enumerable:true,get:function get(){return _vueNative.default;}});var _Hoverable=_interopRequireDefault(require("./Utils/Hoverable/Hoverable.js"));var _shadow=_interopRequireDefault(require("./Utils/Shadow/shadow.js"));var _Anchor=_interopRequireDefault(require("./Utils/Anchor/Anchor.js"));var _Appbar=_interopRequireDefault(require("./Components/Appbar"));var _AppbarBottom=_interopRequireDefault(require("./Components/AppbarBottom"));var _Avatar=_interopRequireDefault(require("./Components/Avatar"));var _Backdrop=_interopRequireDefault(require("./Components/Backdrop"));var _Badge=_interopRequireDefault(require("./Components/Badge"));var _Banner=_interopRequireDefault(require("./Components/Banner"));var _BottomNavigation=_interopRequireWildcard(require("./Components/BottomNavigation"));var _Button=_interopRequireDefault(require("./Components/Button"));var _Card=_interopRequireWildcard(require("./Components/Card"));var _Checkbox=_interopRequireDefault(require("./Components/Checkbox"));var _Chip=_interopRequireDefault(require("./Components/Chip"));var _DataTable=_interopRequireWildcard(require("./Components/DataTable"));var _Dialog=_interopRequireDefault(require("./Components/Dialog"));var _Drawer=_interopRequireWildcard(require("./Components/Drawer"));var _DrawerBottom=_interopRequireDefault(require("./Components/DrawerBottom"));var _Divider=_interopRequireDefault(require("./Components/Divider"));var _Fab=_interopRequireWildcard(require("./Components/Fab"));var _Icon=_interopRequireDefault(require("./Components/Icon"));var _IconButton=_interopRequireDefault(require("./Components/IconButton"));var _List=_interopRequireWildcard(require("./Components/List"));var _Menu=_interopRequireWildcard(require("./Components/Menu"));var _Paper=_interopRequireDefault(require("./Components/Paper/Paper.js"));var _ProgressBar=_interopRequireDefault(require("./Components/Progress/ProgressBar"));var _ProgressCircle=_interopRequireDefault(require("./Components/Progress/ProgressCircle"));var _RadioButton=_interopRequireDefault(require("./Components/RadioButton"));var _Ripple=_interopRequireDefault(require("./Components/Ripple"));var _Select=_interopRequireDefault(require("./Components/Select"));var _Searchfield=_interopRequireDefault(require("./Components/TextField/Searchfield/Searchfield.js"));var _Searchbar=_interopRequireDefault(require("./Components/Appbar/Searchbar/Searchbar.js"));var _SheetBottom=_interopRequireDefault(require("./Components/SheetBottom"));var _SheetSide=_interopRequireDefault(require("./Components/SheetSide"));var _Slider=_interopRequireDefault(require("./Components/Slider"));var _Snackbar=_interopRequireDefault(require("./Components/Snackbar"));var _SwipeNav=_interopRequireDefault(require("./Components/SwipeNav"));var _Switch=_interopRequireDefault(require("./Components/Switch"));var _Tabs=_interopRequireWildcard(require("./Components/Tabs"));var _TextField=_interopRequireWildcard(require("./Components/TextField"));var _ToggleButton=_interopRequireWildcard(require("./Components/ToggleButton"));var _Tooltip=_interopRequireDefault(require("./Components/Tooltip"));var _Typography=require("./Components/Typography");var _ThemeContext=_interopRequireDefault(require("./Theme/ThemeContext.js"));var _withTheme=_interopRequireDefault(require("./Theme/withTheme.js"));var _defaultTheme=_interopRequireDefault(require("./Theme/defaultTheme.js"));var _BreadProvider=_interopRequireDefault(require("./Core/BreadProvider.js"));var _index=_interopRequireDefault(require("./Core/colors/index.js"));var _vueNative=_interopRequireDefault(require("./vue-native.js")); ================================================ FILE: dist/storybook/components/Container.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _=require("../..");var _jsxFileName="/Users/cody/projects/material-bread/src/storybook/components/Container.js";var Container=function(_Component){(0,_inherits2.default)(Container,_Component);function Container(){(0,_classCallCheck2.default)(this,Container);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Container).apply(this,arguments));}(0,_createClass2.default)(Container,[{key:"render",value:function render(){var _this$props=this.props,style=_this$props.style,scroll=_this$props.scroll,children=_this$props.children;if(scroll){return _react.default.createElement(_reactNative.ScrollView,{__source:{fileName:_jsxFileName,lineNumber:17}},_react.default.createElement(_reactNative.View,{style:[styles.container,style],__source:{fileName:_jsxFileName,lineNumber:18}},_react.default.createElement(_.BreadProvider,{value:{},__source:{fileName:_jsxFileName,lineNumber:19}},children)));}return _react.default.createElement(_reactNative.View,{style:[styles.container,style],__source:{fileName:_jsxFileName,lineNumber:25}},_react.default.createElement(_.BreadProvider,{value:{},__source:{fileName:_jsxFileName,lineNumber:26}},children));}}]);return Container;}(_react.Component);exports.default=Container;(0,_defineProperty2.default)(Container,"propTypes",{style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),children:_propTypes.default.node,scroll:_propTypes.default.bool});var styles=_reactNative.StyleSheet.create({container:{padding:16}}); ================================================ FILE: dist/storybook/components/Header.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _=require("../..");var _jsxFileName="/Users/cody/projects/material-bread/src/storybook/components/Header.js";var Header=function(_Component){(0,_inherits2.default)(Header,_Component);function Header(){(0,_classCallCheck2.default)(this,Header);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Header).apply(this,arguments));}(0,_createClass2.default)(Header,[{key:"render",value:function render(){var _this$props=this.props,title=_this$props.title,subtitle=_this$props.subtitle;return _react.default.createElement(_reactNative.View,{style:styles.container,__source:{fileName:_jsxFileName,lineNumber:15}},_react.default.createElement(_.Heading,{align:"center",type:4,__source:{fileName:_jsxFileName,lineNumber:16}},title),subtitle?_react.default.createElement(_.Subtitle,{type:1,style:[styles.subtitle],__source:{fileName:_jsxFileName,lineNumber:20}},subtitle):null);}}]);return Header;}(_react.Component);exports.default=Header;(0,_defineProperty2.default)(Header,"propTypes",{title:_propTypes.default.string,subtitle:_propTypes.default.string});var styles=_reactNative.StyleSheet.create({container:{marginBottom:60},subtitle:{marginTop:40}}); ================================================ FILE: dist/storybook/helpers/storiesOf/index.android.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"storiesOf",{enumerable:true,get:function get(){return _reactNative.storiesOf;}});var _reactNative=require("@storybook/react-native"); ================================================ FILE: dist/storybook/helpers/storiesOf/index.ios.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"storiesOf",{enumerable:true,get:function get(){return _reactNative.storiesOf;}});var _reactNative=require("@storybook/react-native"); ================================================ FILE: dist/storybook/helpers/storiesOf/index.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"storiesOf",{enumerable:true,get:function get(){return _react.storiesOf;}});var _react=require("@storybook/react"); ================================================ FILE: dist/storybook/index.android.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var _storybook=_interopRequireDefault(require("./storybook"));_reactNative.AppRegistry.registerComponent('ReactNativeBread',function(){return _storybook.default;});var _default=_storybook.default;exports.default=_default; ================================================ FILE: dist/storybook/index.ios.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("react-native");var _storybook=_interopRequireDefault(require("./storybook"));_reactNative.AppRegistry.registerComponent('ReactNativeBread',function(){return _storybook.default;});var _default=_storybook.default;exports.default=_default; ================================================ FILE: dist/storybook/index.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactNative=require("@storybook/react-native");require("./rn-addons");(0,_reactNative.configure)(function(){require('./stories');},module);var StorybookUIRoot=(0,_reactNative.getStorybookUI)({port:7007,host:'localhost'});var _default=StorybookUIRoot;exports.default=_default; ================================================ FILE: dist/storybook/rn-addons.js ================================================ ================================================ FILE: dist/storybook/stories/Home.stories.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _storiesOf=require("../helpers/storiesOf");var _Container=_interopRequireDefault(require("../components/Container"));var _=require("../..");var _jsxFileName="/Users/cody/projects/material-bread/src/storybook/stories/Home.stories.js";var styles=_reactNative.StyleSheet.create({top:{flexDirection:'column',alignItems:'center'},header:{fontSize:48,textAlign:'center',fontWeight:'600'},subtitle:{fontSize:16,color:'rgba(10, 10, 10, 0.67)',fontWeight:'400',marginTop:6},bodyText:{fontSize:14,lineHeight:22},initialText:{flexDirection:'row',flexWrap:'wrap',marginTop:40,marginHorizontal:'auto',maxWidth:780},textRow:{marginTop:20,flexWrap:'wrap',maxWidth:780},buttonRow:{marginTop:20,flexDirection:'row'},secondButton:{marginLeft:20},logo:{width:300.502,height:250.398,resizeMode:'cover'}});var _default=(0,_storiesOf.storiesOf)('Docs|Start Here',module).add('Home',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:52}},_react.default.createElement(_reactNative.View,{style:styles.top,__source:{fileName:_jsxFileName,lineNumber:53}},_react.default.createElement(_reactNative.Image,{source:{uri:'http://material-bread.org/logo-shadow.svg'},style:styles.logo,__source:{fileName:_jsxFileName,lineNumber:54}}),_react.default.createElement(_.Heading,{style:styles.header,__source:{fileName:_jsxFileName,lineNumber:58}},"Material Bread"),_react.default.createElement(_.BodyText,{style:styles.subtitle,__source:{fileName:_jsxFileName,lineNumber:59}},"One Component Library, Six Platforms")),_react.default.createElement(_reactNative.View,{style:styles.initialText,__source:{fileName:_jsxFileName,lineNumber:64}},_react.default.createElement(_.BodyText,{style:styles.bodyText,__source:{fileName:_jsxFileName,lineNumber:65}},"This is the Storybook environment for Material Bread which is a highly customizable cross-platform React Native Material Library. Visit the docs to see the full component API."),_react.default.createElement(_reactNative.View,{style:styles.buttonRow,__source:{fileName:_jsxFileName,lineNumber:70}},_react.default.createElement(_.Anchor,{url:'http://material-bread.org/',target:'_parent',__source:{fileName:_jsxFileName,lineNumber:71}},_react.default.createElement(_.Button,{text:'Documentation',type:'outlined',textColor:'rgb(233, 30, 99)',__source:{fileName:_jsxFileName,lineNumber:72}})),_react.default.createElement(_.Anchor,{url:'https://github.com/codypearce/material-bread',target:'_parent',__source:{fileName:_jsxFileName,lineNumber:79}},_react.default.createElement(_.Button,{text:'Github',type:'outlined',textColor:'#666',style:styles.secondButton,__source:{fileName:_jsxFileName,lineNumber:82}})))));});exports.default=_default; ================================================ FILE: dist/storybook/stories/index.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"Home",{enumerable:true,get:function get(){return _HomeStories.default;}});Object.defineProperty(exports,"Appbar",{enumerable:true,get:function get(){return _Appbar.default;}});Object.defineProperty(exports,"AppbarBottom",{enumerable:true,get:function get(){return _AppbarBottomStories.default;}});Object.defineProperty(exports,"Avatar",{enumerable:true,get:function get(){return _AvatarStories.default;}});Object.defineProperty(exports,"Backdrop",{enumerable:true,get:function get(){return _BackdropStories.default;}});Object.defineProperty(exports,"Badge",{enumerable:true,get:function get(){return _BadgeStories.default;}});Object.defineProperty(exports,"Banner",{enumerable:true,get:function get(){return _BannerStories.default;}});Object.defineProperty(exports,"BottomNavigation",{enumerable:true,get:function get(){return _BottomNavigationStories.default;}});Object.defineProperty(exports,"BottomNavigationItem",{enumerable:true,get:function get(){return _BottomNavigationItemStories.default;}});Object.defineProperty(exports,"Button",{enumerable:true,get:function get(){return _ButtonStories.default;}});Object.defineProperty(exports,"TextButton",{enumerable:true,get:function get(){return _TextButtonStories.default;}});Object.defineProperty(exports,"FlatButton",{enumerable:true,get:function get(){return _FlatButtonStories.default;}});Object.defineProperty(exports,"OutlinedButton",{enumerable:true,get:function get(){return _OutlinedButtonStories.default;}});Object.defineProperty(exports,"ContainedButton",{enumerable:true,get:function get(){return _ContainedButtonStories.default;}});Object.defineProperty(exports,"Card",{enumerable:true,get:function get(){return _CardStories.default;}});Object.defineProperty(exports,"Checkbox",{enumerable:true,get:function get(){return _CheckboxStories.default;}});Object.defineProperty(exports,"Chip",{enumerable:true,get:function get(){return _ChipStories.default;}});Object.defineProperty(exports,"DataTable",{enumerable:true,get:function get(){return _DataTableStories.default;}});Object.defineProperty(exports,"DataTableCell",{enumerable:true,get:function get(){return _DataTableCellStories.default;}});Object.defineProperty(exports,"DataTableHeader",{enumerable:true,get:function get(){return _DataTableHeaderStories.default;}});Object.defineProperty(exports,"DataTableRow",{enumerable:true,get:function get(){return _DataTableRowStories.default;}});Object.defineProperty(exports,"DataTablePagination",{enumerable:true,get:function get(){return _DataTablePaginationStories.default;}});Object.defineProperty(exports,"Dialog",{enumerable:true,get:function get(){return _DialogStories.default;}});Object.defineProperty(exports,"Drawer",{enumerable:true,get:function get(){return _DrawerStories.default;}});Object.defineProperty(exports,"DrawerHeader",{enumerable:true,get:function get(){return _DrawerHeaderStories.default;}});Object.defineProperty(exports,"DrawerSection",{enumerable:true,get:function get(){return _DrawerSectionStories.default;}});Object.defineProperty(exports,"DrawerItem",{enumerable:true,get:function get(){return _DrawerItemStories.default;}});Object.defineProperty(exports,"DrawerBottom",{enumerable:true,get:function get(){return _DrawerBottomStories.default;}});Object.defineProperty(exports,"Divider",{enumerable:true,get:function get(){return _DividerStories.default;}});Object.defineProperty(exports,"Fab",{enumerable:true,get:function get(){return _FabStories.default;}});Object.defineProperty(exports,"FabSpeedDial",{enumerable:true,get:function get(){return _FabSpeedDialStories.default;}});Object.defineProperty(exports,"Icons",{enumerable:true,get:function get(){return _IconsStories.default;}});Object.defineProperty(exports,"IconButton",{enumerable:true,get:function get(){return _IconButtonStories.default;}});Object.defineProperty(exports,"List",{enumerable:true,get:function get(){return _ListStories.default;}});Object.defineProperty(exports,"ListExpand",{enumerable:true,get:function get(){return _ListExpandStories.default;}});Object.defineProperty(exports,"ListItem",{enumerable:true,get:function get(){return _ListItemStories.default;}});Object.defineProperty(exports,"ListSection",{enumerable:true,get:function get(){return _ListSectionStories.default;}});Object.defineProperty(exports,"Menu",{enumerable:true,get:function get(){return _MenuStories.default;}});Object.defineProperty(exports,"MenuItem",{enumerable:true,get:function get(){return _MenuItemStories.default;}});Object.defineProperty(exports,"Paper",{enumerable:true,get:function get(){return _PaperStories.default;}});Object.defineProperty(exports,"ProgressBar",{enumerable:true,get:function get(){return _ProgressBarStories.default;}});Object.defineProperty(exports,"ProgressCircle",{enumerable:true,get:function get(){return _ProgressCircleStories.default;}});Object.defineProperty(exports,"RadioButton",{enumerable:true,get:function get(){return _RadioButtonStories.default;}});Object.defineProperty(exports,"Ripple",{enumerable:true,get:function get(){return _RippleStories.default;}});Object.defineProperty(exports,"Searchbar",{enumerable:true,get:function get(){return _SearchbarStories.default;}});Object.defineProperty(exports,"Searchfield",{enumerable:true,get:function get(){return _SearchfieldStories.default;}});Object.defineProperty(exports,"SelectFilled",{enumerable:true,get:function get(){return _SelectFilledStories.default;}});Object.defineProperty(exports,"SelectFlat",{enumerable:true,get:function get(){return _SelectFlatStories.default;}});Object.defineProperty(exports,"SelectOutlined",{enumerable:true,get:function get(){return _SelectOutlinedStories.default;}});Object.defineProperty(exports,"SheetBottom",{enumerable:true,get:function get(){return _SheetBottomStories.default;}});Object.defineProperty(exports,"SheetSide",{enumerable:true,get:function get(){return _SheetSideStories.default;}});Object.defineProperty(exports,"Slider",{enumerable:true,get:function get(){return _SliderStories.default;}});Object.defineProperty(exports,"Snackbar",{enumerable:true,get:function get(){return _SnackbarStories.default;}});Object.defineProperty(exports,"SwipeNav",{enumerable:true,get:function get(){return _SwipeNavStories.default;}});Object.defineProperty(exports,"Switch",{enumerable:true,get:function get(){return _SwitchStories.default;}});Object.defineProperty(exports,"Tab",{enumerable:true,get:function get(){return _TabStories.default;}});Object.defineProperty(exports,"Tabs",{enumerable:true,get:function get(){return _TabsStories.default;}});Object.defineProperty(exports,"TextFieldFilled",{enumerable:true,get:function get(){return _TextFieldFilledStories.default;}});Object.defineProperty(exports,"TextFieldFlat",{enumerable:true,get:function get(){return _TextFieldFlatStories.default;}});Object.defineProperty(exports,"TextFieldOutline",{enumerable:true,get:function get(){return _TextFieldOutlineStories.default;}});Object.defineProperty(exports,"ToggleButton",{enumerable:true,get:function get(){return _ToggleButtonStories.default;}});Object.defineProperty(exports,"Tooltip",{enumerable:true,get:function get(){return _TooltipStories.default;}});Object.defineProperty(exports,"Typography",{enumerable:true,get:function get(){return _TypographyStories.default;}});Object.defineProperty(exports,"Anchor",{enumerable:true,get:function get(){return _AnchorStories.default;}});Object.defineProperty(exports,"Hoverable",{enumerable:true,get:function get(){return _HoverableStories.default;}});Object.defineProperty(exports,"Shadows",{enumerable:true,get:function get(){return _ShadowStories.default;}});var _HomeStories=_interopRequireDefault(require("./Home.stories.js"));var _Appbar=_interopRequireDefault(require("../../Components/Appbar/Appbar.stories"));var _AppbarBottomStories=_interopRequireDefault(require("../../Components/AppbarBottom/AppbarBottom.stories.js"));var _AvatarStories=_interopRequireDefault(require("../../Components/Avatar/Avatar.stories.js"));var _BackdropStories=_interopRequireDefault(require("../../Components/Backdrop/Backdrop.stories.js"));var _BadgeStories=_interopRequireDefault(require("../../Components/Badge/Badge.stories.js"));var _BannerStories=_interopRequireDefault(require("../../Components/Banner/Banner.stories.js"));var _BottomNavigationStories=_interopRequireDefault(require("../../Components/BottomNavigation/BottomNavigation.stories.js"));var _BottomNavigationItemStories=_interopRequireDefault(require("../../Components/BottomNavigation/BottomNavigationItem/BottomNavigationItem.stories.js"));var _ButtonStories=_interopRequireDefault(require("../../Components/Button/Button.stories.js"));var _TextButtonStories=_interopRequireDefault(require("../../Components/Button/TextButton/TextButton.stories.js"));var _FlatButtonStories=_interopRequireDefault(require("../../Components/Button/FlatButton/FlatButton.stories.js"));var _OutlinedButtonStories=_interopRequireDefault(require("../../Components/Button/OutlinedButton/OutlinedButton.stories.js"));var _ContainedButtonStories=_interopRequireDefault(require("../../Components/Button/ContainedButton/ContainedButton.stories.js"));var _CardStories=_interopRequireDefault(require("../../Components/Card/Card.stories.js"));var _CheckboxStories=_interopRequireDefault(require("../../Components/Checkbox/Checkbox.stories.js"));var _ChipStories=_interopRequireDefault(require("../../Components/Chip/Chip.stories.js"));var _DataTableStories=_interopRequireDefault(require("../../Components/DataTable/DataTable.stories.js"));var _DataTableCellStories=_interopRequireDefault(require("../../Components/DataTable/DataTableCell/DataTableCell.stories.js"));var _DataTableHeaderStories=_interopRequireDefault(require("../../Components/DataTable/DataTableHeader/DataTableHeader.stories.js"));var _DataTableRowStories=_interopRequireDefault(require("../../Components/DataTable/DataTableRow/DataTableRow.stories.js"));var _DataTablePaginationStories=_interopRequireDefault(require("../../Components/DataTable/DataTablePagination/DataTablePagination.stories.js"));var _DialogStories=_interopRequireDefault(require("../../Components/Dialog/Dialog.stories.js"));var _DrawerStories=_interopRequireDefault(require("../../Components/Drawer/Drawer.stories.js"));var _DrawerHeaderStories=_interopRequireDefault(require("../../Components/Drawer/DrawerHeader/DrawerHeader.stories.js"));var _DrawerSectionStories=_interopRequireDefault(require("../../Components/Drawer/DrawerSection/DrawerSection.stories.js"));var _DrawerItemStories=_interopRequireDefault(require("../../Components/Drawer/DrawerItem/DrawerItem.stories.js"));var _DrawerBottomStories=_interopRequireDefault(require("../../Components/DrawerBottom/DrawerBottom.stories.js"));var _DividerStories=_interopRequireDefault(require("../../Components/Divider/Divider.stories.js"));var _FabStories=_interopRequireDefault(require("../../Components/Fab/Fab.stories.js"));var _FabSpeedDialStories=_interopRequireDefault(require("../../Components/Fab/FabSpeedDial/FabSpeedDial.stories.js"));var _IconsStories=_interopRequireDefault(require("../../Components/Icon/Icons.stories.js"));var _IconButtonStories=_interopRequireDefault(require("../../Components/IconButton/IconButton.stories.js"));var _ListStories=_interopRequireDefault(require("../../Components/List/List.stories.js"));var _ListExpandStories=_interopRequireDefault(require("../../Components/List/ListExpand/ListExpand.stories.js"));var _ListItemStories=_interopRequireDefault(require("../../Components/List/ListItem/ListItem.stories.js"));var _ListSectionStories=_interopRequireDefault(require("../../Components/List/ListSection/ListSection.stories.js"));var _MenuStories=_interopRequireDefault(require("../../Components/Menu/Menu.stories.js"));var _MenuItemStories=_interopRequireDefault(require("../../Components/Menu/MenuItem/MenuItem.stories.js"));var _PaperStories=_interopRequireDefault(require("../../Components/Paper/Paper.stories.js"));var _ProgressBarStories=_interopRequireDefault(require("../../Components/Progress/ProgressBar/ProgressBar.stories.js"));var _ProgressCircleStories=_interopRequireDefault(require("../../Components/Progress/ProgressCircle/ProgressCircle.stories.js"));var _RadioButtonStories=_interopRequireDefault(require("../../Components/RadioButton/RadioButton.stories.js"));var _RippleStories=_interopRequireDefault(require("../../Components/Ripple/Ripple.stories.js"));var _SearchbarStories=_interopRequireDefault(require("../../Components/Appbar/Searchbar/Searchbar.stories.js"));var _SearchfieldStories=_interopRequireDefault(require("../../Components/TextField/Searchfield/Searchfield.stories.js"));var _SelectFilledStories=_interopRequireDefault(require("../../Components/Select/SelectFilled/SelectFilled.stories.js"));var _SelectFlatStories=_interopRequireDefault(require("../../Components/Select/SelectFlat/SelectFlat.stories.js"));var _SelectOutlinedStories=_interopRequireDefault(require("../../Components/Select/SelectOutlined/SelectOutlined.stories.js"));var _SheetBottomStories=_interopRequireDefault(require("../../Components/SheetBottom/SheetBottom.stories.js"));var _SheetSideStories=_interopRequireDefault(require("../../Components/SheetSide/SheetSide.stories.js"));var _SliderStories=_interopRequireDefault(require("../../Components/Slider/Slider.stories.js"));var _SnackbarStories=_interopRequireDefault(require("../../Components/Snackbar/Snackbar.stories.js"));var _SwipeNavStories=_interopRequireDefault(require("../../Components/SwipeNav/SwipeNav.stories.js"));var _SwitchStories=_interopRequireDefault(require("../../Components/Switch/Switch.stories.js"));var _TabStories=_interopRequireDefault(require("../../Components/Tabs/Tab/Tab.stories.js"));var _TabsStories=_interopRequireDefault(require("../../Components/Tabs/Tabs.stories.js"));var _TextFieldFilledStories=_interopRequireDefault(require("../../Components/TextField/TextFieldFilled/TextFieldFilled.stories.js"));var _TextFieldFlatStories=_interopRequireDefault(require("../../Components/TextField/TextFieldFlat/TextFieldFlat.stories.js"));var _TextFieldOutlineStories=_interopRequireDefault(require("../../Components/TextField/TextFieldOutline/TextFieldOutline.stories.js"));var _ToggleButtonStories=_interopRequireDefault(require("../../Components/ToggleButton/ToggleButton.stories.js"));var _TooltipStories=_interopRequireDefault(require("../../Components/Tooltip/Tooltip.stories.js"));var _TypographyStories=_interopRequireDefault(require("../../Components/Typography/Typography.stories.js"));var _AnchorStories=_interopRequireDefault(require("../../Utils/Anchor/Anchor.stories.js"));var _HoverableStories=_interopRequireDefault(require("../../Utils/Hoverable/Hoverable.stories.js"));var _ShadowStories=_interopRequireDefault(require("../../Utils/Shadow/Shadow.stories.js")); ================================================ FILE: dist/storybook/storybook.js ================================================ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _reactNative2=require("@storybook/react-native");var _jsxFileName="/Users/cody/projects/material-bread/src/storybook/storybook.js";(0,_reactNative2.configure)(function(){require('./stories');},module);var StorybookUIRoot=(0,_reactNative2.getStorybookUI)({port:7007,onDeviceUI:true});var StorybookUIHMRRoot=function(_Component){(0,_inherits2.default)(StorybookUIHMRRoot,_Component);function StorybookUIHMRRoot(){(0,_classCallCheck2.default)(this,StorybookUIHMRRoot);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(StorybookUIHMRRoot).apply(this,arguments));}(0,_createClass2.default)(StorybookUIHMRRoot,[{key:"render",value:function render(){return _react.default.createElement(StorybookUIRoot,{__source:{fileName:_jsxFileName,lineNumber:19}});}}]);return StorybookUIHMRRoot;}(_react.Component);_reactNative.AppRegistry.registerComponent('MaterialBread',function(){return StorybookUIHMRRoot;});var _default=StorybookUIHMRRoot;exports.default=_default; ================================================ FILE: dist/vue-native.js ================================================ Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _index=require("./index");var VueMaterialBread={install:function install(Vue){Vue.component('mb-hoverable',_index.Hoverable);Vue.component('mb-shadow',_index.shadow);Vue.component('mb-anchor',_index.Anchor);Vue.component('mb-appbar',_index.Appbar);Vue.component('mb-AppbarBottom',_index.AppbarBottom);Vue.component('mb-avatar',_index.Avatar);Vue.component('mb-backdrop',_index.Backdrop);Vue.component('mb-badge',_index.Badge);Vue.component('mb-banner',_index.Banner);Vue.component('mb-bottom-navigation',_index.BottomNavigation);Vue.component('mb-bottom-navigation-item',_index.BottomNavigationItem);Vue.component('mb-button',_index.Button);Vue.component('mb-card',_index.Card);Vue.component('mb-card-actions',_index.CardActions);Vue.component('mb-card-content',_index.CardContent);Vue.component('mb-card-header',_index.CardHeader);Vue.component('mb-card-media',_index.CardMedia);Vue.component('mb-checkbox',_index.Checkbox);Vue.component('mb-chip',_index.Chip);Vue.component('mb-data-table',_index.DataTable);Vue.component('mb-data-table-header',_index.DataTableHeader);Vue.component('mb-data-table-cell',_index.DataTableCell);Vue.component('mb-data-table-pagination',_index.DataTablePagination);Vue.component('mb-data-table-row',_index.DataTableRow);Vue.component('mb-dialog',_index.Dialog);Vue.component('mb-drawer',_index.Drawer);Vue.component('mb-drawer-header',_index.DrawerHeader);Vue.component('mb-drawer-item',_index.DrawerItem);Vue.component('mb-drawer-section',_index.DrawerSection);Vue.component('mb-drawer-bottom',_index.DrawerBottom);Vue.component('mb-divider',_index.Divider);Vue.component('mb-fab',_index.Fab);Vue.component('mb-fab-speed-dial',_index.FabSpeedDial);Vue.component('mb-icon',_index.Icon);Vue.component('mb-icon-button',_index.IconButton);Vue.component('mb-list',_index.List);Vue.component('mb-list-section',_index.ListSection);Vue.component('mb-list-expand',_index.ListExpand);Vue.component('mb-list-item',_index.ListItem);Vue.component('mb-menu',_index.Menu);Vue.component('mb-menu-item',_index.MenuItem);Vue.component('mb-progress-bar',_index.ProgressBar);Vue.component('mb-progress-circle',_index.ProgressCircle);Vue.component('mb-radio-button',_index.RadioButton);Vue.component('mb-ripple',_index.Ripple);Vue.component('mb-select',_index.Select);Vue.component('mb-search-field',_index.Searchfield);Vue.component('mb-search-bar',_index.Searchbar);Vue.component('mb-sheet-bottom',_index.SheetBottom);Vue.component('mb-sheet-side',_index.SheetSide);Vue.component('mb-slider',_index.Slider);Vue.component('mb-snackbar',_index.Snackbar);Vue.component('mb-swipe-nav',_index.SwipeNav);Vue.component('mb-switch',_index.Switch);Vue.component('mb-tabs',_index.Tabs);Vue.component('mb-tab',_index.Tab);Vue.component('mb-text-field',_index.TextField);Vue.component('mb-text-field-helper-text',_index.TextFieldHelperText);Vue.component('mb-toggle-button',_index.ToggleButton);Vue.component('mb-toggle-button-group',_index.ToggleButtonGroup);Vue.component('mb-tooltip',_index.Tooltip);Vue.component('mb-heading',_index.Heading);Vue.component('mb-subtitle',_index.Subtitle);Vue.component('mb-body-text',_index.BodyText);Vue.component('mb-caption',_index.Caption);Vue.component('mb-overline',_index.Overline);Vue.component('mb-bread-provider',_index.BreadProvider);Vue.component('mb-colors',_index.Colors);Vue.component('mb-theme-context',_index.ThemeContext);}};var _default=VueMaterialBread;exports.default=_default; ================================================ FILE: docs/.babelrc ================================================ { "presets": [ [ "babel-preset-gatsby", { "targets": { "browsers": [">0.25%", "not dead"] } } ] ], "plugins": [ "@babel/plugin-transform-flow-strip-types", ["@babel/plugin-proposal-class-properties", { "loose": true }], "@babel/plugin-proposal-object-rest-spread", "@babel/plugin-proposal-export-namespace-from", "@babel/plugin-proposal-export-default-from" ] } ================================================ FILE: docs/.eslintrc ================================================ { "env": { "node": true, "browser": true, "es6": true, "jest": true }, "extends": [ "eslint:recommended", "plugin:react/recommended", "plugin:prettier/recommended" ], "parser": "babel-eslint", "rules": { "no-useless-constructor": 0, "import/no-extraneous-dependencies": 0, "import/named": 1, "import/no-unresolved": [1, { "caseSensitive": false }], "react/display-name": 0, "react/no-typos": 0 }, "plugins": ["prettier", "react", "import"], "settings": { "import/resolver": { "alias": { "map": [ ["babel-polyfill", "babel-polyfill/dist/polyfill.min.js"], ["@components", "./components"], ["@content", "./content"], ["@utls", "./utils"] ], "extensions": [".ts", ".js", ".jsx", ".json"] } } } } ================================================ FILE: docs/README.md ================================================ # Material Bread ================================================ FILE: docs/gatsby-browser.js ================================================ /** * Implement Gatsby's Browser APIs in this file. * * See: https://www.gatsbyjs.org/docs/browser-apis/ */ // You can delete this file if you're not using it ================================================ FILE: docs/gatsby-config.js ================================================ module.exports = { siteMetadata: { title: `Material Bread | React Material Design Components`, description: `Highly Customizable React Native Material Design Components`, author: `codypearce`, favicon: 'src/assets/favicon.ico', legacy: false, siteUrl: 'https://material-bread.org/', }, plugins: [ `gatsby-plugin-react-helmet`, { resolve: `gatsby-source-filesystem`, options: { name: `images`, path: `${__dirname}/src/images`, }, }, { resolve: `gatsby-source-filesystem`, options: { name: `images`, path: `${__dirname}/src/blog`, }, }, { resolve: 'gatsby-source-filesystem', options: { path: `${__dirname}/src/pages`, name: 'pages', }, }, { resolve: `gatsby-plugin-alias-imports`, options: { alias: { '@components': `${__dirname}/src/components`, '@content': `${__dirname}/src/content`, '@utils': `${__dirname}/src/utils`, }, extensions: [], }, }, `gatsby-plugin-react-native-web`, { resolve: `gatsby-plugin-compile-es6-packages`, options: { modules: [`react-native-vector-icons`], }, }, { resolve: `gatsby-plugin-manifest`, options: { name: `gatsby-starter-default`, short_name: `starter`, start_url: `/`, background_color: `#663399`, theme_color: `#663399`, display: `minimal-ui`, favicon: 'src/assets/favicon.ico', legacy: false, }, }, { resolve: `gatsby-plugin-layout`, options: { component: require.resolve(`./src/components/Layout/PageLayout`), }, }, 'gatsby-plugin-sharp', 'gatsby-transformer-sharp', { resolve: 'gatsby-transformer-remark', options: { plugins: [ { resolve: 'gatsby-remark-images', options: { linkImagesToOriginal: false, }, }, { resolve: 'gatsby-remark-normalize-paths', options: { pathFields: ['thumbnail'], }, }, { resolve: `gatsby-remark-prismjs`, options: { classPrefix: 'language-', inlineCodeMarker: null, aliases: {}, showLineNumbers: false, }, }, ], }, }, `gatsby-plugin-sitemap`, { resolve: `gatsby-plugin-google-analytics`, options: { trackingId: 'UA-72995758-2', }, }, ], }; ================================================ FILE: docs/gatsby-node.js ================================================ /** * Implement Gatsby's Node APIs in this file. * * See: https://www.gatsbyjs.org/docs/node-apis/ */ // const path = require(`path`); const { createFilePath } = require(`gatsby-source-filesystem`); exports.onCreateNode = ({ node, actions, getNode }) => { const { createNodeField } = actions; if (node.internal.type === `MarkdownRemark`) { const value = createFilePath({ node, getNode }); const slug = node.frontmatter.slug; createNodeField({ name: `slug`, node, value: slug, }); } }; exports.createPages = async ({ graphql, actions }) => { const { createPage } = actions; const blogPost = path.resolve(`./src/templates/blog-post.js`); const result = await graphql( ` { allMarkdownRemark( sort: { fields: [frontmatter___date], order: DESC } limit: 1000 ) { edges { node { fields { slug } frontmatter { title slug } } } } } `, ); if (result.errors) { throw result.errors; } // Create blog posts pages. const posts = result.data.allMarkdownRemark.edges; posts.forEach((post, index) => { const previous = index === posts.length - 1 ? null : posts[index + 1].node; const next = index === 0 ? null : posts[index - 1].node; createPage({ path: post.node.fields.slug, component: blogPost, context: { slug: post.node.fields.slug, previous, next, }, }); }); }; exports.onCreatePage = ({ page, actions }) => { const { createPage } = actions; if (page.path === '/') { page.context.layout = 'home'; createPage(page); } }; exports.onCreateWebpackConfig = ({ stage, loaders, actions }) => { if (stage === 'build-html') { actions.setWebpackConfig({ module: { rules: [ { test: /react-scrollspy/, use: loaders.null(), }, { test: /react-window/, use: loaders.null() }, ], }, }); } }; const fs = require('fs'); // native const zlib = require('zlib'); // native const path = require('path'); // native const glob = require('glob'); // native exports.onPostBuild = ({ pages, callback }) => { const publicPath = path.join(__dirname, 'public'); const gzippable = glob.sync(`${publicPath}/**/?(*.html|*.js|*.css)`); gzippable.forEach(file => { try { const content = fs.readFileSync(file); const zipped = zlib.gzipSync(content); fs.writeFileSync(`${file}.gz`, zipped); } catch (err) { console.log(err); // eslint-disable } }); // callback(); }; ================================================ FILE: docs/gatsby-ssr.js ================================================ /** * Implement Gatsby's SSR (Server Side Rendering) APIs in this file. * * See: https://www.gatsbyjs.org/docs/ssr-apis/ */ // You can delete this file if you're not using it ================================================ FILE: docs/package.json ================================================ { "name": "material-bread-docs", "private": true, "description": "React and React Native Material Design Components", "version": "0.1.0", "dependencies": { "@babel/plugin-transform-flow-strip-types": "^7.9.0", "babel-plugin-react-native-web": "^0.10.1", "color": "^3.1.2", "flexboxgrid": "^6.3.1", "gatsby": "^2.19.17", "gatsby-image": "^2.2.41", "gatsby-plugin-alias-imports": "^1.0.5", "gatsby-plugin-compile-es6-packages": "^1.2.0", "gatsby-plugin-google-analytics": "^2.1.35", "gatsby-plugin-layout": "^1.1.22", "gatsby-plugin-manifest": "^2.3.3", "gatsby-plugin-offline": "^2.2.10", "gatsby-plugin-react-helmet": "^3.1.22", "gatsby-plugin-react-native-web": "^2.0.0-beta.0", "gatsby-plugin-sharp": "^2.4.5", "gatsby-plugin-sitemap": "^2.2.27", "gatsby-remark-images": "^3.1.44", "gatsby-remark-normalize-paths": "^1.0.0", "gatsby-remark-prismjs": "^3.3.31", "gatsby-source-filesystem": "^2.1.48", "gatsby-transformer-remark": "^2.6.51", "gatsby-transformer-sharp": "^2.3.14", "prismjs": "^1.19.0", "prop-types": "^15.7.2", "react": "^16.12.0", "react-dom": "^16.12.0", "react-github-btn": "^1.1.1", "react-helmet": "^5.2.1", "react-live": "^1.12.0", "react-native-vector-icons": "^6.6.0", "react-native-web": "^0.11.7", "react-responsive": "8.0.0-beta.1", "react-scrollspy": "^3.4.2", "react-tooltip": "^3.11.6", "react-window": "^1.8.5" }, "devDependencies": { "@babel/plugin-proposal-export-default-from": "^7.8.3", "@babel/plugin-proposal-export-namespace-from": "^7.8.3", "babel-preset-gatsby": "^0.1.11", "eslint-import-resolver-alias": "^1.1.2", "eslint-plugin-import": "^2.20.1", "prettier": "^1.19.1" }, "keywords": [ "gatsby" ], "license": "MIT", "scripts": { "build": "gatsby build", "develop": "gatsby develop", "build-deploy": "gatsby build && rm -r ../gh && mv public ../gh", "format": "prettier --write src/**/*.{js,jsx}", "production": "gatsby serve -H 0.0.0.0 -p 80", "start": "gatsby serve -H 0.0.0.0 -p 80", "serve": "gatsby serve", "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\"" } } ================================================ FILE: docs/src/blog/baking-material/1-appbar-bottom.md ================================================ --- title: 'Baking Material Bread 1: Material Appbar Bottom' date: '2020-01-03' slug: /post/material-appbar-bottom-react-native description: 'How to build a Material Appbar Bottom in React Native' tags: ['baking-material', 'react-native', 'components'] categories: ['components'] --- ## Test ================================================ FILE: docs/src/components/BackgroundColors/BackgroundColors.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; class BackgroundColors extends Component { constructor(props) { super(props); } static propTypes = { href: PropTypes.string, children: PropTypes.node, style: PropTypes.object, }; render() { const { children, style, isAppbar } = this.props; return (

); } } export default BackgroundColors; ================================================ FILE: docs/src/components/BrowserCSS.js ================================================ import React from 'react'; import PropTypes from 'prop-types'; import IphoneX from './Iphonex'; import Pixel3xl from './Pixel3xl'; const BrowserCSS = ({ children, preview }) => { if (preview == 'web') { return (
{/*
Bread
*/}
{children}
); } else if (preview == 'ios') { return (
{children}
); } else if (preview == 'android') { return (
{children}
); } else if (preview == 'desktop') { return (
Desktop App
{children}
); } return
{children}
; }; BrowserCSS.propTypes = { children: PropTypes.node, preview: PropTypes.string, }; export default BrowserCSS; ================================================ FILE: docs/src/components/CodeBlock.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import Prismjs from 'prismjs'; import '../styles/components/CodeBlock.css'; class CodeBlock extends Component { constructor(props) { super(props); } static propTypes = { code: PropTypes.string, canCopy: PropTypes.bool, language: PropTypes.string, small: PropTypes.bool, style: PropTypes.object, fontSize: PropTypes.number, }; state = { copySuccess: false, }; componentDidMount() { Prismjs.highlightAll(); } copyToClipboard = () => { var textField = document.createElement('textarea'); textField.innerHTML = this.props.code; document.body.appendChild(textField); textField.select(); document.execCommand('copy'); textField.remove(); this.setState({ copySuccess: true }, () => { setTimeout(() => this.setState({ copySuccess: false }), 1000); }); }; render() { const { code, canCopy, language, small, style, fontSize } = this.props; const { copySuccess } = this.state; return ( 
         (this.codeArea = codeArea)}
          className={language || 'language-jsx'}
          style={{
            fontSize: fontSize ? fontSize : 14,
          }}>
          {code}
        

        {canCopy ? (
          
        ) : null}
); } } export default CodeBlock; ================================================ FILE: docs/src/components/CodeInline.js ================================================ import React, { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; class CodeInline extends Component { constructor(props) { super(props); } static propTypes = { code: PropTypes.node, type: PropTypes.string, }; render() { const { type } = this.props; let color = 'black'; if (type == 'prop') { color = '#00897B'; } else if (type == 'value') { color = '#8E24AA'; } else if (type == 'element') { color = '#E91E63'; } else if (type == 'file') { color = '#0288D1'; } return ( {' '} {this.props.code} {' '} ); } } export default CodeInline; ================================================ FILE: docs/src/components/ColorPalette/ColorBlock/ColorBlock.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { default as ColorTool } from 'color'; import { Ripple } from '../../../../../src'; import { View, Text } from 'react-native'; import styles from './ColorBlock.styles'; export default class ColorBlock extends Component { constructor(props) { super(props); } static propTypes = { name: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), color: PropTypes.string, children: PropTypes.node, header: PropTypes.string, }; copyToClipboard = () => { var textField = document.createElement('textarea'); textField.innerHTML = this.props.color; document.body.appendChild(textField); textField.select(); document.execCommand('copy'); textField.remove(); }; render() { const { name, color, header } = this.props; const textColor = ColorTool(color).isLight() ? 'black' : 'white'; return ( {header ? {header} : null} {name} {color} ); } } ================================================ FILE: docs/src/components/ColorPalette/ColorBlock/ColorBlock.styles.js ================================================ const styles = { ripple: { padding: 16, display: 'flex', flexDirection: 'column', justifyContent: 'space-between', cursor: 'pointer', width: '100%', }, textRow: { display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between', }, }; export default styles; ================================================ FILE: docs/src/components/ColorPalette/ColorBlock/index.js ================================================ export default from './ColorBlock'; ================================================ FILE: docs/src/components/ColorPalette/ColorPalette.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import ColorBlock from './ColorBlock'; import { Colors } from '../../../../src/index'; const palleteList = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900]; const palleteListExtra = ['A100', 'A200', 'A400', 'A700']; export default class ColorPalette extends Component { constructor(props) { super(props); } static propTypes = { color: PropTypes.string, name: PropTypes.string, hasExtra: PropTypes.bool, style: PropTypes.object, }; render() { const { color, name, hasExtra, style } = this.props; return (
{palleteList.map(item => { return ( ); })} {hasExtra ? palleteListExtra.map(item => { return ( ); }) : null}
); } } ================================================ FILE: docs/src/components/ColorPalette/FullPalette.js ================================================ import React, { Component } from 'react'; import ColorPallete from './ColorPalette'; const colorList = [ { name: 'Red', color: 'red', hasExtra: true }, { name: 'Pink', color: 'pink', hasExtra: true }, { name: 'Purple', color: 'purple', hasExtra: true }, { name: 'Deep Purple', color: 'deepPurple', hasExtra: true }, { name: 'Indigo', color: 'indigo', hasExtra: true }, { name: 'Blue', color: 'blue', hasExtra: true }, { name: 'Light Blue', color: 'lightBlue', hasExtra: true }, { name: 'Cyan', color: 'cyan', hasExtra: true }, { name: 'Teal', color: 'teal', hasExtra: true }, { name: 'Green', color: 'green', hasExtra: true }, { name: 'Light Green', color: 'lightGreen', hasExtra: true }, { name: 'Lime', color: 'lime', hasExtra: true }, { name: 'Yellow', color: 'yellow', hasExtra: true }, { name: 'Amber', color: 'amber', hasExtra: true }, { name: 'Orange', color: 'orange', hasExtra: true }, { name: 'Brown', color: 'brown' }, { name: 'Grey', color: 'grey' }, { name: 'Blue Grey', color: 'blueGrey' }, ]; class FullPalette extends Component { constructor(props) { super(props); } render() { return (
{colorList.map(item => { return ( ); })}
); } } export default FullPalette; ================================================ FILE: docs/src/components/ComponentPage/ComponentDemo.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { LiveEdit, ComponentDescription, Section } from '@components'; class ComponentDemo extends Component { constructor(props) { super(props); } static propTypes = { sectionName: PropTypes.string, sectionHref: PropTypes.string, sectionId: PropTypes.string, description: PropTypes.oneOfType([PropTypes.string, PropTypes.node]), code: PropTypes.string, scope: PropTypes.object, noInline: PropTypes.bool, }; render() { const { sectionName, sectionHref, sectionId, description, code, scope, noInline, livePreviewBackground, } = this.props; return (
); } } export default ComponentDemo; ================================================ FILE: docs/src/components/ComponentPage/ComponentDemoHeader.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { Section, ComponentDescription, Link } from '@components'; class ComponentDemoHeader extends Component { constructor(props) { super(props); } static propTypes = { description: PropTypes.oneOfType([PropTypes.string, PropTypes.node]), pageHref: PropTypes.oneOfType([PropTypes.string, PropTypes.object]), }; _defaultDemoHeader() { return (
You can see even more examples in the{' '} Storybook environment.
); } render() { const { pageHref, description } = this.props; return (
); } } export default ComponentDemoHeader; ================================================ FILE: docs/src/components/ComponentPage/ComponentDescription.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; class ComponentDescription extends Component { constructor(props) { super(props); } static propTypes = { text: PropTypes.oneOfType([PropTypes.string, PropTypes.node]), }; render() { const { text } = this.props; return (
{text}
); } } export default ComponentDescription; ================================================ FILE: docs/src/components/ComponentPage/ComponentHeader.js ================================================ import React, { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; import PageTitle from '../PageTitle'; import ComponentSubtitle from './ComponentSubtitle'; import CodeBlock from '../CodeBlock'; class ComponentHeader extends Component { constructor(props) { super(props); } static propTypes = { description: PropTypes.string, docsLink: PropTypes.string, title: PropTypes.string, code: PropTypes.string, }; render() { const { title, description, docsLink, code } = this.props; return ( {title}
); } } export default ComponentHeader; ================================================ FILE: docs/src/components/ComponentPage/ComponentMainDemo.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { LiveEdit, ComponentDescription, Section } from '@components'; class ComponentDemo extends Component { constructor(props) { super(props); } static propTypes = { pageHref: PropTypes.oneOfType([PropTypes.string, PropTypes.object]), description: PropTypes.oneOfType([PropTypes.string, PropTypes.node]), code: PropTypes.string, scope: PropTypes.object, noInline: PropTypes.bool, livePreviewBackground: PropTypes.string, }; render() { const { pageHref, description, code, scope, noInline, livePreviewBackground, } = this.props; return (
); } } export default ComponentDemo; ================================================ FILE: docs/src/components/ComponentPage/ComponentPageLayout.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import ComponentHeader from './ComponentHeader'; import SideScrollMenu from '../SideScrollMenu'; import { Helmet } from '@components'; import Prism from 'prismjs'; require('prismjs/components/prism-jsx.min'); require('prismjs/themes/prism-tomorrow.css'); class ComponentPageLayout extends Component { constructor(props) { super(props); } static propTypes = { description: PropTypes.string, docsLink: PropTypes.string, title: PropTypes.string, componentName: PropTypes.string, importCode: PropTypes.string, sideScrollMenuItems: PropTypes.array, children: PropTypes.node, }; componentDidMount() { Prism.highlightAll(); } render() { const { title, description, docsLink, importCode, children, sideScrollMenuItems, } = this.props; return (
{children}
); } } export default ComponentPageLayout; ================================================ FILE: docs/src/components/ComponentPage/ComponentProps.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { PropsTable, ComponentDescription, Section } from '@components'; class ComponentProps extends Component { constructor(props) { super(props); } static propTypes = { pageHref: PropTypes.oneOfType([PropTypes.string, PropTypes.object]), description: PropTypes.oneOfType([PropTypes.string, PropTypes.node]), propData: PropTypes.array, }; render() { const { pageHref, description, propData } = this.props; return (
); } } export default ComponentProps; ================================================ FILE: docs/src/components/ComponentPage/ComponentSubtitle.js ================================================ import React, { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; import Link from '../Link'; class ComponentSubtitle extends Component { constructor(props) { super(props); } static propTypes = { description: PropTypes.string, docsLink: PropTypes.string, }; _renderDocsLink() { const { docsLink } = this.props; return ( {' - '} Material Docs ); } render() { const { description, docsLink } = this.props; return (

{description} {docsLink ? this._renderDocsLink() : null}

); } } export default ComponentSubtitle; ================================================ FILE: docs/src/components/ComponentPage/ComponentUsage.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { CodeBlock, ComponentDescription, Section } from '@components'; class ComponentUsage extends Component { constructor(props) { super(props); } static propTypes = { pageHref: PropTypes.oneOfType([PropTypes.string, PropTypes.object]), description: PropTypes.oneOfType([PropTypes.string, PropTypes.node]), propData: PropTypes.array, code: PropTypes.string, }; render() { const { pageHref, code, description } = this.props; return (
); } } export default ComponentUsage; ================================================ FILE: docs/src/components/Drawer/DrawerContent.js ================================================ import React from 'react'; import PropTypes from 'prop-types'; import DrawerItem from './DrawerItem'; import DrawerItemExpand from './DrawerItemExpand'; import { gettingStartedPages, componentPages, utilsPages, stylePages, contributingPages, } from '../../navigation'; import DrawerHeader from './DrawerHeader'; export default class DrawerContent extends React.PureComponent { static propTypes = { posts: PropTypes.array, }; state = { itemSelected: '', sectionExpanded: '', }; componentDidMount() { if (typeof window !== `undefined`) { const pathName = window.location.pathname; const pathArray = pathName.split('/'); this.handleSectionExanded(pathArray); this.handleSelectedItem(pathArray, pathName); } } handleSectionExanded(pathArray) { let sectionExpanded = ''; let arrayOfExpandedSections = [ 'getting-started', 'style', 'components', 'utils', ]; for (let i = 0; i < arrayOfExpandedSections.length; i++) { if (pathArray.includes(arrayOfExpandedSections[i])) { sectionExpanded = arrayOfExpandedSections[i]; } } this.selectSection(sectionExpanded); } handleSelectedItem(pathArray, pathName) { var name = 'home'; if (pathName !== '/') { name = pathArray[pathArray.length - 2]; } const formatString = name.replace(/-/g, ' '); this.selectItem(formatString); } selectItem = name => { this.setState({ itemSelected: name, }); }; selectSection = name => { this.setState({ sectionExpanded: name, }); }; render() { const { itemSelected, sectionExpanded } = this.state; return (
{/* */}
); } } ================================================ FILE: docs/src/components/Drawer/DrawerHeader.js ================================================ import React from 'react'; import { Logo } from '@components'; import { BodyText } from '../../../../src'; export default class DrawerContent extends React.PureComponent { render() { return (
Material Bread v0.2.10
); } } const styles = { container: { padding: '12px 6px', display: 'flex', flexDirection: 'column', justifyContent: 'center', alignItems: 'center', marginBottom: 10, marginTop: 30, }, title: { color: 'rgba(255,255,255,1)', fontWeight: '500', margin: 0, marginTop: 20, letterSpacing: 1, }, version: { margin: 0, color: 'rgba(255,255,255,.7)', fontSize: 12, marginTop: 8, }, }; ================================================ FILE: docs/src/components/Drawer/DrawerItem.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { Text } from 'react-native'; import { navigate } from '@reach/router'; import { ListItem } from '../../../../src'; export class DrawerItem extends Component { static propTypes = { classes: PropTypes.object, label: PropTypes.string, link: PropTypes.string, selectItem: PropTypes.func, selected: PropTypes.bool, subItem: PropTypes.bool, subsubItem: PropTypes.bool, icon: PropTypes.string, }; handleClick = () => { const { selectItem, label, link } = this.props; selectItem(label.toLowerCase()); navigate(link); }; render() { const { label, selected, subItem, subsubItem, icon } = this.props; let marginLeft = subItem ? -6 : 0; if (subsubItem) marginLeft = 8; return ( ) : null } style={{ marginLeft, paddingTop: subItem || subsubItem ? 12 : 16, paddingBottom: subItem || subsubItem ? 12 : 16, width: subsubItem ? 'calc(100% - 8)' : '100%', borderRadius: 4, }} rippleProps={{ rippleColor: '#fff', rippleContainerBorderRadius: 4 }}> {label} ); } } export default DrawerItem; ================================================ FILE: docs/src/components/Drawer/DrawerItemExpand.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { ListExpand } from '../../../../src'; import DrawerItem from './DrawerItem'; class DrawerItemExpand extends Component { static propTypes = { classes: PropTypes.object, label: PropTypes.string, selectItem: PropTypes.func, itemSelected: PropTypes.string, sectionExpanded: PropTypes.bool, markdownMenuItems: PropTypes.array, reactPageMenuItems: PropTypes.array, icon: PropTypes.string, }; state = { open: false, }; componentDidMount() { if (this.props.sectionExpanded) { this.setState({ open: true }); } } componentDidUpdate(prevProps) { if (this.props.sectionExpanded && !prevProps.sectionExpanded) { this.setState({ open: true }); } } handleClick = () => { this.setState(state => ({ open: !state.open })); }; handleSubItemClick = name => { const { selectItem } = this.props; selectItem(name); }; renderMarkdownMenuItems() { const { markdownMenuItems, itemSelected } = this.props; if (!markdownMenuItems) return null; return markdownMenuItems.map(({ node: post }) => { return ( this.handleSubItemClick(post.title.toLowerCase())} subItem /> ); }); } renderReactMenuItems() { const { reactPageMenuItems, itemSelected } = this.props; if (!reactPageMenuItems) return null; return reactPageMenuItems.map(post => { return ( this.handleSubItemClick(post.title.toLowerCase())} subItem subsubItem={post.subsubItem} /> ); }); } render() { const { label, icon } = this.props; return ( ) : null } rippleProps={{ rippleColor: '#fff', rippleContainerBorderRadius: 4 }} style={{ paddingTop: 16, paddingBottom: 16, borderRadius: 4 }}> {this.renderMarkdownMenuItems()} {this.renderReactMenuItems()} ); } } export default DrawerItemExpand; ================================================ FILE: docs/src/components/Helmet.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { Helmet } from 'react-helmet'; class HemletHelper extends Component { constructor(props) { super(props); } static propTypes = { title: PropTypes.string, description: PropTypes.string, keywords: PropTypes.string, }; render() { const { title, description, keywords } = this.props; return ( {title} | Material Bread ); } } export default HemletHelper; ================================================ FILE: docs/src/components/HomeLiveEdit/HomeLiveEdit.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { LiveProvider, LiveError, LivePreview } from 'react-live'; // import HomeLiveEditToolTip from './HomeLiveEditToolTip'; import BrowserCSS from '../BrowserCSS'; import { View, Image, Text } from 'react-native'; import { Backdrop, List, ListItem, Icon, IconButton, Avatar, Heading, } from '../../../../src'; const thiscode = ` class Page extends React.Component { render() { const styles = { backdropHeader: { height: 56, flexDirection: 'row', alignItems: 'center', borderRadius: 10 }, backdropHeaderTitle: { fontSize: 18, color: 'white', marginLeft: 72, }, }; const NavItem = ({ text, icon, selected }) => { return ( } /> ) } const backLayerRevealed = ( Navigation ); const backLayerConcealed = ( App ); const album = ( ); const iconFav = const AlbumItem = ({ text, secondaryText }) => ( ); return ( ); } } `; class LiveEdit extends Component { constructor(props) { super(props); } static propTypes = { code: PropTypes.string, scope: PropTypes.object, syntax: PropTypes.string, noInline: PropTypes.bool, preview: PropTypes.string, }; render() { const { noInline, preview } = this.props; if (typeof window == 'undefined') { return null; } return ( ); } } export default LiveEdit; ================================================ FILE: docs/src/components/HomeLiveEdit/HomeLiveEditToolTip.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import ReactTooltip from 'react-tooltip'; class LiveEditToolTip extends Component { constructor(props) { super(props); } static propTypes = { children: PropTypes.node, }; render() { const { children } = this.props; return (
Live Editing {children}
); } } export default LiveEditToolTip; ================================================ FILE: docs/src/components/IconDirectory/IconBlock.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { Text } from 'react-native'; import { Icon, Ripple, Hoverable } from '../../../../src/index'; export default class IconBlock extends Component { constructor(props) { super(props); } static propTypes = { name: PropTypes.string, }; state = { backgroundColor: 'rgba(0,0,0,0)', }; handleHover(toggle) { this.setState({ backgroundColor: toggle ? 'rgba(0,0,0,.18)' : 'rgba(0,0,0,0)', }); } copyToClipboard = () => { var textField = document.createElement('textarea'); textField.innerHTML = this.props.name; document.body.appendChild(textField); textField.select(); document.execCommand('copy'); textField.remove(); }; render() { const { name } = this.props; return ( this.handleHover(true)} onHoverOut={() => this.handleHover(false)} key={name}> {() => ( {name} )} ); } } const styles = { iconBlock: { display: 'flex', flexDirection: 'column', width: 116, height: 116, borderRadius: 6, alignItems: 'center', justifyContent: 'center', }, icon: { marginBottom: 16, }, iconName: { fontSize: 12, color: 'rgba(0,0,0,.6)', textAlign: 'center', }, }; ================================================ FILE: docs/src/components/IconDirectory/IconDirectory.js ================================================ import React, { Component } from 'react'; import icons from 'react-native-vector-icons/glyphmaps/MaterialIcons.json'; import IconBlock from './IconBlock'; import { FixedSizeGrid as Grid } from 'react-window'; import { Searchfield } from '../../../../src/index'; export default class IconDirectory extends Component { constructor(props) { super(props); } state = { search: '', }; _getResults = () => { const { search } = this.state; const iconNames = Object.keys(icons); if (search) { const query = search.toLowerCase(); return iconNames.filter( item => item.includes(query.replace(/\s/g, '-')) || item.replace(/-/g, '').includes(query), ); } return iconNames; }; _handleInputChange = value => { this.setState({ search: value }); }; renderRow = ({ columnIndex, rowIndex, style }) => { const searchResults = this._getResults(); const name = searchResults[columnIndex + rowIndex * 5]; return (
); }; render() { const searchResults = this._getResults(); if (typeof window == 'undefined') { return null; } return (
this.setState({ search: '' })} placeholder="Search Icons" style={{ height: 50, width: '100%', maxWidth: 820, marginBottom: 20 }} />
{this.renderRow}
); } } const styles = { container: { marginBottom: 40, }, results: { display: 'flex', flexWrap: 'wrap', }, searchBar: { border: 0, display: 'block', width: '100%', padding: 12, backgroundColor: '#f0f0f0', borderRadius: 3, }, }; ================================================ FILE: docs/src/components/Iphonex.js ================================================ import React from 'react'; import PropTypes from 'prop-types'; function IphoneX({ children }) { return (
10:30
{children}
); } IphoneX.propTypes = { children: PropTypes.node, }; export default IphoneX; ================================================ FILE: docs/src/components/Layout/Header.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { IconButton, Ripple } from '../../../../src'; import github from '../../assets/github.svg'; import githubWhite from '../../assets/github--white.svg'; import { Appbar } from '../../../../src'; import MediaQuery from 'react-responsive'; class Header extends Component { constructor(props) { super(props); } static propTypes = { classes: PropTypes.object, handleDrawerToggle: PropTypes.func, isTemporary: PropTypes.bool, }; state = { backgroundOverride: false, isMobile: false, }; componentDidMount() { const location = window && window.location; const pathName = location.pathname; if (pathName == '/') { this.setState({ backgroundOverride: true }); } const mediaQuery = window.matchMedia('(min-width: 1000px)'); if (mediaQuery.matches) { this.setState({ isMobile: false }); } else { this.setState({ isMobile: true }); } mediaQuery.addListener(mq => { if (mq.matches) { this.setState({ isMobile: false }); } else { this.setState({ isMobile: true }); } }); } componentDidUpdate(prevProps, prevState) { const location = window && window.location; const pathName = location.pathname; if (!prevState.backgroundOverride && pathName == '/') { this.setState({ backgroundOverride: true }); } else if (prevState.backgroundOverride && pathName !== '/') { this.setState({ backgroundOverride: false }); } } render() { const { handleDrawerToggle, isTemporary } = this.props; const { backgroundOverride, isMobile } = this.state; let backgroundColor = isTemporary ? 'linear-gradient(176deg, rgb(5, 2, 65) 0%, rgb(1, 1, 31) 100%)' : 'transparent'; backgroundColor = backgroundOverride && !isMobile ? 'transparent' : backgroundColor; return ( ); } } export default Header; ================================================ FILE: docs/src/components/Layout/PageLayout.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { Helmet } from 'react-helmet'; import '../../../node_modules/flexboxgrid/css/flexboxgrid.min.css'; import '../../styles/global/global.css'; import Header from './Header'; import Prism from 'prismjs'; import favicon from '../../assets/favicon.ico'; import { Drawer } from '../../../../src/'; import DrawerContent from '../Drawer/DrawerContent'; require('prismjs/components/prism-jsx.min'); require('prismjs/themes/prism-tomorrow.css'); export default class PageLayout extends Component { static propTypes = { theme: PropTypes.object, children: PropTypes.node, posts: PropTypes.array, pageContext: PropTypes.object, }; state = { mobileOpen: false, isTemporary: true, firstLoaded: false, isMobile: false, }; componentDidMount() { Prism.highlightAll(); const location = window && window.location; const hash = location.hash; if (hash) { const id = hash.split('#')[1].toString(); const el = document.getElementById(id); if (el) { el.scrollIntoView({ behavior: 'smooth', }); } } const pathName = location.pathname; if (pathName !== '/') { this.setLarge(); } else if (pathName == '/') { this.setSmall(); } const mediaQuery = window.matchMedia('(min-width: 1180px)'); if (mediaQuery.matches && pathName != '/') { this.setLarge(); } else { this.setSmall(); } mediaQuery.addListener(mq => { if (mq.matches && pathName != '/') { this.setLarge(); } else { this.setSmall(); } }); this.setState({ firstLoaded: true }); } componentDidUpdate(prevProps, prevState) { Prism.highlightAll(); this.handleDifferentLayouts(prevState); } setSmall = () => { this.setState({ isTemporary: true, mobileOpen: false }); }; setLarge = () => { this.setState({ isTemporary: false, mobileOpen: true }); }; handleDifferentLayouts = () => { if (typeof window !== `undefined`) { const location = window && window.location; const pathName = location.pathname; const width = window.innerWidth; const { isTemporary } = this.state; if (isTemporary && pathName !== '/' && width >= 1180) { this.setLarge(); } else if (pathName == '/' && !isTemporary) { this.setSmall(); } } }; handleDrawerToggle = () => { this.setState(state => ({ mobileOpen: !state.mobileOpen })); }; _renderMain() { const { children, pageContext } = this.props; const { isTemporary } = this.state; if (pageContext.layout === 'home') { return (
{children}
); } return (
{children}
); } render() { const { posts, pageContext } = this.props; const { isTemporary, isMobile } = this.state; if (!this.state.firstLoaded) return (
); return (
Material Bread } position={'fixed'} style={{ height: 'auto', minHeight: '100%', backgroundColor: '#f7f9fc', }} drawerStyle={{ borderRightWidth: 0, height: '100%', }} scrimStyles={{ height: '100%' }} width={250}>
{this._renderMain()}
); } } ================================================ FILE: docs/src/components/Link.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { Hoverable } from '../../../src/index'; class Link extends Component { constructor(props) { super(props); } static propTypes = { href: PropTypes.string, children: PropTypes.node, style: PropTypes.object, }; state = { color: '#060443', }; handleHover(toggle) { this.setState({ color: toggle ? '#1712b9' : '#060443' }); } render() { const { href, children, style } = this.props; return ( this.handleHover(true)} onHoverOut={() => this.handleHover(false)}> {children} ); } } export default Link; ================================================ FILE: docs/src/components/LiveEdit/LiveEdit.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { LiveProvider, LiveEditor, LiveError, LivePreview } from 'react-live'; import LiveEditToolTip from './LiveEditToolTip'; class LiveEdit extends Component { constructor(props) { super(props); } static propTypes = { code: PropTypes.string, scope: PropTypes.object, syntax: PropTypes.string, noInline: PropTypes.bool, livePreviewBackground: PropTypes.string, }; render() { const { scope, code, syntax, noInline, livePreviewBackground } = this.props; if (typeof window == 'undefined') { return null; } return ( ); } } export default LiveEdit; ================================================ FILE: docs/src/components/LiveEdit/LiveEditToolTip.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import ReactTooltip from 'react-tooltip'; class LiveEditToolTip extends Component { constructor(props) { super(props); } static propTypes = { children: PropTypes.node, }; render() { const { children } = this.props; return (
Live Editing {children}
); } } export default LiveEditToolTip; ================================================ FILE: docs/src/components/Logo/Logo.js ================================================ import React from 'react'; import PropTypes from 'prop-types'; import '../../styles/components/Logo.css'; function Logo({ animated, width, height, style }) { return ( ); } Logo.propTypes = { animated: PropTypes.bool, width: PropTypes.number, height: PropTypes.number, style: PropTypes.object, }; export default Logo; ================================================ FILE: docs/src/components/Logo/LogoWithText.js ================================================ import React from 'react'; import Logo from './Logo'; import PropTypes from 'prop-types'; function LogoWithText({ subtitle, style, height, width }) { return (

Material Bread

{subtitle ? (

One Component Library, Six Platforms

) : null}
); } const styles = { container: { // maxWidth: 387, marginBottom: 20, alignItems: 'center', justifyContent: 'center', // display: 'flex', display: 'inline-block', }, title: { fontSize: 48, marginTop: 10, marginBottom: 0, color: 'white', textAlign: 'center', }, subtitle: { fontSize: 16, // color: 'rgba(10, 10, 10, 0.67)', fontWeight: 400, margin: 0, marginTop: 6, marginBottom: 0, color: 'white', }, }; LogoWithText.propTypes = { subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]), style: PropTypes.object, height: PropTypes.number, width: PropTypes.number, }; export default LogoWithText; ================================================ FILE: docs/src/components/P.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; class P extends Component { constructor(props) { super(props); } static propTypes = { href: PropTypes.string, children: PropTypes.node, style: PropTypes.object, }; render() { const { children, style } = this.props; return (

{children}

); } } export default P; ================================================ FILE: docs/src/components/PageTitle.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; class PageTitle extends Component { constructor(props) { super(props); } static propTypes = { children: PropTypes.node, }; render() { return (

{this.props.children}

); } } export default PageTitle; ================================================ FILE: docs/src/components/Pixel3xl.js ================================================ import React from 'react'; import PropTypes from 'prop-types'; function Pixel3xl({ children }) { return (
{children}
); } Pixel3xl.propTypes = { children: PropTypes.node, }; export default Pixel3xl; ================================================ FILE: docs/src/components/PlatformButton.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { Link } from '@components'; import { Ripple, Hoverable } from '../../../src'; class Section extends Component { constructor(props) { super(props); } static propTypes = { name: PropTypes.string, href: PropTypes.string, children: PropTypes.node, id: PropTypes.string, }; state = { color: 'transparent', }; handleHover(toggle) { this.setState({ backgroundColor: toggle ? 'rgba(0,0,0,.12)' : 'transparent', }); } render() { const { text, img, href, imgWidth, width, height, platforms } = this.props; const { backgroundColor } = this.state; return ( this.handleHover(true)} onHoverOut={() => this.handleHover(false)}>

{text}

{platforms && platforms.map((platform, index) => ( {platform} ))}

); } } export default Section; ================================================ FILE: docs/src/components/PropsTable/index.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { DataTable, DataTableRow, DataTableCell } from '../../../../src'; export default class PropsTable extends Component { constructor(props) { super(props); } static propTypes = { data: PropTypes.array, classes: PropTypes.object, }; render() { const { data } = this.props; return ( {data.map(row => ( ))} ); } } ================================================ FILE: docs/src/components/Section.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import SectionHeader from './SectionHeader'; class Section extends Component { constructor(props) { super(props); } static propTypes = { name: PropTypes.string, href: PropTypes.string, children: PropTypes.node, id: PropTypes.string, style: PropTypes.object, }; render() { const { name, href, children, id, style } = this.props; return (
{children}
); } } export default Section; ================================================ FILE: docs/src/components/SectionHeader.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; class PageTitle extends Component { constructor(props) { super(props); } static propTypes = { name: PropTypes.string, href: PropTypes.string, }; render() { const { name, href } = this.props; return (

{name}{' '} #

); } } export default PageTitle; ================================================ FILE: docs/src/components/SideScrollMenu/index.js ================================================ import React, { Component } from 'react'; import ReactDOM from 'react-dom'; import PropTypes from 'prop-types'; import Scrollspy from 'react-scrollspy'; class SideScrollMenu extends Component { constructor(props) { super(props); } static propTypes = { items: PropTypes.array, }; state = { slideTop: 0, height: 60, }; componentDidMount() { const { items } = this.props; this.setState({ height: items.length * 30 }); } formatLinkFromName(str) { str = str.replace(/\s+/g, '-').toLowerCase(); return str.toString(); } handleLinks() { const { items } = this.props; const sections = items.map(item => { return this.formatLinkFromName(item.name); }); return sections; } renderMenuItems(item, index) { const link = this.formatLinkFromName(item.name); return (
  • {item.name}
    • ); } animateSlideItem(id) { if (!id) return; const items = this.handleLinks(); const index = items.findIndex(item => item == id); this.setState({ slideTop: 30 * index }); } render() { const { items } = this.props; if (typeof window == 'undefined') { return null; } return ReactDOM.createPortal(
  • this.animateSlideItem(stuff && stuff.id)} items={this.handleLinks()} currentClassName="is-current" className="SideMenu"> {items && items.map((item, index) => this.renderMenuItems(item, index))}
    • , document.body, ); } } export default SideScrollMenu; ================================================ FILE: docs/src/components/Sponsored.js ================================================ import React from 'react' const Sponsored = ({ }) => (
    Sponsored By FullStack Labs
    ) export default Sponsored ================================================ FILE: docs/src/components/blog/Layout.js ================================================ import React from 'react'; class Layout extends React.Component { render() { const { location, title, children } = this.props; const rootPath = `${__PATH_PREFIX__}/`; return (
    {children}
    ); } } export default Layout; ================================================ FILE: docs/src/components/blog/seo.js ================================================ /** * SEO component that queries for data with * Gatsby's useStaticQuery React hook * * See: https://www.gatsbyjs.org/docs/use-static-query/ */ import React from 'react'; import PropTypes from 'prop-types'; import Helmet from 'react-helmet'; import { useStaticQuery, graphql } from 'gatsby'; function SEO({ description, lang, meta, title, thumbnail }) { const { site } = useStaticQuery( graphql` query { site { siteMetadata { title description author } } } `, ); const metaDescription = description || site.siteMetadata.description; const imageSrc = thumbnail && thumbnail.childImageSharp.sizes.src; let origin = 'https://material-bread.org/'; if (typeof window !== 'undefined') { origin = window.location.origin; } const image = origin + imageSrc; return ( ); } SEO.defaultProps = { lang: `en`, meta: [], description: ``, }; SEO.propTypes = { description: PropTypes.string, lang: PropTypes.string, meta: PropTypes.arrayOf(PropTypes.object), title: PropTypes.string.isRequired, }; export default SEO; ================================================ FILE: docs/src/components/image.js ================================================ // import React from "react" // import { StaticQuery, graphql } from "gatsby" // import Img from "gatsby-image" /* * This component is built using `gatsby-image` to automatically serve optimized * images with lazy loading and reduced file sizes. The image is loaded using a * `StaticQuery`, which allows us to load the image from directly within this * component, rather than having to pass the image data down from pages. * * For more information, see the docs: * - `gatsby-image`: https://gatsby.dev/gatsby-image * - `StaticQuery`: https://gatsby.dev/staticquery */ // const Image = () => ( // } // /> // ) // export default Image ================================================ FILE: docs/src/components/index.js ================================================ // COMPONENTS export { default as P } from './P'; export { default as Link } from './Link'; export { default as PageTitle } from './PageTitle'; export { default as Section } from './Section'; export { default as SectionHeader } from './SectionHeader'; export { default as CodeInline } from './CodeInline'; export { default as CodeBlock } from './CodeBlock'; export { default as Helmet } from './Helmet'; // COLOR PALLETE export { default as ColorPalette } from './ColorPalette/ColorPalette'; // COMOPNENT PAGE export { default as ComponentDescription, } from './ComponentPage/ComponentDescription'; export { default as ComponentHeader } from './ComponentPage/ComponentHeader'; export { default as ComponentPageLayout, } from './ComponentPage/ComponentPageLayout'; export { default as ComponentSubtitle, } from './ComponentPage/ComponentSubtitle'; export { default as ComponentDemo } from './ComponentPage/ComponentDemo'; export { default as ComponentDemoHeader, } from './ComponentPage/ComponentDemoHeader'; export { default as ComponentMainDemo, } from './ComponentPage/ComponentMainDemo'; export { default as ComponentUsage } from './ComponentPage/ComponentUsage'; export { default as ComponentProps } from './ComponentPage/ComponentProps'; // ICON DIRECTORY export { default as IconDirectory } from './IconDirectory/IconDirectory'; // LAYOUT export { default as Header } from './Layout/Header'; export { default as PageLayout } from './Layout/PageLayout'; // LOGO export { default as Logo } from './Logo/Logo'; export { default as LogoWithText } from './Logo/LogoWithText'; // LIVE EDIT export { default as LiveEdit } from './LiveEdit/LiveEdit'; export { default as LiveEditToolTip } from './LiveEdit/LiveEditToolTip'; // PROPSTABLE export { default as PropsTable } from './PropsTable'; // SIDESCROLL export { default as SideScrollMenu } from './SideScrollMenu'; export { default as PlatformButton } from './PlatformButton'; ================================================ FILE: docs/src/content/components/appbar/Demos/CustomDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { CodeInline, ComponentDemo } from '@components'; import { Appbar, Button } from '../../../../../../src/index'; export const code = `const styles = { appbar: { alignItems: 'center', justifyContent:'space-between', height: 60, paddingVertical: 0, paddingHorizontal: 8, backgroundColor: 'black', overflowX: 'auto' }, left: { flexDirection: 'row', alignItems: 'center', justifyContent:'flex-start', }, button: { height: 30, alignSelf: 'center', marginRight: 16 }, } render(
    } code={code} scope={{ Appbar, Button, View }} noInline /> ); export default CustomDemo; ================================================ FILE: docs/src/content/components/appbar/Demos/ImageDemo.js ================================================ import React from 'react'; import { Image } from 'react-native'; import { Link, CodeInline, ComponentDemo } from '@components'; import { Appbar, IconButton } from '../../../../../../src/index'; export const withImageCode = ` } />`; const WithImage = () => ( You must pass in an component, please read the React Native{' '} docs on Images {' '} to get a better idea of how to pass in images. Generally they are only used for bars, but can be used on other types.
    } code={withImageCode} scope={{ Appbar, IconButton, Image }} /> ); export default WithImage; ================================================ FILE: docs/src/content/components/appbar/Demos/MenuDemo.js ================================================ import React from 'react'; import { CodeInline, ComponentDemo } from '@components'; import { Appbar, IconButton, Menu, MenuItem, Button, } from '../../../../../../src/index'; export const code = ` class AppbarDemo extends React.Component { constructor() { super(); this.state = { visibleOne: false }; } render() { return ( console.log('onSearch') }, { console.log('called') this.setState({visibleOne: false}) } } button={ , ]} /> ); } }`; const MenuDemo = pageHref => ( You can add a to the{' '} as shown below.
    } code={code} scope={{ Appbar, IconButton, Menu, MenuItem, Button }} /> ); export default MenuDemo; ================================================ FILE: docs/src/content/components/appbar/Demos/SearchBarDemo.js ================================================ import React from 'react'; import { CodeInline, ComponentDemo } from '@components'; import { Appbar, IconButton, Searchbar } from '../../../../../../src/index'; export const code = `class Header extends React.Component { constructor() { super(); this.state = { value: '', isSearching: true }; } render() { return ( this.setState({isSearching: true})}, {name: 'favorite'}, , ]} style={{paddingHorizontal: this.state.isSearching ? 0 : 16}} > {this.state.isSearching ? this.setState({value})} onNavigation={() => this.setState({isSearching: false})} onCloseIcon={() => this.setState({value: ''})} /> : null} ); } }`; const WithSearchBar = pageHref => ( The ability to replace components provides various ways to display contextual s. The following demonstrates how one might set up a full search bar. Click the back button to return to a regular , click the search icon to open the contextual search appbar.
    } code={code} scope={{ Appbar, IconButton, Searchbar }} /> ); export default WithSearchBar; ================================================ FILE: docs/src/content/components/appbar/Demos/SearchFieldDemo.js ================================================ import React from 'react'; import { CodeInline, ComponentDemo } from '@components'; import { Appbar, IconButton, Searchfield } from '../../../../../../src/index'; export const code = ` class Header extends React.Component { constructor() { super(); this.state = { isSearching: false, value: '' }; } render() { return ( this.setState({value})} onFocus={() => this.setState({isSearching: true})} onBlur={() => this.setState({isSearching: false})} onCloseIcon={() => this.setState({value: ''})} />, {name: 'favorite'}, , ]} navigation={'close'} /> ); } }`; const WithSearchField = pageHref => ( You can add a or any other component directly in the{' '}
    } code={code} scope={{ Appbar, IconButton, Searchfield }} /> ); export default WithSearchField; ================================================ FILE: docs/src/content/components/appbar/Demos/SubtitleDemo.js ================================================ import React from 'react'; import { CodeInline, ComponentDemo } from '@components'; import { Appbar, IconButton } from '../../../../../../src/index'; export const code = ` console.log('onSearch')}, , ]} />`; const SubtitleDemo = pageHref => ( Subtitles can be used on or{' '} {' '} s, but not . Try changing to{' '} to see how it will display
    } code={code} scope={{ Appbar, IconButton }} /> ); export default SubtitleDemo; ================================================ FILE: docs/src/content/components/appbar/Demos/index.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { ComponentDemoHeader } from '@components'; import ImageDemo from './ImageDemo'; import SearchFieldDemo from './SearchFieldDemo'; import SearchBarDemo from './SearchBarDemo'; import SubtitleDemo from './SubtitleDemo'; import MenuDemo from './MenuDemo'; import CustomDemo from './CustomDemo'; export default class Demos extends Component { static propTypes = { pageHref: PropTypes.string, }; render() { const { pageHref } = this.props; return (
    ); } } ================================================ FILE: docs/src/content/components/appbar/MainDemo.js ================================================ import React from 'react'; import { Image } from 'react-native'; import { ComponentMainDemo, CodeInline } from '@components'; import { Appbar, IconButton, Badge } from '../../../../../src/index'; export const code = ` console.log('onNavigation!')} actionItems={[ , {name: 'search', onPress: () => console.log('onSearch')}, {name: 'more-vert'}, ]} />`; const MainDemo = pageHref => ( s are essentially broken into three parts: ,{' '} , and . Many combinations are possible using these sections, but if you need more customization you can replace all of them by passing{' '} .
    } code={code} scope={{ Appbar, IconButton, Image, Badge }} /> ); export default MainDemo; ================================================ FILE: docs/src/content/components/appbar/Props.js ================================================ import React from 'react'; import { ComponentProps, CodeInline, Link } from '@components'; import propData from './propData'; const Props = pageHref => ( Usage depends entirely on what kind of navigation you are using in your app. For example, in you can replace the entire header with a{' '} custom appbar .
    } propData={propData} /> ); export default Props; ================================================ FILE: docs/src/content/components/appbar/Usage.js ================================================ import React from 'react'; import { ComponentUsage, CodeInline, Link } from '@components'; export const code = `import React, { Component } from 'react'; import { View } from 'react-native'; import { Appbar } from 'material-bread'; export default class Header extends Component { render() { return ( ); } }`; const Usage = pageHref => ( Usage depends entirely on what kind of navigation you are using in your app. For example, in you can replace the entire header with a{' '} custom appbar .
    } code={code} /> ); export default Usage; ================================================ FILE: docs/src/content/components/appbar/index.js ================================================ import React, { Component } from 'react'; import { ComponentPageLayout } from '@components'; import MainDemo from './MainDemo'; import Usage from './Usage'; import Props from './Props'; import Demos from './Demos'; const sections = [ { name: 'Component' }, { name: 'Usage' }, { name: 'Props' }, { name: 'Demos' }, { name: 'bg image', sub: true }, { name: 'search field', sub: true }, { name: 'search bar', sub: true }, { name: 'subtitle', sub: true }, { name: 'menu', sub: true }, { name: 'custom', sub: true }, ]; export default class AppbarPage extends Component { render() { return ( ); } } ================================================ FILE: docs/src/content/components/appbar/propData.js ================================================ import { createTableData } from '@utils/createPropData'; const propData = [ [ 'actionItems', 'Each can be an object or node, renders on the right', 'array', '', ], [ 'actionItemsStyle', 'Styles the container around the actionItems', 'object || array', '', ], [ 'barType', `Type of appbar, other components change based on type`, 'string: regular, prominent, dense, prominent dense', 'regular', ], ['backgroundImage', `Renders image element as background`, 'node', ''], ['color', `Component's background color`, 'string', 'primary'], ['elevation', `Shadow on container appbar`, 'number', '8'], [ 'onNavigation', 'OnPress for navigation IconButton if provided.', 'func', '', ], ['onTitle', 'OnPress for title string if provided.', 'func', ''], [ 'navigation', 'Renders IconButton if string, or renders custom node on left of title', 'node || string', '', ], [ 'position', 'CSS position values applied to root appbar', 'string: fixed, relative, absolute', 'relative', ], [ 'subtitle', 'Only displays on barType prominent, under the Title', 'string', '', ], ['subtitleStyles', 'Styles Subtitle', 'object', ''], [ 'title', 'Displays on the left after navigation. If string it follows guidelines', 'string || node', '', ], ['titleStyles', 'Styles title if provided as string', 'object', ''], ['style', 'Styles root element', 'object', ''], ]; export default createTableData(propData); ================================================ FILE: docs/src/content/components/appbar-bottom/Demos/CustomDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { CodeInline, ComponentDemo } from '@components'; import { AppbarBottom, Button, Fab } from '../../../../../../src/index'; export const code = `const styles = { appbar: { backgroundColor: '#009688', overflowX: 'auto', }, left: { flexDirection: 'row', alignItems: 'center', justifyContent:'flex-start', minWidth: 'auto' }, button: { height: 30, alignSelf: 'center', marginRight: 16 }, fabStyle: { backgroundColor: '#00BCD4' } } render( } fabPosition="end" fabStyles={styles.fabStyle} style={{marginTop: 16}} >
    } code={code} scope={{ AppbarBottom, View, Button, Fab }} noInline /> ); export default SubtitleDemo; ================================================ FILE: docs/src/content/components/appbar-bottom/Demos/EndFabDemo.js ================================================ import React from 'react'; import { CodeInline, ComponentDemo } from '@components'; import { AppbarBottom, Fab } from '../../../../../../src/index'; export const code = `} fabPosition={'end'} fabIcon={'reply'} actionItems={[ {name: 'archive', onPress: () => console.log('onArchive')}, {name: 'mail'}, {name: 'label'}, {name: 'delete'}, ]} style={{marginTop: 16}} />`; const SubtitleDemo = pageHref => ( Changing to{' '} will move{' '} to the left after the . Add the prop to see how spacing is effected.
    } code={code} scope={{ AppbarBottom, Fab }} /> ); export default SubtitleDemo; ================================================ FILE: docs/src/content/components/appbar-bottom/Demos/NoFabDemo.js ================================================ import React from 'react'; import { CodeInline, ComponentDemo } from '@components'; import { AppbarBottom } from '../../../../../../src/index'; export const code = ` console.log('onArchive')}, {name: 'mail'}, {name: 'label'}, {name: 'delete'}, ]} style={{marginTop: 16}} />`; const SubtitleDemo = pageHref => ( If you do not provide the prop then the component will function like a normal appbar with{' '} .
    } code={code} scope={{ AppbarBottom }} /> ); export default SubtitleDemo; ================================================ FILE: docs/src/content/components/appbar-bottom/Demos/SpeedDialDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo } from '@components'; import { AppbarBottom, Fab, FabSpeedDial } from '../../../../../../src/index'; export const code = ` class Page extends React.Component { constructor(props) { super(props) } render() { const actions = [ , , , , ]; return ( } /> } fabCutout fabPosition={'end'} navigation={'arrow-back'} actionItems={[ { name: 'search', onPress: () => console.log('onSearch') }, { name: 'more-vert' }, ]} /> ); } } `; const SubtitleDemo = pageHref => ( ); export default SubtitleDemo; ================================================ FILE: docs/src/content/components/appbar-bottom/Demos/index.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { ComponentDemoHeader } from '@components'; import EndFabDemo from './EndFabDemo'; import NoFabDemo from './NoFabDemo'; import SpeedDialDemo from './SpeedDialDemo'; import CustomDemo from './CustomDemo'; export default class Demos extends Component { static propTypes = { pageHref: PropTypes.string, }; render() { const { pageHref } = this.props; return (
    ); } } ================================================ FILE: docs/src/content/components/appbar-bottom/MainDemo.js ================================================ import React from 'react'; import { ComponentMainDemo, CodeInline } from '@components'; import { AppbarBottom, Fab } from '../../../../../src/index'; export const code = `} fabPosition={'center'} fabCutout navigation={'menu'} actionItems={[ {name: 'search', onPress: () => console.log('onSearch')}, {name: 'more-vert'}, ]} style={{marginTop: 16}} />`; const MainDemo = pageHref => ( is made up of three separate parts: ,{' '} , and{' '} . Many combinations can be created with these props, however you can replace them with anything you want.
    } code={code} scope={{ AppbarBottom, Fab }} /> ); export default MainDemo; ================================================ FILE: docs/src/content/components/appbar-bottom/Props.js ================================================ import React from 'react'; import { ComponentProps } from '@components'; import propData from './propData'; const Props = pageHref => ( ); export default Props; ================================================ FILE: docs/src/content/components/appbar-bottom/Usage.js ================================================ import React from 'react'; import { ComponentUsage, CodeInline, Link } from '@components'; export const code = `import React, { Component } from 'react'; import { View } from 'react-native'; import { AppbarBottom, Fab } from 'material-bread'; export default class Page extends Component { render() { return ( } fabPosition={'center'} fabCutout navigation={'menu'} actionItems={[ {name: 'search', onPress: () => console.log('onSearch')}, {name: 'more-vert'}, ]} style={{position: 'absolute', bottom: 0}} /> ); } }`; const Usage = pageHref => ( {`Usage depends on what navigation package you're using.`} For you can follow their{' '} guide on TabNavigation
    } code={code} /> ); export default Usage; ================================================ FILE: docs/src/content/components/appbar-bottom/index.js ================================================ import React, { Component } from 'react'; import { ComponentPageLayout } from '@components'; import MainDemo from './MainDemo'; import Usage from './Usage'; import Props from './Props'; import Demos from './Demos'; const sections = [ { name: 'Component' }, { name: 'Usage' }, { name: 'Props' }, { name: 'Demos' }, { name: 'end fab', sub: true }, { name: 'no fab', sub: true }, { name: 'speeddial', sub: true }, { name: 'custom', sub: true }, ]; export default class AppbarPage extends Component { render() { return (
    ); } } ================================================ FILE: docs/src/content/components/appbar-bottom/propData.js ================================================ import { createTableData } from '../../../utils/createPropData'; const propData = [ [ 'actionItems', 'Each can be an object or node, renders on the right', 'array', '', ], ['appbarStyles', 'Styles appbar around content', 'object', ''], ['color', `Component's background color`, 'string', 'primary'], [ 'fab', `Renders an arbitrary Fab node where the position is indicated`, 'node', '', ], ['fabCutout', `Displays cutout on appbar for fab`, 'bool', 'false'], ['fabPosition', `Describes position of fab`, 'string: center, end', 'center'], [ 'onNavigation', 'OnPress for navigation IconButton if provided.', 'func', '', ], [ 'navigation', 'Name of IconButton if string or node, renders on the far left before Title', 'node || string', '', ], ['style', 'Styles root element wrapping fab and appbar', 'object', ''], ]; export default createTableData(propData); ================================================ FILE: docs/src/content/components/avatar/Demos/CustomDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { CodeInline, ComponentDemo } from '@components'; import { Avatar } from '../../../../../../src/index'; export const code = ` `; const SubtitleDemo = pageHref => ( You can style any part or add{' '} to replace all the inner content to create something more custom.
    } code={code} scope={{ View, Avatar }} /> ); export default SubtitleDemo; ================================================ FILE: docs/src/content/components/avatar/Demos/IconDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo } from '@components'; import { Avatar } from '../../../../../../src/index'; export const code = ` `; const IconDemo = pageHref => ( ); export default IconDemo; ================================================ FILE: docs/src/content/components/avatar/Demos/TextDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo } from '@components'; import { Avatar } from '../../../../../../src/index'; export const code = ` `; const SubtitleDemo = pageHref => ( ); export default SubtitleDemo; ================================================ FILE: docs/src/content/components/avatar/Demos/index.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { ComponentDemoHeader } from '@components'; import IconDemo from './IconDemo'; import TextDemo from './TextDemo'; import CustomDemo from './CustomDemo'; export default class Demos extends Component { static propTypes = { pageHref: PropTypes.string, }; render() { const { pageHref } = this.props; return (
    ); } } ================================================ FILE: docs/src/content/components/avatar/MainDemo.js ================================================ import React from 'react'; import { View, Image } from 'react-native'; import { ComponentMainDemo, CodeInline } from '@components'; import { Avatar } from '../../../../../src/index'; export const code = ` } size={64} /> } size={48} onPress={() => console.log('avatar')} ripple /> } /> `; const MainDemo = pageHref => ( Avatars can be images, letters, or icons. First provide the{' '} of avatar, then either provide the{' '} prop for icons and letters or{' '} prop for images. A simple image example is shown below.
    } code={code} scope={{ View, Avatar, Image }} /> ); export default MainDemo; ================================================ FILE: docs/src/content/components/avatar/Props.js ================================================ import React from 'react'; import { ComponentProps } from '@components'; import propData from './propData'; const Props = pageHref => ( ); export default Props; ================================================ FILE: docs/src/content/components/avatar/Usage.js ================================================ import React from 'react'; import { ComponentUsage, CodeInline, Link } from '@components'; export const code = `import React, { Component } from 'react'; import { View } from 'react-native'; import { Avatar } from 'material-bread'; export default class UserAvatar extends Component { render() { return ( ); } }`; const Usage = pageHref => ( {`Usage depends on what navigation package you're using.`} For you can follow their{' '} guide on TabNavigation
    } code={code} /> ); export default Usage; ================================================ FILE: docs/src/content/components/avatar/index.js ================================================ import React, { Component } from 'react'; import { ComponentPageLayout } from '@components'; import MainDemo from './MainDemo'; import Usage from './Usage'; import Props from './Props'; import Demos from './Demos'; const sections = [ { name: 'Component' }, { name: 'Usage' }, { name: 'Props' }, { name: 'Demos' }, { name: 'icons', sub: true }, { name: 'text', sub: true }, { name: 'custom', sub: true }, ]; export default class AvatarPage extends Component { render() { return (
    ); } } ================================================ FILE: docs/src/content/components/avatar/propData.js ================================================ import { createTableData } from '../../../utils/createPropData'; const propData = [ [ 'color', 'Background color for avatar, applies to text and icon', 'string', 'primary', ], ['content', 'Name of icon or string to be rendered', 'string', ''], ['contentColor', 'Color of icon or text', 'string', 'white'], ['contentSize', 'Custom size that is not relative to avatar', 'number', ''], ['contentStyles', 'Styles applied to content', 'object', ''], ['image', 'Display image element as avatar', 'node', ''], ['onPress', 'Onpress callback', 'func', ''], ['ripple', 'enables ripple if onPress is provided', 'bool', 'false'], ['rippleProps', 'Spreads ripple props to Ripple Component', 'object', ''], ['size', 'Size of avatar, content scales with size', 'number', '24'], ['type', 'Indicates which type of avatar', 'string: image, icon, text', ''], ['style', 'Styles root element', 'object', ''], ]; export default createTableData(propData); ================================================ FILE: docs/src/content/components/backdrop/Demos/SubheaderDemo.js ================================================ import React from 'react'; import { View, Image, Text } from 'react-native'; import { ComponentDemo } from '@components'; import { Backdrop, List, ListItem, Icon, IconButton, Avatar, Heading, } from '../../../../../../src/index'; export const code = ` class Page extends React.Component { render() { const styles = { container: { flex: 1, paddingTop: 30, }, backdropHeader: { height: 56, flexDirection: 'row', alignItems: 'center', }, backdropHeaderTitle: { fontSize: 18, color: 'white', fontWeight: '500', marginLeft: 72, }, }; const backLayerRevealed = ( Navigation } /> } /> } /> } /> ) const album = ( ) const iconFav = return ( App } backLayerRevealed={backLayerRevealed} offset={260}> ); } }`; const DotDemo = pageHref => ( ); export default DotDemo; ================================================ FILE: docs/src/content/components/backdrop/Demos/index.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { ComponentDemoHeader } from '@components'; import SubheaderDemo from './SubheaderDemo'; export default class Demos extends Component { static propTypes = { pageHref: PropTypes.string, }; render() { const { pageHref } = this.props; return (
    ); } } ================================================ FILE: docs/src/content/components/backdrop/MainDemo.js ================================================ import React from 'react'; import { View, Image, Text } from 'react-native'; import { ComponentMainDemo, CodeInline } from '@components'; import { Backdrop, List, ListItem, Icon, IconButton, Avatar, Heading, } from '../../../../../src/index'; export const code = ` class Page extends React.Component { render() { const styles = { backdropHeader: { height: 56, flexDirection: 'row', alignItems: 'center', borderRadius: 10 }, backdropHeaderTitle: { fontSize: 18, color: 'white', marginLeft: 72, }, }; const NavItem = ({ text, icon, selected }) => { return ( } /> ) } const backLayerRevealed = ( Navigation ); const backLayerConcealed = ( App ); const album = ( ); const iconFav = const AlbumItem = ({ text, secondaryText }) => ( ); return ( ); } }`; const MainDemo = pageHref => (
    The is composed of three main parts: ,{' '} , and the{' '} .{' '} renders the{' '} backlayer when the is showing. renders the full backlayer. renders as the{' '} .
    By default when the is activated it will take up the full height of the device with the{' '} at the bottom. You can customize this by passing a number to the{' '} prop for the size the backlayer should take up.
    } code={code} scope={{ Backdrop, List, ListItem, Icon, IconButton, Avatar, Heading, View, Image, Text, }} /> ); export default MainDemo; ================================================ FILE: docs/src/content/components/backdrop/Props.js ================================================ import React from 'react'; import { ComponentProps } from '@components'; import propData from './propData'; const Props = pageHref => ( ); export default Props; ================================================ FILE: docs/src/content/components/backdrop/Usage.js ================================================ import React from 'react'; import { ComponentUsage } from '@components'; export const code = `import React from 'react'; import { Backdrop, List, ListItem, Icon, IconButton, Avatar, Heading, } from 'material-bread'; class Page extends React.Component { render() { const styles = { backdropHeader: { height: 56, flexDirection: 'row', alignItems: 'center', borderRadius: 10 }, backdropHeaderTitle: { fontSize: 18, color: 'white', marginLeft: 72, }, }; const NavItem = ({ text, icon, selected }) => { return ( } /> ) } const backLayerRevealed = ( Navigation ); const backLayerConcealed = ( App ); const album = ( ); const iconFav = const AlbumItem = ({ text, secondaryText }) => ( ); return ( ); } }`; const Usage = pageHref => ; export default Usage; ================================================ FILE: docs/src/content/components/backdrop/index.js ================================================ import React, { Component } from 'react'; import { ComponentPageLayout } from '@components'; import MainDemo from './MainDemo'; import Usage from './Usage'; import Props from './Props'; import Demos from './Demos'; const sections = [ { name: 'Component' }, { name: 'Usage' }, { name: 'Props' }, { name: 'Demos' }, { name: 'subheader', sub: true }, ]; export default class BackdropPage extends Component { render() { return (
    ); } } ================================================ FILE: docs/src/content/components/backdrop/propData.js ================================================ import { createTableData } from '../../../utils/createPropData'; const propData = [ [ 'backLayerConcealed', 'Renders the backlayer when frontlayer shows', 'node', '', ], ['backLayerRevealed', 'Renders the full backlayer', 'node', ''], ['backLayerStyle', 'Styles the backlayer container element', 'object', ''], ['frontLayerStyle', 'Styles the frontlayer container element', 'object', ''], [ 'headerButtonStyle', 'Styles the animated header icon container element', 'object', '', ], [ 'initialOffset', 'Height of backLayerConcealed and offset for frontLayer', 'number', '56', ], [ 'offset', 'Offset of frontLayer when backLayer is revealed', 'number', 'window.height', ], ['style', 'Styles root element', 'object', ''], ['subheader', 'Subheader for frontLayer', 'string', ''], ]; export default createTableData(propData); ================================================ FILE: docs/src/content/components/badge/Demos/AnimatedDemo.js ================================================ import React from 'react'; import { View, Image } from 'react-native'; import { ComponentDemo, CodeInline } from '@components'; import { Badge, Icon, IconButton, Button } from '../../../../../../src/index'; export const code = `class Page extends React.Component { constructor(props) { super(props) this.state = { visible: true, } } render() { return (
    } /> ); export default DotDemo; ================================================ FILE: docs/src/content/components/badge/Demos/DotDemo.js ================================================ import React from 'react'; import { View, Image } from 'react-native'; import { ComponentDemo, CodeInline } from '@components'; import { Badge, Icon, IconButton } from '../../../../../../src/index'; export const code = ` `; const DotDemo = pageHref => ( Simply remove the prop and reduce the to something small like 7 and you will get a dot
    } /> ); export default DotDemo; ================================================ FILE: docs/src/content/components/badge/Demos/MaxDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo, CodeInline } from '@components'; import { Badge } from '../../../../../../src/index'; export const code = ` `; const MaxDemo = pageHref => ( Numerical Badges can have a . If exceeds this value, a "+" will be added to the maximum.
    } /> ); export default MaxDemo; ================================================ FILE: docs/src/content/components/badge/Demos/index.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { ComponentDemoHeader } from '@components'; import DotDemo from './DotDemo'; import AnimatedDemo from './AnimatedDemo'; import MaxDemo from './MaxDemo'; export default class Demos extends Component { static propTypes = { pageHref: PropTypes.string, }; render() { const { pageHref } = this.props; return (
    ); } } ================================================ FILE: docs/src/content/components/badge/MainDemo.js ================================================ import React from 'react'; import { View, Image } from 'react-native'; import { ComponentMainDemo, CodeInline } from '@components'; import { Badge, IconButton, Icon } from '../../../../../src/index'; export const code = ` `; const MainDemo = pageHref => ( s can be used in two ways: standalone or wrapping a component.
    } code={code} scope={{ IconButton, View, Image, Badge, Icon }} /> ); export default MainDemo; ================================================ FILE: docs/src/content/components/badge/Props.js ================================================ import React from 'react'; import { ComponentProps } from '@components'; import propData from './propData'; const Props = pageHref => ( ); export default Props; ================================================ FILE: docs/src/content/components/badge/Usage.js ================================================ import React from 'react'; import { ComponentUsage } from '@components'; export const code = `import React, { Component } from 'react'; import { Badge, IconButton } from 'material-bread'; export default class MessageIcon extends Component { render() { return ( ); } }`; const Usage = pageHref => ; export default Usage; ================================================ FILE: docs/src/content/components/badge/index.js ================================================ import React, { Component } from 'react'; import { ComponentPageLayout } from '@components'; import MainDemo from './MainDemo'; import Usage from './Usage'; import Props from './Props'; import Demos from './Demos'; const sections = [ { name: 'Component' }, { name: 'Usage' }, { name: 'Props' }, { name: 'Demos' }, { name: 'dot', sub: true }, { name: 'animated', sub: true }, { name: 'max', sub: true }, ]; export default class BadgePage extends Component { render() { return (
    ); } } ================================================ FILE: docs/src/content/components/badge/propData.js ================================================ import { createTableData } from '../../../utils/createPropData'; const propData = [ ['color', 'Background color for badge', 'string', 'primary'], ['containerStyle', 'Styles badge container', 'object', ''], ['content', 'Content displayed in badge', 'string || number', ''], ['left', 'Left position', 'number', 'auto'], ['maxValue', 'Maximum numerial value', 'number', ''], ['onPress', 'Onpress callback', 'func', ''], [ 'position', 'Positions content on children ', 'string: left, right', 'right', ], ['right', 'Right position', 'number', '0'], ['size', 'Size of badge, text scales with size', 'number', '16'], ['textColor', 'Text color for badge', 'string', 'white'], ['top', 'Top position', 'number', '0'], ['style', 'Styles badge element', 'object', ''], ['visible', 'Toggle visibility, triggers animation', 'bool', 'true'], ]; export default createTableData(propData); ================================================ FILE: docs/src/content/components/banner/Demos/SingleLineDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo, CodeInline } from '@components'; import { Banner } from '../../../../../../src/index'; export const code = ` console.log('sign in')} ]} singleLine message={ 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.' } visible /> `; const IconDemo = pageHref => ( The prop forces the banner content to show in a row and aligned to the center.{' '} {`But it doesn't force the text content onto one line.`}{' '} This is so smaller screens will handle the text more gracefully.
    } code={code} scope={{ View, Banner }} /> ); export default IconDemo; ================================================ FILE: docs/src/content/components/banner/Demos/ThreeLineDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo } from '@components'; import { Banner } from '../../../../../../src/index'; export const code = ` console.log('sign in')} ]} message={ 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco' } visible /> `; const SubtitleDemo = pageHref => ( ); export default SubtitleDemo; ================================================ FILE: docs/src/content/components/banner/Demos/index.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { ComponentDemoHeader, Link } from '@components'; import SingleLineDemo from './SingleLineDemo'; import ThreeLineDemo from './ThreeLineDemo'; export default class Demos extends Component { static propTypes = { pageHref: PropTypes.string, }; render() { const { pageHref } = this.props; return (
    ); } } ================================================ FILE: docs/src/content/components/banner/MainDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentMainDemo, CodeInline } from '@components'; import { Avatar, Banner, Button } from '../../../../../src/index'; export const code = `class Header extends React.Component { constructor(props) { super(props) this.state = { visible: true } } render() { return ( console.log('sign in')} ]} media={ } message={ 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.' } />
    } code={code} scope={{ View, Banner, Avatar, Button }} /> ); export default MainDemo; ================================================ FILE: docs/src/content/components/banner/Props.js ================================================ import React from 'react'; import { ComponentProps } from '@components'; import propData from './propData'; const Props = pageHref => ( ); export default Props; ================================================ FILE: docs/src/content/components/banner/Usage.js ================================================ import React from 'react'; import { ComponentUsage, CodeInline } from '@components'; export const code = `import React, { Component } from 'react'; import { Banner, Button } from 'material-bread'; class Header extends React.Component { constructor(props) { super(props) this.state = { visible: true } } render() { return ( console.log('sign in')} ]} media={ } message={ 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.' } />
    } code={code} /> ); export default Usage; ================================================ FILE: docs/src/content/components/banner/index.js ================================================ import React, { Component } from 'react'; import { ComponentPageLayout } from '@components'; import MainDemo from './MainDemo'; import Usage from './Usage'; import Props from './Props'; import Demos from './Demos'; const sections = [ { name: 'Component' }, { name: 'Usage' }, { name: 'Props' }, { name: 'Demos' }, { name: 'singeline', sub: true }, { name: 'threeline', sub: true }, ]; export default class BadgePage extends Component { render() { return (
    ); } } ================================================ FILE: docs/src/content/components/banner/propData.js ================================================ import { createTableData } from '../../../utils/createPropData'; const propData = [ ['actionItems', 'Array of objects for displaying actions', 'array', ''], ['media', 'Displays arbitrary component to the left of the text', 'node', ''], ['message', 'Displays banner message', 'string', ''], ['mobileLayout', 'Display mobile layout on desktop', 'bool', ''], [ 'position', 'Position on root', 'string: relative, fixed, absolute', 'relative', ], ['singleLine', 'Display banner on one line', 'bool', ''], ['visible', 'Whether the banner is visible', 'bool', ''], ['style', 'Styles root banner element', 'object', ''], ]; export default createTableData(propData); ================================================ FILE: docs/src/content/components/bottom-navigation/Demos/ColoredDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo, CodeInline } from '@components'; import { BottomNavigation, BottomNavigationItem, } from '../../../../../../src/index'; export const code = `class BottomTabs extends React.Component { constructor(props) { super(props) this.state = { value: 0 } } handleChange(value) { this.setState({value}); } render() { return ( this.handleChange(value)} actionItems={[ {icon: 'home', label: 'Home'}, {icon: 'favorite', label: 'Favorite'}, , ]} /> ); } } `; const SubtitleDemo = pageHref => ( Changing the will change the icons to display as . } code={code} scope={{ View, BottomNavigation, BottomNavigationItem }} /> ); export default SubtitleDemo; ================================================ FILE: docs/src/content/components/bottom-navigation/Demos/IconsOnly.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo } from '@components'; import { BottomNavigation, BottomNavigationItem, } from '../../../../../../src/index'; export const code = `class BottomTabs extends React.Component { constructor(props) { super(props) this.state = { value: 0 } } handleChange(value) { this.setState({value}); } render() { return ( this.handleChange(value)} actionItems={[ {icon: 'home' }, {icon: 'attach-money'}, {icon: 'favorite'}, {icon: 'info'}, , ]} /> ); } }`; const IconDemo = pageHref => ( ); export default IconDemo; ================================================ FILE: docs/src/content/components/bottom-navigation/Demos/LabelsDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo } from '@components'; import { BottomNavigation, BottomNavigationItem, } from '../../../../../../src/index'; export const code = `class BottomTabs extends React.Component { constructor(props) { super(props) this.state = { value: 0 } } handleChange(value) { this.setState({value}); } render() { return ( this.handleChange(value)} actionItems={[ {icon: 'home', label: 'Home'}, {icon: 'favorite', label: 'Favorite'}, {icon: 'info', label: 'Info'}, , ]} /> ); } }`; const IconDemo = pageHref => ( ); export default IconDemo; ================================================ FILE: docs/src/content/components/bottom-navigation/Demos/LandscapeDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo, CodeInline } from '@components'; import { BottomNavigation, BottomNavigationItem, } from '../../../../../../src/index'; export const code = `class BottomTabs extends React.Component { constructor(props) { super(props) this.state = { value: 0 } } handleChange(value) { this.setState({value}); } render() { return ( this.handleChange(value)} actionItems={[ {icon: 'home', label: 'Home'}, {icon: 'favorite', label: 'Favorite'}, {icon: 'info', label: 'Info'}, , ]} /> ); } }`; const IconDemo = pageHref => ( By default items should keep their width and have the same widths on larger width screens. If the{' '} prop is added, the labels and icons will be laid out horizontally and take up the full width of the bar both per Material Design. Check the Storybook demos for examples of both. } scope={{ View, BottomNavigation, BottomNavigationItem }} /> ); export default IconDemo; ================================================ FILE: docs/src/content/components/bottom-navigation/Demos/index.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { ComponentDemoHeader } from '@components'; import LabelsDemo from './LabelsDemo'; import ColoredDemo from './ColoredDemo'; import IconsOnly from './IconsOnly'; import LandscapeDemo from './LandscapeDemo'; export default class Demos extends Component { static propTypes = { pageHref: PropTypes.string, }; render() { const { pageHref } = this.props; return (
    ); } } ================================================ FILE: docs/src/content/components/bottom-navigation/MainDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentMainDemo, CodeInline } from '@components'; import { BottomNavigation, BottomNavigationItem, } from '../../../../../src/index'; export const code = `class BottomTabs extends React.Component { constructor(props) { super(props) this.state = { value: 0 } } handleChange(value) { this.setState({value}); } render() { return ( this.handleChange(value)} actionItems={[ {icon: 'home', label: 'Home'}, {icon: 'favorite', label: 'Favorite'}, {icon: 'info', label: 'Info'}, , ]} /> ); } }`; const MainDemo = pageHref => ( You can pass items either to the{' '} 's prop, or as for more customization. If you pass both, the{' '} elements will overwrite the{' '} elements. The active item is handled by passing in the of that item to{' '} {' '} and adding a method.{' '} {`A simple example is shown below, more customization options can be seen in the demo's section.`} } code={code} livePreviewBackground={'#f7f7f7'} scope={{ View, BottomNavigation, BottomNavigationItem }} /> ); export default MainDemo; ================================================ FILE: docs/src/content/components/bottom-navigation/Props.js ================================================ import React from 'react'; import { ComponentProps } from '@components'; import propData from './propData'; const Props = pageHref => ( ); export default Props; ================================================ FILE: docs/src/content/components/bottom-navigation/Usage.js ================================================ import React from 'react'; import { ComponentUsage, CodeInline } from '@components'; export const code = `import React, { Component } from 'react'; import { BottomNavigation, BottomNavigationItem } from 'material-bread'; class BottomTabs extends React.Component { constructor(props) { super(props) this.state = { value: 0 } } handleChange(value) { this.setState({value}); } render() { return ( this.handleChange(value)} actionItems={[ {icon: 'home', label: 'Home', onPress={() => this.props.navigation.navigate('Home')}}, {icon: 'favorite', label: 'Favorite', onPress={() => this.props.navigation.navigate('Favorites')}}, {icon: 'info', label: 'Info', onPress={() => this.props.navigation.navigate('Info')}}, this.props.navigation.navigate('Settings')}/>, ]} /> ); } }`; const Usage = pageHref => ( Follow the instructions on your navigation package of choice for setting up bottom tabs with a custom component. Otherwise you can add{' '} props to each tab to call your navigate function. } code={code} /> ); export default Usage; ================================================ FILE: docs/src/content/components/bottom-navigation/index.js ================================================ import React, { Component } from 'react'; import { ComponentPageLayout } from '@components'; import MainDemo from './MainDemo'; import Usage from './Usage'; import Props from './Props'; import Demos from './Demos'; const sections = [ { name: 'Component' }, { name: 'Usage' }, { name: 'Props' }, { name: 'Demos' }, { name: 'landscape', sub: true }, { name: 'labels', sub: true }, { name: 'colored', sub: true }, { name: 'icons', sub: true }, ]; export default class BadgePage extends Component { render() { return ( ); } } ================================================ FILE: docs/src/content/components/bottom-navigation/propData.js ================================================ import { createTableData } from '../../../utils/createPropData'; const propData = [ ['actionItems', 'Array of objects displaying tab items', 'array', ''], ['backgroundColor', 'Background Color for root component', 'string', 'white'], ['handleChange', 'fires when a BottomNavigationItem is clicked', 'func', ''], [ 'horizontalWhenLandscape', 'When in landscape mode, layout items horizontally', 'bool', 'false', ], [ 'showOneItem', 'Display one icon + label at a time, sets showOneItem to each BottomNavigationItem', 'bool', 'false', ], [ 'showLabels', 'Sets showLabel true for each BottomNavigationItem', 'bool', 'true', ], ['style', 'Styles root element', 'object', ''], ['value', 'Index of currently active Item', 'number', ''], ]; export default createTableData(propData); ================================================ FILE: docs/src/content/components/bottom-navigation-item/Demos/BadgeDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo, CodeInline, Link } from '@components'; import { BottomNavigation, BottomNavigationItem, } from '../../../../../../src/index'; export const code = `class BottomTabs extends React.Component { constructor(props) { super(props) this.state = { value: 0 } } handleChange(value) { this.setState({value}); } render() { return ( this.handleChange(value)} actionItems={[ , , , , ]} /> ); } }`; const BadgeDemo = pageHref => ( Adding values to the will display a prop over the icon. See the{' '} Badge component page for more props. } code={code} livePreviewBackground={'#f7f7f7'} scope={{ View, BottomNavigation, BottomNavigationItem }} /> ); export default BadgeDemo; ================================================ FILE: docs/src/content/components/bottom-navigation-item/Demos/CustomDemo.js ================================================ import React from 'react'; import { View, Image } from 'react-native'; import { CodeInline, ComponentDemo } from '@components'; import { BottomNavigation, BottomNavigationItem, Icon, Avatar, } from '../../../../../../src/index'; export const code = `class BottomTabs extends React.Component { constructor(props) { super(props) this.state = { value: 'Home' } } handleChange(value) { this.setState({value}); } render() { return ( this.handleChange(value)} style={{height: 42}} > , this.handleChange(value)} style={{height: 42}} > , this.handleChange(value)} style={{height: 42}} > , this.handleChange(value)} style={{height: 42, flexDirection: 'row'}} > } size={30} /> , ]} /> ); } } `; const CustomDemo = pageHref => ( Adding will replace all{' '} , but still provide logic for for switching the active item. } code={code} scope={{ View, BottomNavigation, BottomNavigationItem, Icon, Avatar, Image, }} /> ); export default CustomDemo; ================================================ FILE: docs/src/content/components/bottom-navigation-item/Demos/StyledDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo } from '@components'; import { BottomNavigation, BottomNavigationItem, } from '../../../../../../src/index'; export const code = `class BottomTabs extends React.Component { constructor(props) { super(props) this.state = { value: 0 } } handleChange(value) { this.setState({value}); } render() { return ( this.handleChange(value)} backgroundColor={'transparent'} actionItems={[ , , , , ]} /> ); } } `; const IconDemo = pageHref => ( ); export default IconDemo; ================================================ FILE: docs/src/content/components/bottom-navigation-item/Demos/index.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { ComponentDemoHeader } from '@components'; import BadgeDemo from './BadgeDemo'; import StyledDemo from './StyledDemo'; import CustomDemo from './CustomDemo'; export default class Demos extends Component { static propTypes = { pageHref: PropTypes.string, }; render() { const { pageHref } = this.props; return (
    ); } } ================================================ FILE: docs/src/content/components/bottom-navigation-item/MainDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentMainDemo, CodeInline } from '@components'; import { BottomNavigation, BottomNavigationItem, Badge, } from '../../../../../src/index'; export const code = `class BottomTabs extends React.Component { constructor(props) { super(props) this.state = { value: 'Home' } } handleChange(value) { this.setState({value}); } render() { return ( this.handleChange(value)} />, this.handleChange(value)} />, this.handleChange(value)} label={'Info'} />, this.handleChange(value)} showLabel label={'Settings'} />, ]} /> ); } }`; const MainDemo = pageHref => ( You can have only s or{' '} s, or both together. You can also mix and match components and objects in the array. } code={code} scope={{ View, BottomNavigationItem, BottomNavigation, Badge }} /> ); export default MainDemo; ================================================ FILE: docs/src/content/components/bottom-navigation-item/Props.js ================================================ import React from 'react'; import { ComponentProps } from '@components'; import propData from './propData'; const Props = pageHref => ( ); export default Props; ================================================ FILE: docs/src/content/components/bottom-navigation-item/Usage.js ================================================ import React from 'react'; import { ComponentUsage } from '@components'; export const code = `import React, { Component } from 'react'; import { BottomNavigation, BottomNavigationItem } from 'material-bread'; class BottomTabs extends Component { constructor(props) { super(props) this.state = { value: 0 } } handleChange(value) { this.setState({value}); } render() { return ( this.handleChange(value)} actionItems={[ , , , , ]} /> ); } }`; const Usage = pageHref => ; export default Usage; ================================================ FILE: docs/src/content/components/bottom-navigation-item/index.js ================================================ import React, { Component } from 'react'; import { ComponentPageLayout } from '@components'; import MainDemo from './MainDemo'; import Usage from './Usage'; import Props from './Props'; import Demos from './Demos'; const sections = [ { name: 'Component' }, { name: 'Usage' }, { name: 'Props' }, { name: 'Demos' }, { name: 'badges', sub: true }, { name: 'styled', sub: true }, { name: 'custom', sub: true }, ]; export default class BadgePage extends Component { render() { return ( ); } } ================================================ FILE: docs/src/content/components/bottom-navigation-item/propData.js ================================================ import { createTableData } from '../../../utils/createPropData'; const propData = [ ['actionItems', 'Array of objects displaying tab items', 'array', ''], [ 'active', 'Active item is handled internally with BottomNavigatino, but you can controll it manually with this prop', 'bool', '', ], [ 'badgeProps', 'Each prop is a key, adding any prop will show the badge over the icon.', 'object', '', ], [ 'handleChange', 'Is set by BottomNavigation prop, but can be overwritten individually here', 'func', '', ], ['horizontal', 'Whether to layout an item horizontally', 'bool', ''], ['icon', 'Name of material icon displayed', 'string', ''], ['isLandscape', 'Is the screen in landscape mode', 'bool', ''], ['label', 'Text to display underneath the icon', 'string', ''], [ 'maxWidth', 'The maximum width of the item', 'number', 'Min between {smallest window dimension/# of items} and 168', ], ['onItemLayout', 'Called when each item is rendered', 'func', ''], ['onPress', 'callBack to fire when clicking item', 'func', ''], [ 'showOneItem', 'Set by BottomNavigation prop, but can be overwritten individually here', 'bool', '', ], [ 'showLabel', 'Set by BottomNavigation prop, but can be overwritten individually here', 'bool', 'true', ], ['rippleProps', 'Props applied to the ripple', 'object', ''], ['style', 'Styles root element', 'object', ''], [ 'value', 'Set by BottomNavigation prop as index, but can be overwritten individually here', 'number', '', ], ]; export default createTableData(propData); ================================================ FILE: docs/src/content/components/button/Demos/ContainedDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo, CodeInline } from '@components'; import { Button, Icon } from '../../../../../../src/index'; export const code = ` `; const SubtitleDemo = pageHref => ( Adding children will replace the text node, but not icon or loader. This allows for a more customization. } code={code} scope={{ View, Button, Text, Icon }} /> ); export default SubtitleDemo; ================================================ FILE: docs/src/content/components/button/Demos/FlatDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo } from '@components'; import { Button, Icon } from '../../../../../../src/index'; export const code = ` this.setState({ visible: false })} title={'Use Googles location service?'} supportingText={ 'Let Google help apps determine location. This means sending anonymous location data to Google, even when no apps are running.' } actionItems={[ { text: 'Cancel', onPress: () => this.setState({ visible: false }), }, { text: 'OK', onPress: () => this.setState({ visible: false }), }, ]} /> ); } }`; const Usage = pageHref => ; export default Usage; ================================================ FILE: docs/src/content/components/dialog/index.js ================================================ import React, { Component } from 'react'; import { ComponentPageLayout } from '@components'; import MainDemo from './MainDemo'; import Usage from './Usage'; import Props from './Props'; import Demos from './Demos'; const sections = [ { name: 'Component' }, { name: 'Usage' }, { name: 'Props' }, { name: 'Demos' }, { name: 'alert', sub: true }, { name: 'simple', sub: true }, ]; export default class DialogPage extends Component { render() { return (
    ); } } ================================================ FILE: docs/src/content/components/dialog/propData.js ================================================ import { createTableData } from '../../../utils/createPropData'; const propData = [ ['actionItems', 'Array of actions to show at the bottom right', 'array', ''], ['actionItemsContainerStyle', 'Styles action items container', 'object', ''], [ 'contentStyle', 'Styles content container excluding action items', 'object', '', ], ['onRequestClose', 'Callback when dialog is closing', 'func', ''], ['onShow', 'Callback when dialog is opening', 'func', ''], [ 'onTouchOutside', 'Callback when clicking outside of dialog when shown', 'func', '', ], ['title', 'Adds a dialog title at the top', 'string', ''], ['titleStyle', 'Additional styles for title', 'object', ''], ['style', 'Styles container dialog', 'object', ''], ['supportingText', 'Adds styled text below title', 'string', ''], ['supportingTextStyle', 'Additional styles for supportingText', 'object', ''], ['visible', 'Wether to show dialog or not', 'bool', ''], ]; export default createTableData(propData); ================================================ FILE: docs/src/content/components/divider/Demos/InsetLeftDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo, CodeInline } from '@components'; import { Divider, List, ListItem, Avatar } from '../../../../../../src/index'; export const code = `class DialogPage extends React.Component { constructor(props) { super(props) } render() { return ( } /> } /> } /> } /> ); } } `; const SubtitleDemo = ({ pageHref }) => ( shortens the width of the divider by the provided amount and moves the{' '} to the right by that amount. This is useful for keeping the{' '} inline with other elements. } scope={{ View, Divider, List, ListItem, Avatar }} /> ); export default SubtitleDemo; ================================================ FILE: docs/src/content/components/divider/Demos/SubheaderDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo } from '@components'; import { Divider } from '../../../../../../src/index'; export const code = `class DialogPage extends React.Component { constructor(props) { super(props) } render() { return ( ); } } `; const SubtitleDemo = pageHref => ( ); export default SubtitleDemo; ================================================ FILE: docs/src/content/components/divider/Demos/index.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { ComponentDemoHeader } from '@components'; import SubheaderDemo from './SubheaderDemo'; import InsetLeftDemo from './InsetLeftDemo'; export default class Demos extends Component { static propTypes = { pageHref: PropTypes.string, }; render() { const { pageHref } = this.props; return (
    ); } } ================================================ FILE: docs/src/content/components/divider/MainDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentMainDemo, CodeInline } from '@components'; import { Divider } from '../../../../../src/index'; export const code = `class Dividers extends React.Component { constructor(props) { super(props) } render() { return ( ); } }`; const MainDemo = pageHref => ( A can be used in most components to create a visible separation between sections } code={code} scope={{ View, Divider }} /> ); export default MainDemo; ================================================ FILE: docs/src/content/components/divider/Props.js ================================================ import React from 'react'; import { ComponentProps } from '@components'; import propData from './propData'; const Props = pageHref => ( ); export default Props; ================================================ FILE: docs/src/content/components/divider/Usage.js ================================================ import React from 'react'; import { ComponentUsage } from '@components'; export const code = `import React, { Component } from 'react'; import { View } from 'react-native'; import { Divider } from 'material-bread'; class Dividerpage extends Component { constructor(props) { super(props) } render() { return ( ); } }`; const Usage = pageHref => ; export default Usage; ================================================ FILE: docs/src/content/components/divider/index.js ================================================ import React, { Component } from 'react'; import { ComponentPageLayout } from '@components'; import MainDemo from './MainDemo'; import Usage from './Usage'; import Props from './Props'; import Demos from './Demos'; const sections = [ { name: 'Component' }, { name: 'Usage' }, { name: 'Props' }, { name: 'Demos' }, { name: 'subheader', sub: true }, { name: 'insetLeft', sub: true }, ]; export default class DividerPage extends Component { render() { return (
    ); } } ================================================ FILE: docs/src/content/components/divider/propData.js ================================================ import { createTableData } from '../../../utils/createPropData'; const propData = [ ['insetHeader', 'Subheader inset number ', 'number', ''], ['insetLeft', 'Inset of Divider from left ', 'number', ''], ['marginVertical', 'Adds magin on top and bottom for spacing', 'number', ''], ['style', 'Styles root element', 'object', ''], ['subheader', 'Displays under a divider as text ', 'string', ''], ]; export default createTableData(propData); ================================================ FILE: docs/src/content/components/drawer/Demos/ClippedDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo, CodeInline } from '@components'; import { Drawer, DrawerItem, DrawerHeader, DrawerSection, Heading, BodyText, Appbar, } from '../../../../../../src/index'; export const code = `class DrawerPage extends React.Component { constructor(props) { super(props) this.state = { isOpen: false } } render() { const styles = { container: { zIndex: 1, border: '1px solid rgba(0,0,0,.12)' }, body: { backgroundColor: '#eee', height: 400, minHeight: 400, width: '100%', flex: 1, paddingTop: 20, alignItems: 'center', }, }; const DrawerContent = () => { return ( ); }; const PageContent = () => { return ( This is a page ); }; const AppbarContent = () => { return ( this.setState({ isOpen: !this.state.isOpen })} actionItems={[{ name: 'search' }, { name: 'more-vert' }]} /> ); }; return ( } onClose={() => this.setState({ isOpen: false })} appbar={} > ); } } `; const ClippedDemo = pageHref => ( Simply move the component into the prop and it will dispaly above the and{' '} } code={code} scope={{ View, Drawer, DrawerItem, DrawerHeader, DrawerSection, Heading, BodyText, Appbar, }} /> ); export default ClippedDemo; ================================================ FILE: docs/src/content/components/drawer/Demos/PermanentDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo, CodeInline } from '@components'; import { Drawer, DrawerItem, DrawerHeader, DrawerSection, Heading, BodyText, Appbar, } from '../../../../../../src/index'; export const code = `class DrawerPage extends React.Component { constructor(props) { super(props) this.state = { isOpen: true } } render() { const DrawerContent = () => { return ( ); }; const PageContent = () => { return ( This is a page ); }; const AppbarContent = () => { return ( this.setState({ isOpen: !this.state.isOpen })} actionItems={[{ name: 'search' }, { name: 'more-vert' }]} /> ); }; const styles = { container: { zIndex: 1, border: '1px solid rgba(0,0,0,.12)' }, body: { backgroundColor: '#eee', height: 400, minHeight: 400, width: '100%', flex: 1, alignItems: 'center', paddingTop: 20 }, }; return ( } onClose={() => store.set({ isOpen: false })} type={'permanent'} > ); } } `; const PermanentDemo = pageHref => ( The type is similiar to the{' '} type because there are no overlays, but instead of pushing the content to the right, it changes the width of the content to accommodate the drawer width. Toggling the drawer now changes the width of the page rather than the position left. As with the other types you can clip the drawer under the{' '} . } code={code} scope={{ View, Drawer, DrawerItem, DrawerHeader, DrawerSection, Heading, BodyText, Appbar, }} /> ); export default PermanentDemo; ================================================ FILE: docs/src/content/components/drawer/Demos/PushDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentDemo, CodeInline } from '@components'; import { Drawer, DrawerItem, DrawerHeader, DrawerSection, Heading, BodyText, Appbar, } from '../../../../../../src/index'; export const code = `class DrawerPage extends React.Component { constructor(props) { super(props) this.state = { isOpen: false } } render() { const DrawerContent = () => { return ( ); }; const PageContent = () => { return ( This is a page ); }; const AppbarContent = () => { return ( this.setState({ isOpen: !this.state.isOpen })} actionItems={[{ name: 'search' }, { name: 'more-vert' }]} /> ); }; const styles = { container: { zIndex: 1, border: '1px solid rgba(0,0,0,.12)' }, body: { backgroundColor: '#eee', height: 400, minHeight: 400, width: '100%', flex: 1, paddingTop: 20, alignItems: 'center', }, }; return ( } onClose={() => this.setState({ isOpen: false })} appbar={} type={'push'} > ); } } `; const PushDemo = pageHref => ( The type pushes the content to the right rather than overlaying on top of it like{' '} type. This example shows under the , but you can easily move it as a child instead of in the {' '} and it will push the whole page. } code={code} scope={{ View, Drawer, DrawerItem, DrawerHeader, DrawerSection, Heading, BodyText, Appbar, }} /> ); export default PushDemo; ================================================ FILE: docs/src/content/components/drawer/Demos/index.js ================================================ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { ComponentDemoHeader } from '@components'; import ClippedDemo from './ClippedDemo'; import PushDemo from './PushDemo'; import PermanentDemo from './PermanentDemo'; export default class Demos extends Component { static propTypes = { pageHref: PropTypes.string, }; render() { const { pageHref } = this.props; return (
    ); } } ================================================ FILE: docs/src/content/components/drawer/MainDemo.js ================================================ import React from 'react'; import { View, Image } from 'react-native'; import { ComponentMainDemo, CodeInline } from '@components'; import { Drawer, DrawerItem, DrawerHeader, DrawerSection, Heading, BodyText, Appbar, } from '../../../../../src/index'; export const code = `class DrawerPage extends React.Component { constructor(props) { super(props) this.state = { isOpen: false } } render() { const DrawerContent = () => { return ( ); }; const PageContent = () => { return ( This is a page ); }; const AppbarContent = isOpen => { return ( this.setState({ isOpen: !this.state.isOpen })} actionItems={[{ name: 'search' }, { name: 'more-vert' }]} /> ); }; const styles = { container: { zIndex: 1, border: '1px solid rgba(0,0,0,.12)' }, body: { backgroundColor: '#eee', height: 500, flex: 1 }, }; return ( } onClose={() => this.setState({ isOpen: false })} animationTime={250}> ); } }`; const MainDemo = pageHref => ( There three types of drawers: ,{' '} , and{' '} . All types can show at appbar height or be clipped underneath. Below is an example of a{' '} drawer that is not clipped. } code={code} scope={{ View, Drawer, DrawerItem, DrawerHeader, DrawerSection, Image, Heading, BodyText, Appbar, }} /> ); export default MainDemo; ================================================ FILE: docs/src/content/components/drawer/Props.js ================================================ import React from 'react'; import { ComponentProps } from '@components'; import propData from './propData'; const Props = pageHref => ( ); export default Props; ================================================ FILE: docs/src/content/components/drawer/Usage.js ================================================ import React from 'react'; import { ComponentUsage, CodeInline } from '@components'; export const code = `import React, { Component } from 'react'; import { View } from 'react-native'; import { Drawer, DrawerItem, DrawerHeader, DrawerSection, Appbar, Heading, BodyText } from 'material-bread'; const DrawerContent = () => { return ( ); }; const PageContent = () => { return ( This is a page ); }; const AppbarContent = isOpen => { return ( this.setState({ isOpen: !this.state.isOpen })} actionItems={[{ name: 'search' }, { name: 'more-vert' }]} /> ); }; const styles = { container: { width: '100%', }, body: { backgroundColor: '#eee', }, }; class App extends React.Component { constructor(props) { super(props) this.state = { isOpen: false } } render() { return ( } onClose={() => this.setState({ isOpen: false })} animationTime={250}> ); } }`; const Usage = pageHref => ( The component needs to wrap each page it will be displayed on. Usually this can be defined as a base layout in your root file. You must provide an function if you want to close the by clicking outside. } code={code} /> ); export default Usage; ================================================ FILE: docs/src/content/components/drawer/index.js ================================================ import React, { Component } from 'react'; import { ComponentPageLayout } from '@components'; import MainDemo from './MainDemo'; import Usage from './Usage'; import Props from './Props'; import Demos from './Demos'; const sections = [ { name: 'Component' }, { name: 'Usage' }, { name: 'Props' }, { name: 'Demos' }, { name: 'clipped', sub: true }, { name: 'push', sub: true }, { name: 'permanent', sub: true }, ]; export default class DrawerPage extends Component { render() { return (
    ); } } ================================================ FILE: docs/src/content/components/drawer/propData.js ================================================ import { createTableData } from '../../../utils/createPropData'; const propData = [ [ 'animationTime', 'How long the drawer animation should be, in ms', 'number', '200', ], [ 'appbar', 'Render appbar above drawer and page content for clipping purposes', 'node', '', ], ['contentContainerStyle', 'Styles wrapper around page content', 'object', ''], ['drawerContent', 'Components displayed inside the drawer', 'node', ''], ['drawerStyle', 'Styles drawer', 'object', ''], [ 'fullHeight', 'Drawer takes up full height of the page so conent is not scrolled', 'bool', 'false', ], ['onClose', 'Callback when clicking outside of drawer', 'func', ''], [ 'pageHeight', 'Override calculated pageHeight, useful for demos as shown', 'number', 'ScreenHeight', ], [ 'pageWidth', 'Override calculated pageWidth, useful pages that do not take up full space', 'number', 'ScreenWidth', ], ['position', 'Position of drawer', 'string', 'absolute'], ['open', 'Whether drawer is shown or hidden', 'bool', 'false'], ['style', 'Styles container element', 'object', ''], ['scrim', 'Whether scrim is shown', 'bool', 'true'], ['scrimColor', 'Color of scrim', 'object', 'black'], ['scrimOpacity', 'The ending opacity for the scim', 'number', '.4'], ['scrimStyles', 'Styles for scrim', 'object', ''], [ 'type', 'Determines the type of drawer from modal, push, and permanenent', 'string', 'modal', ], [ 'width', 'Specific drawer width in pixels, will override widthPercentage', 'number', '240', ], [ 'widthPercentage', 'Percentage of pageWidth the drawer should take up', '0-1', '.40', ], ]; export default createTableData(propData); ================================================ FILE: docs/src/content/components/drawer-bottom/MainDemo.js ================================================ import React from 'react'; import { View } from 'react-native'; import { ComponentMainDemo, CodeInline } from '@components'; import { DrawerBottom, Button, DrawerHeader, DrawerSection, DrawerItem, } from '../../../../../src/'; export const code = `class MainDemo extends React.Component { constructor(props) { super(props) this.state = { visible: false, } } render() { return (