diff --git a/android/app/build.gradle b/android/app/build.gradle index 31da03e4901b83..0b6dc966829ca9 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -232,63 +232,63 @@ dependencies { /* UNCOMMENT WHEN DISTRIBUTING api 'com.facebook.react:react-native:32.0.0' - api 'host.exp.exponent:expo-app-loader-provider:1.0.0' - api 'host.exp.exponent:expo-core:2.0.0' - api 'host.exp.exponent:expo-constants-interface:2.0.0' - api 'host.exp.exponent:expo-constants:2.0.0' - api 'host.exp.exponent:expo-document-picker:1.0.0' - api 'host.exp.exponent:expo-errors:1.0.0' - api 'host.exp.exponent:expo-file-system-interface:2.0.0' - api 'host.exp.exponent:expo-file-system:2.0.0' - api 'host.exp.exponent:expo-image-loader-interface:2.0.0' - api 'host.exp.exponent:expo-permissions:2.0.0' - api 'host.exp.exponent:expo-permissions-interface:2.0.0' - api 'host.exp.exponent:expo-sensors-interface:2.0.0' - api 'host.exp.exponent:expo-react-native-adapter:2.0.0' - api 'host.exp.exponent:expo-task-manager:1.0.0' - api 'host.exp.exponent:expo-task-manager-interface:1.0.0' + api 'host.exp.exponent:expo-app-loader-provider:3.0.0' + api 'host.exp.exponent:expo-core:3.0.1' + api 'host.exp.exponent:expo-constants-interface:3.0.0' + api 'host.exp.exponent:expo-constants:3.0.0' + api 'host.exp.exponent:expo-document-picker:3.0.0' + api 'host.exp.exponent:expo-errors:3.0.0' + api 'host.exp.exponent:expo-file-system-interface:3.0.1' + api 'host.exp.exponent:expo-file-system:3.0.1' + api 'host.exp.exponent:expo-image-loader-interface:3.0.0' + api 'host.exp.exponent:expo-permissions:3.0.0' + api 'host.exp.exponent:expo-permissions-interface:3.0.0' + api 'host.exp.exponent:expo-sensors-interface:3.0.0' + api 'host.exp.exponent:expo-react-native-adapter:3.0.1' + api 'host.exp.exponent:expo-task-manager:3.0.0' + api 'host.exp.exponent:expo-task-manager-interface:3.0.0' // Optional universal modules, could be removed // along with references in MainActivity - api 'host.exp.exponent:expo-ads-admob:2.0.0' - api 'host.exp.exponent:expo-ads-facebook:1.0.0' - api 'host.exp.exponent:expo-analytics-amplitude:1.0.0' - api 'host.exp.exponent:expo-app-auth:2.0.0' - api 'host.exp.exponent:expo-av:1.0.0' - api 'host.exp.exponent:expo-analytics-segment:2.0.0' - api 'host.exp.exponent:expo-barcode-scanner-interface:2.0.0' - api 'host.exp.exponent:expo-barcode-scanner:2.0.0' + api 'host.exp.exponent:expo-ads-admob:3.0.0' + api 'host.exp.exponent:expo-ads-facebook:3.0.0' + api 'host.exp.exponent:expo-analytics-amplitude:3.0.0' + api 'host.exp.exponent:expo-app-auth:3.0.0' + api 'host.exp.exponent:expo-av:3.0.0' + api 'host.exp.exponent:expo-analytics-segment:3.0.0' + api 'host.exp.exponent:expo-barcode-scanner-interface:3.0.0' + api 'host.exp.exponent:expo-barcode-scanner:3.0.0' api 'host.exp.exponent:expo-blur:1.0.0' - api 'host.exp.exponent:expo-brightness:1.0.0' - api 'host.exp.exponent:expo-calendar:1.0.0' - api 'host.exp.exponent:expo-camera-interface:2.0.0' - api 'host.exp.exponent:expo-camera:2.0.0' - api 'host.exp.exponent:expo-contacts:2.0.0' - api 'host.exp.exponent:expo-facebook:1.0.0' - api 'host.exp.exponent:expo-face-detector:2.0.0' - api 'host.exp.exponent:expo-face-detector-interface:2.0.0' - api 'host.exp.exponent:expo-font:2.0.0' - api 'host.exp.exponent:expo-gl-cpp:2.0.0' - api 'host.exp.exponent:expo-gl:2.0.0' - api 'host.exp.exponent:expo-google-sign-in:2.0.0' - api 'host.exp.exponent:expo-haptics:1.0.0' - api 'host.exp.exponent:expo-image-manipulator:1.0.0' - api 'host.exp.exponent:expo-intent-launcher:1.0.0' - api 'host.exp.exponent:expo-local-authentication:2.0.0' - api 'host.exp.exponent:expo-localization:2.0.0' - api 'host.exp.exponent:expo-location:2.0.1' - api 'host.exp.exponent:expo-media-library:2.0.0' - api 'host.exp.exponent:expo-print:2.0.0' - api 'host.exp.exponent:expo-secure-store:1.0.0' - api 'host.exp.exponent:expo-sensors:2.0.0' - api 'host.exp.exponent:expo-sms:2.0.0' - api 'host.exp.exponent:expo-linear-gradient:1.0.0' - api 'host.exp.exponent:expo-keep-awake:1.0.0' - api 'host.exp.exponent:expo-background-fetch:1.0.0' - api 'host.exp.exponent:expo-mail-composer:1.0.0' - api 'host.exp.exponent:expo-speech:1.0.0' - api 'host.exp.exponent:expo-sqlite:1.0.0' - api 'host.exp.exponent:expo-web-browser:1.0.0' + api 'host.exp.exponent:expo-brightness:3.0.0' + api 'host.exp.exponent:expo-calendar:3.0.0' + api 'host.exp.exponent:expo-camera-interface:3.0.0' + api 'host.exp.exponent:expo-camera:3.0.0' + api 'host.exp.exponent:expo-contacts:3.0.0' + api 'host.exp.exponent:expo-facebook:3.0.0' + api 'host.exp.exponent:expo-face-detector:3.0.0' + api 'host.exp.exponent:expo-face-detector-interface:3.0.0' + api 'host.exp.exponent:expo-font:3.0.1' + api 'host.exp.exponent:expo-gl-cpp:3.0.0' + api 'host.exp.exponent:expo-gl:3.0.1' + api 'host.exp.exponent:expo-google-sign-in:3.0.0' + api 'host.exp.exponent:expo-haptics:3.0.0' + api 'host.exp.exponent:expo-image-manipulator:3.0.0' + api 'host.exp.exponent:expo-intent-launcher:3.0.0' + api 'host.exp.exponent:expo-local-authentication:3.0.0' + api 'host.exp.exponent:expo-localization:3.0.0' + api 'host.exp.exponent:expo-location:3.0.0' + api 'host.exp.exponent:expo-media-library:3.0.0' + api 'host.exp.exponent:expo-print:3.0.0' + api 'host.exp.exponent:expo-secure-store:3.0.0' + api 'host.exp.exponent:expo-sensors:3.0.1' + api 'host.exp.exponent:expo-sms:3.0.0' + api 'host.exp.exponent:expo-linear-gradient:3.0.0' + api 'host.exp.exponent:expo-keep-awake:3.0.0' + api 'host.exp.exponent:expo-background-fetch:3.0.0' + api 'host.exp.exponent:expo-mail-composer:3.0.0' + api 'host.exp.exponent:expo-speech:3.0.0' + api 'host.exp.exponent:expo-sqlite:3.0.0' + api 'host.exp.exponent:expo-web-browser:3.0.0' END UNCOMMENT WHEN DISTRIBUTING */ } diff --git a/android/expoview/build.gradle b/android/expoview/build.gradle index 73d0c31ee8ed70..fe03aaf3050191 100644 --- a/android/expoview/build.gradle +++ b/android/expoview/build.gradle @@ -117,65 +117,65 @@ dependencies { // Current react native /* UNCOMMENT WHEN DISTRIBUTING api 'com.facebook.react:react-native:32.0.0' - api 'host.exp.exponent:expo-app-loader-provider:1.0.0' - api 'host.exp.exponent:expo-core:2.0.0' - api 'host.exp.exponent:expo-constants:2.0.0' - api 'host.exp.exponent:expo-constants-interface:2.0.0' - api 'host.exp.exponent:expo-document-picker:1.0.0' - api 'host.exp.exponent:expo-errors:1.0.0' - api 'host.exp.exponent:expo-file-system:2.0.0' - api 'host.exp.exponent:expo-file-system-interface:2.0.0' - api 'host.exp.exponent:expo-permissions:2.0.0' - api 'host.exp.exponent:expo-permissions-interface:2.0.0' - api 'host.exp.exponent:expo-react-native-adapter:2.0.0' - api 'host.exp.exponent:expo-secure-store:1.0.0' - api 'host.exp.exponent:expo-sensors-interface:2.0.0' - api 'host.exp.exponent:expo-task-manager:1.0.0' - api 'host.exp.exponent:expo-task-manager-interface:1.0.0' + api 'host.exp.exponent:expo-app-loader-provider:3.0.0' + api 'host.exp.exponent:expo-core:3.0.1' + api 'host.exp.exponent:expo-constants:3.0.0' + api 'host.exp.exponent:expo-constants-interface:3.0.0' + api 'host.exp.exponent:expo-document-picker:3.0.0' + api 'host.exp.exponent:expo-errors:3.0.0' + api 'host.exp.exponent:expo-file-system:3.0.1' + api 'host.exp.exponent:expo-file-system-interface:3.0.0' + api 'host.exp.exponent:expo-permissions:3.0.0' + api 'host.exp.exponent:expo-permissions-interface:3.0.0' + api 'host.exp.exponent:expo-react-native-adapter:3.0.0' + api 'host.exp.exponent:expo-secure-store:3.0.0' + api 'host.exp.exponent:expo-sensors-interface:3.0.0' + api 'host.exp.exponent:expo-task-manager:3.0.0' + api 'host.exp.exponent:expo-task-manager-interface:3.0.0' // Optional universal modules - compileOnly 'host.exp.exponent:expo-ads-admob:2.0.0' - compileOnly 'host.exp.exponent:expo-ads-facebook:1.0.0' - compileOnly 'host.exp.exponent:expo-analytics-amplitude:1.0.0' - compileOnly 'host.exp.exponent:expo-analytics-segment:2.0.0' - compileOnly 'host.exp.exponent:expo-app-auth:2.0.0' - compileOnly 'host.exp.exponent:expo-av:1.0.0' - compileOnly 'host.exp.exponent:expo-background-fetch:1.0.0' - compileOnly 'host.exp.exponent:expo-barcode-scanner:2.0.0' - compileOnly 'host.exp.exponent:expo-barcode-scanner-interface:2.0.0' - compileOnly 'host.exp.exponent:expo-blur:1.0.0' - compileOnly 'host.exp.exponent:expo-brightness:1.0.0' - compileOnly 'host.exp.exponent:expo-calendar:1.0.0' - compileOnly 'host.exp.exponent:expo-camera:2.0.0' - compileOnly 'host.exp.exponent:expo-camera-interface:2.0.0' - compileOnly 'host.exp.exponent:expo-contacts:2.0.0' - compileOnly 'host.exp.exponent:expo-crypto:1.0.0' - compileOnly 'host.exp.exponent:expo-face-detector:2.0.0' - compileOnly 'host.exp.exponent:expo-facebook:1.0.0' - compileOnly 'host.exp.exponent:expo-font:2.0.0' - compileOnly 'host.exp.exponent:expo-gl:2.0.0' - compileOnly 'host.exp.exponent:expo-gl-cpp:2.0.0' - compileOnly 'host.exp.exponent:expo-google-sign-in:2.0.0' - compileOnly 'host.exp.exponent:expo-haptics:1.0.0' - compileOnly 'host.exp.exponent:expo-image-loader-interface:2.0.0' - compileOnly 'host.exp.exponent:expo-image-manipulator:1.0.0' - compileOnly 'host.exp.exponent:expo-image-picker:1.0.0' - compileOnly 'host.exp.exponent:expo-intent-launcher:1.0.0' - compileOnly 'host.exp.exponent:expo-keep-awake:1.0.0' - compileOnly 'host.exp.exponent:expo-linear-gradient:1.0.0' - compileOnly 'host.exp.exponent:expo-local-authentication:2.0.0' - compileOnly 'host.exp.exponent:expo-localization:2.0.0' - compileOnly 'host.exp.exponent:expo-location:2.0.1' - compileOnly 'host.exp.exponent:expo-mail-composer:1.0.0' - compileOnly 'host.exp.exponent:expo-media-library:2.0.0' - compileOnly 'host.exp.exponent:expo-payments-stripe:2.0.0' - compileOnly 'host.exp.exponent:expo-print:2.0.0' - compileOnly 'host.exp.exponent:expo-random:1.0.0' - compileOnly 'host.exp.exponent:expo-sensors:2.0.0' - compileOnly 'host.exp.exponent:expo-sms:2.0.0' - compileOnly 'host.exp.exponent:expo-speech:1.0.0' - compileOnly 'host.exp.exponent:expo-sqlite:1.0.0' - compileOnly 'host.exp.exponent:expo-web-browser:1.0.0' + compileOnly 'host.exp.exponent:expo-ads-admob:3.0.0' + compileOnly 'host.exp.exponent:expo-ads-facebook:3.0.0' + compileOnly 'host.exp.exponent:expo-analytics-amplitude:3.0.0' + compileOnly 'host.exp.exponent:expo-analytics-segment:3.0.0' + compileOnly 'host.exp.exponent:expo-app-auth:3.0.0' + compileOnly 'host.exp.exponent:expo-av:3.0.0' + compileOnly 'host.exp.exponent:expo-background-fetch:3.0.0' + compileOnly 'host.exp.exponent:expo-barcode-scanner:3.0.0' + compileOnly 'host.exp.exponent:expo-barcode-scanner-interface:3.0.0' + compileOnly 'host.exp.exponent:expo-blur:3.0.0' + compileOnly 'host.exp.exponent:expo-brightness:3.0.0' + compileOnly 'host.exp.exponent:expo-calendar:3.0.0' + compileOnly 'host.exp.exponent:expo-camera:3.0.0' + compileOnly 'host.exp.exponent:expo-camera-interface:3.0.0' + compileOnly 'host.exp.exponent:expo-contacts:3.0.0' + compileOnly 'host.exp.exponent:expo-crypto:3.0.0' + compileOnly 'host.exp.exponent:expo-face-detector:3.0.0' + compileOnly 'host.exp.exponent:expo-facebook:3.0.0' + compileOnly 'host.exp.exponent:expo-font:3.0.1' + compileOnly 'host.exp.exponent:expo-gl:3.0.1' + compileOnly 'host.exp.exponent:expo-gl-cpp:3.0.0' + compileOnly 'host.exp.exponent:expo-google-sign-in:3.0.0' + compileOnly 'host.exp.exponent:expo-haptics:3.0.0' + compileOnly 'host.exp.exponent:expo-image-loader-interface:3.0.0' + compileOnly 'host.exp.exponent:expo-image-manipulator:3.0.0' + compileOnly 'host.exp.exponent:expo-image-picker:3.0.0' + compileOnly 'host.exp.exponent:expo-intent-launcher:3.0.0' + compileOnly 'host.exp.exponent:expo-keep-awake:3.0.0' + compileOnly 'host.exp.exponent:expo-linear-gradient:3.0.0' + compileOnly 'host.exp.exponent:expo-local-authentication:3.0.0' + compileOnly 'host.exp.exponent:expo-localization:3.0.0' + compileOnly 'host.exp.exponent:expo-location:3.0.0' + compileOnly 'host.exp.exponent:expo-mail-composer:3.0.0' + compileOnly 'host.exp.exponent:expo-media-library:3.0.0' + compileOnly 'host.exp.exponent:expo-payments-stripe:3.0.0' + compileOnly 'host.exp.exponent:expo-print:3.0.0' + compileOnly 'host.exp.exponent:expo-random:3.0.0' + compileOnly 'host.exp.exponent:expo-sensors:3.0.1' + compileOnly 'host.exp.exponent:expo-sms:3.0.0' + compileOnly 'host.exp.exponent:expo-speech:3.0.0' + compileOnly 'host.exp.exponent:expo-sqlite:3.0.0' + compileOnly 'host.exp.exponent:expo-web-browser:3.0.0' END UNCOMMENT WHEN DISTRIBUTING */ // WHEN_DISTRIBUTING_REMOVE_FROM_HERE diff --git a/docs/common/navigation-data.js b/docs/common/navigation-data.js index cc441422d48eac..ca9844eae7fd05 100644 --- a/docs/common/navigation-data.js +++ b/docs/common/navigation-data.js @@ -7,14 +7,16 @@ const fs = require('fs-extra'); const DIR_MAPPING = { introduction: 'Introduction', guides: 'Guides', + 'managed-workflow': 'Managed Workflow', + 'bare': 'Essentials', tutorials: 'Tutorials', - sdk: 'SDK API Reference', + sdk: 'Expo SDK', 'react-native': 'React Native', // "react-native-apis": 'React Native APIs', // 'react-native-components': 'React Native Components', // 'react-native-guides': 'React Native Guides', // 'react-native-basics': 'React Native Basics', - workflow: 'Working with Expo', + workflow: 'Fundamentals', distribution: 'Distributing Your App', expokit: 'ExpoKit', }; @@ -36,14 +38,10 @@ const generateNavLinks = (path_, arr) => { // Make sure to add '/' at the end of index pages so that relative links in the markdown work correctly let href = fs.existsSync(path.join(filePath, 'index.md')) ? processUrl(filePath) + '/' : ''; - // 'Introduction' section has a 'Quick Start' page that's actually at the root i.e. `/versions/v25.0/`, etc. + // 'Introduction' section has a 'Getting to know Expo' page that's actually at the root i.e. `/versions/v25.0/`, etc. if (name === 'introduction') { // TODO: find what's eating the final slash - initArr.push({ name: 'Quick Start', href: path.parse(href).dir + '//' }); - } - // 'SDK' section has a 'Introduction' page that's the same as the index page - if (name === 'sdk') { - initArr.push({ name: 'Introduction', href }); + initArr.push({ name: 'Getting to know Expo', href: path.parse(href).dir + '//' }); } arr.push({ diff --git a/docs/common/navigation.js b/docs/common/navigation.js index c9608c0f51271a..3ae0188e64d093 100644 --- a/docs/common/navigation.js +++ b/docs/common/navigation.js @@ -1,7 +1,8 @@ const { ROOT, + GROUPS, INTRODUCTION, - WORKING_WITH_EXPO, + FUNDAMENTALS, GUIDES, DISTRIBUTION, EXPOKIT, @@ -28,7 +29,7 @@ const sections = [ { name: 'Guides', reference: GUIDES }, { name: 'Distributing Your App', reference: DISTRIBUTION }, { name: 'ExpoKit', reference: EXPOKIT }, - { name: 'Working with Expo', reference: WORKING_WITH_EXPO }, + { name: 'Fundamentals', reference: FUNDAMENTALS }, { name: 'React Native', reference: REACT_NATIVE }, // { name: 'React Native Basics', reference: REACT_NATIVE_BASICS, }, // { name: 'React Native Guides', reference: REACT_NATIVE_GUIDES, }, @@ -51,9 +52,46 @@ const sortNav = nav => { return nav; }; +// Yikes, this groups together multiple sections under one heading +const groupNav = nav => { + let sections = []; + let groupIndex = {}; + nav.forEach(section => { + if (section.name === 'Expo SDK') { + let overview; + section.posts.forEach(post => { + if (post.name === 'Overview') { + overview = post; + } + }); + if (overview) { + section.posts.splice(section.posts.indexOf(overview), 1); + section.posts.unshift(overview); + } + } + let group = GROUPS[section.name]; + if (group) { + let existingGroupIndex = groupIndex[group]; + if (existingGroupIndex) { + sections[existingGroupIndex].children.push(section); + } else { + groupIndex[group] = sections.length; + sections.push({ + name: group, + children: [section], + }); + } + } else { + sections.push(section); + } + }); + + return sections; +}; + const sortedNavigation = Object.assign( ...Object.entries(navigation).map(([version, versionNavigation]) => ({ - [version]: sortNav(versionNavigation), + [version]: groupNav(sortNav(versionNavigation)), })) ); diff --git a/docs/common/sidebar-navigation-order.js b/docs/common/sidebar-navigation-order.js index 8839284e7ce1d8..2bd6c10065a85b 100644 --- a/docs/common/sidebar-navigation-order.js +++ b/docs/common/sidebar-navigation-order.js @@ -1,11 +1,23 @@ +const GROUPS = { + Fundamentals: 'Managed Workflow', + Guides: 'Managed Workflow', + 'Distributing Your App': 'Managed Workflow', + ExpoKit: 'Managed Workflow', + 'Expo SDK': 'API Reference', + 'React Native': 'API Reference', + 'Introduction': 'Get Started', + 'Essentials': 'Bare Workflow', +}; + const ROOT = [ 'Introduction', - 'Working with Expo', + 'Fundamentals', 'Guides', 'Distributing Your App', - 'Tutorials', + // 'Tutorials', 'ExpoKit', - 'SDK API Reference', + 'Essentials', + 'Expo SDK', 'React Native Basics', 'React Native Guides', 'React Native Components', @@ -13,8 +25,9 @@ const ROOT = [ ]; const INTRODUCTION = [ - 'Quick Start', + 'Getting to know Expo', 'Installation', + 'Managed and Bare Workflows', 'XDE Tour', 'Project Lifecycle', 'Community', @@ -22,7 +35,6 @@ const INTRODUCTION = [ 'Troubleshooting Proxies', 'Frequently Asked Questions', 'Already used React Native?', - 'Why not Expo?', ]; const GUIDES = [ @@ -48,27 +60,28 @@ const GUIDES = [ 'Using Sentry', ]; -const WORKING_WITH_EXPO = [ +const FUNDAMENTALS = [ 'Up and Running', - 'Upgrading Expo', - 'Upgrading Expo SDK Walkthrough', - 'Glossary of terms', - 'Configuration with app.json', - 'Development Mode', - 'exp Command-Line Interface', + 'Expo CLI', 'Viewing Logs', 'Debugging', - 'Genymotion', + 'Development Mode', 'Android Studio Emulator', + 'Genymotion', + 'Configuration with app.json', + 'Publishing', 'Release Channels', 'Building Standalone Apps', - 'Publishing', + 'Upgrading Expo', + 'Upgrading Expo SDK Walkthrough', 'Linking', - 'Expo & "Create React Native App"', 'How Expo Works', + 'Glossary of terms', + 'exp Command-Line Interface', ]; const DISTRIBUTION = [ + 'Overview', 'Building Standalone Apps', 'App signing', 'Deploying to App Stores', @@ -81,6 +94,7 @@ const DISTRIBUTION = [ ]; const EXPOKIT = [ + 'Overview', 'Detaching to ExpoKit', 'Ejecting to ExpoKit', 'Developing With ExpoKit', @@ -88,6 +102,10 @@ const EXPOKIT = [ 'Universal Modules and ExpoKit', ]; +const ESSENTIALS = [ + 'Hello World' +]; + const REACT_NATIVE = [ // 'REACT NATIVE BASICS', 'Learn the Basics', @@ -196,8 +214,10 @@ const REACT_NATIVE = [ module.exports = { ROOT, + GROUPS, INTRODUCTION, - WORKING_WITH_EXPO, + FUNDAMENTALS, + ESSENTIALS, GUIDES, DISTRIBUTION, EXPOKIT, diff --git a/docs/components/DocumentationFooter.js b/docs/components/DocumentationFooter.js index 9199860fba23ac..66f1861769cd1f 100644 --- a/docs/components/DocumentationFooter.js +++ b/docs/components/DocumentationFooter.js @@ -17,21 +17,45 @@ const STYLES_FOOTER_LINK = css` margin-bottom: 12px; `; +function githubUrl(path) { + // Remove trailing slash and append .md + let pathAsMarkdown = path.substring(0, path.length - 1) + '.md'; + if (pathAsMarkdown.startsWith('/versions/latest')) { + pathAsMarkdown = pathAsMarkdown.replace('/versions/unversioned'); + } + return `https://github.com/expo/expo/edit/master/docs/pages${pathAsMarkdown}`; +} + +// Add any page in the /sdk/ section that should not have an issues link to this +const ISSUES_BLACKLIST = ['Overview']; + export default class DocumentationFooter extends React.PureComponent { render() { return ( ); } + + maybeRenderIssuesLink = () => { + if (!this.props.asPath.includes('/sdk/') || ISSUES_BLACKLIST.includes(this.props.title)) { + return; + } + + return ( + + View open issues for {this.props.title} + + ); + }; } diff --git a/docs/components/DocumentationNestedScrollLayout.js b/docs/components/DocumentationNestedScrollLayout.js index 8e31583f8dc6ae..f7918c03f5a81d 100644 --- a/docs/components/DocumentationNestedScrollLayout.js +++ b/docs/components/DocumentationNestedScrollLayout.js @@ -120,8 +120,9 @@ const STYLES_RIGHT = css` const STYLES_SCROLL_CONTAINER = css` height: 100%; width: 100%; - padding-bottom: 72px; + padding-bottom: 36px; overflow-y: scroll; + overflow-x: hidden; -webkit-overflow-scrolling: touch; /* width */ diff --git a/docs/components/DocumentationPage.js b/docs/components/DocumentationPage.js index 8905aa00ea9da3..9f2ad80ef74e91 100644 --- a/docs/components/DocumentationPage.js +++ b/docs/components/DocumentationPage.js @@ -177,7 +177,7 @@ export default class DocumentationPage extends React.Component {

{this.props.title}

{this.props.children} - + ) : ( diff --git a/docs/components/DocumentationSidebar.js b/docs/components/DocumentationSidebar.js index 1b90ae440b8c38..e931b51bc53545 100644 --- a/docs/components/DocumentationSidebar.js +++ b/docs/components/DocumentationSidebar.js @@ -6,10 +6,15 @@ import * as Constants from '~/common/constants'; import DocumentationSidebarLink from '~/components/DocumentationSidebarLink'; import DocumentationSidebarTitle from '~/components/DocumentationSidebarTitle'; +import DocumentationSidebarGroup from '~/components/DocumentationSidebarGroup'; const STYLES_SIDEBAR = css` - width: 100%; - padding: 32px 24px 24px 24px; + padding: 20px 24px 24px 24px; + width: 280px; + + @media screen and (max-width: ${Constants.breakpoints.mobile}) { + width: 100%; + } `; const STYLES_SECTION_CATEGORY = css` @@ -34,6 +39,18 @@ export default class DocumentationSidebar extends React.Component { }; _renderCategoryElements = info => { + if (info.children) { + return ( + + {info.children.map(categoryInfo => this._renderCategoryElements(categoryInfo))} + + ); + } + const titleElement = ( + ); + } +} + +export default class DocumentationSidebarGroup extends React.Component { + constructor(props) { + super(props); + + this.state = { + isOpen: this.isChildRouteActive(), + }; + } + + isChildRouteActive() { + // Special case for "Get Started" + if (this.props.info.name === 'Get Started') { + const pathname = this.props.url.pathname; + const asPath = this.props.asPath; + if (this.props.asPath.match(/\/versions\/[\w\.]+\/$/)) { + return true; + } + } + + let result = false; + + let sections = this.props.info.children; + let posts = []; + + const isSectionActive = section => { + const linkUrl = section.as || section.href; + const pathname = this.props.url.pathname; + const asPath = this.props.asPath; + + if (linkUrl === pathname || linkUrl === asPath) { + result = true; + } + }; + + sections.forEach(section => { + posts = [...posts, ...section.posts]; + }); + + sections.forEach(isSectionActive); + posts.forEach(isSectionActive); + return result; + } + + _toggleIsOpen = () => { + this.setState(({ isOpen }) => ({ isOpen: !isOpen })); + }; + + render() { + return ( +
+ + {this.props.info.name} + + + {this.state.isOpen ? ( +
{this.props.children}
+ ) : null} +
+ ); + } +} diff --git a/docs/components/DocumentationSidebarLink.js b/docs/components/DocumentationSidebarLink.js index e2d0f94d30a45c..cbd8389dfb5293 100644 --- a/docs/components/DocumentationSidebarLink.js +++ b/docs/components/DocumentationSidebarLink.js @@ -49,6 +49,14 @@ export default class DocumentationSidebarLink extends React.Component { return false; } + // Special case for root url + if (this.props.info.name === 'Getting to know Expo') { + const asPath = this.props.asPath; + if (this.props.asPath.match(/\/versions\/[\w\.]+\/$/)) { + return true; + } + } + const linkUrl = this.props.info.as || this.props.info.href; if (linkUrl === this.props.url.pathname || linkUrl === this.props.asPath) { return true; diff --git a/docs/components/DocumentationSidebarTitle.js b/docs/components/DocumentationSidebarTitle.js index dd3571caf5e546..d70b3cc2087687 100644 --- a/docs/components/DocumentationSidebarTitle.js +++ b/docs/components/DocumentationSidebarTitle.js @@ -6,10 +6,11 @@ import * as Constants from '~/common/constants'; const STYLES_TITLE = css` display: block; - margin-bottom: 16px; + position: relative; + margin-bottom: 14px; line-height: 1.3rem; text-decoration: none; - text-transform: uppercase; + border-bottom-color: #ccc; font-family: ${Constants.fontFamilies.demi}; `; @@ -38,7 +39,26 @@ const STYLES_DEFAULT = css` } `; -export default class DocumentationSidebarLink extends React.Component { +class Arrow extends React.Component { + render() { + return ( + + ); + } +} + +export default class DocumentationSidebarTitle extends React.Component { + constructor(props) { + super(props); + + this.state = { + isOpen: this.isSelected(), // || this.isChildRouteActive(), + }; + } + isSelected() { if (!this.props.url) { return false; @@ -53,19 +73,47 @@ export default class DocumentationSidebarLink extends React.Component { return false; } + isChildRouteActive() { + let result = false; + let posts = this.props.posts; + + this.props.info.posts.forEach(post => { + const linkUrl = post.as || post.href; + const pathname = this.props.url.pathname; + const asPath = this.props.asPath; + + if (linkUrl === pathname || linkUrl === asPath) { + result = true; + } + }); + + return result; + } + + _toggleIsOpen = () => { + this.setState(({ isOpen }) => ({ isOpen: !isOpen })); + }; + + // + // TODO: move rendering of child links here so we can make sections collapsable + // render() { if (!this.props.info.href) { - return
{this.props.children}
; + return ( +
+ {this.props.children} +
+ ); } return ( - - - {this.props.children} - - +
+ +
+ {this.props.children} +
+
+
); } } diff --git a/docs/diagram-sources/how-expo-works.sketch b/docs/diagram-sources/how-expo-works.sketch index 11c1f53b3f8074..5a632e53bf1909 100644 Binary files a/docs/diagram-sources/how-expo-works.sketch and b/docs/diagram-sources/how-expo-works.sketch differ diff --git a/docs/diagram-sources/project-lifecycle-workflows.sketch b/docs/diagram-sources/project-lifecycle-workflows.sketch new file mode 100644 index 00000000000000..9f7f704dd7aa28 Binary files /dev/null and b/docs/diagram-sources/project-lifecycle-workflows.sketch differ diff --git a/docs/global-styles/extras.js b/docs/global-styles/extras.js new file mode 100644 index 00000000000000..6aaa33465e8b05 --- /dev/null +++ b/docs/global-styles/extras.js @@ -0,0 +1,7 @@ +import * as Constants from '~/common/constants'; + +export const globalExtras = ` + img.wide-image { + max-width: 900px; + } +`; diff --git a/docs/pages/_document.js b/docs/pages/_document.js index 9496c203115e31..bfd0f7533eddc9 100644 --- a/docs/pages/_document.js +++ b/docs/pages/_document.js @@ -12,6 +12,7 @@ import { globalTables } from '~/global-styles/tables'; import { globalFonts } from '~/global-styles/fonts'; import { globalPrism } from '~/global-styles/prism'; import { globalTippy } from '~/global-styles/tippy'; +import { globalExtras } from '~/global-styles/extras'; import { LATEST_VERSION } from '~/common/versions'; @@ -50,7 +51,14 @@ export default class MyDocument extends Document {