UNPKG

@wordpress/editor

Version:
173 lines (169 loc) 7.01 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _reactNative = require("react-native"); var _stack = require("@react-navigation/stack"); var _components = require("@wordpress/components"); var _i18n = require("@wordpress/i18n"); var _icons = require("@wordpress/icons"); var _data = require("@wordpress/data"); var _editor = require("@wordpress/editor"); var _reactNativeBridge = require("@wordpress/react-native-bridge"); var _style = _interopRequireDefault(require("./style.scss")); var _helpDetailNavigationScreen = _interopRequireDefault(require("./help-detail-navigation-screen")); var _helpTopicRow = _interopRequireDefault(require("./help-topic-row")); var _helpGetSupportButton = _interopRequireDefault(require("./help-get-support-button")); var _introToBlocks = _interopRequireDefault(require("./intro-to-blocks")); var _addBlocks = _interopRequireDefault(require("./add-blocks")); var _moveBlocks = _interopRequireDefault(require("./move-blocks")); var _removeBlocks = _interopRequireDefault(require("./remove-blocks")); var _customizeBlocks = _interopRequireDefault(require("./customize-blocks")); var _iconMoveBlocks = _interopRequireDefault(require("./icon-move-blocks")); var _helpSectionTitle = _interopRequireDefault(require("./help-section-title")); var _jsxRuntime = require("react/jsx-runtime"); /** * External dependencies */ /** * WordPress dependencies */ /** * Internal dependencies */ const HELP_TOPICS = [{ label: (0, _i18n.__)('What is a block?'), slug: 'what-is-a-block', icon: _icons.helpFilled, view: /*#__PURE__*/(0, _jsxRuntime.jsx)(_introToBlocks.default, {}) }, { label: (0, _i18n.__)('Add blocks'), slug: 'add-blocks', icon: _icons.plusCircleFilled, view: /*#__PURE__*/(0, _jsxRuntime.jsx)(_addBlocks.default, {}) }, { label: (0, _i18n.__)('Move blocks'), slug: 'move-blocks', icon: _iconMoveBlocks.default, view: /*#__PURE__*/(0, _jsxRuntime.jsx)(_moveBlocks.default, {}) }, { label: (0, _i18n.__)('Remove blocks'), slug: 'remove-blocks', icon: _icons.trash, view: /*#__PURE__*/(0, _jsxRuntime.jsx)(_removeBlocks.default, {}) }, { label: (0, _i18n.__)('Customize blocks'), slug: 'customize-blocks', icon: _icons.cog, view: /*#__PURE__*/(0, _jsxRuntime.jsx)(_customizeBlocks.default, {}) }]; function EditorHelpTopics({ close, isVisible, onClose, showSupport }) { const { postType } = (0, _data.useSelect)(select => ({ postType: select(_editor.store).getEditedPostAttribute('type') })); const title = postType === 'page' ? (0, _i18n.__)('How to edit your page') : (0, _i18n.__)('How to edit your post'); const supportSection = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, { children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_helpSectionTitle.default, { children: (0, _i18n.__)('Get support') }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_helpGetSupportButton.default, { title: (0, _i18n.__)('Contact support'), onPress: _reactNativeBridge.requestContactCustomerSupport }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_helpGetSupportButton.default, { title: (0, _i18n.__)('More support options'), onPress: _reactNativeBridge.requestGotoCustomerSupportOptions })] }); return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.BottomSheet, { isVisible: isVisible, onClose: onClose, hideHeader: true, hasNavigation: true, contentStyle: _style.default.contentContainer, testID: "editor-help-modal", children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.SafeAreaView, { style: _style.default.safeAreaContainer, children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.BottomSheet.NavigationContainer, { animate: true, main: true, style: _style.default.navigationContainer, children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.BottomSheet.NavigationScreen, { isScrollable: true, fullScreen: true, name: "help-topics", children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, { style: _style.default.container, children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.BottomSheet.NavBar, { children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.BottomSheet.NavBar.DismissButton, { onPress: close, iosText: (0, _i18n.__)('Close') }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.BottomSheet.NavBar.Heading, { children: title })] }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.BottomSheetConsumer, { children: ({ listProps }) => { const contentContainerStyle = _reactNative.StyleSheet.flatten(listProps.contentContainerStyle); return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ScrollView, { ...listProps, contentContainerStyle: { ...contentContainerStyle, paddingBottom: Math.max(listProps.safeAreaBottomInset, contentContainerStyle.paddingBottom), /** * Remove margin set via `hideHeader`. Combining a header * and navigation in this bottom sheet is at odds with the * current `BottomSheet` implementation. */ marginTop: 0 }, children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.PanelBody, { children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_helpSectionTitle.default, { children: (0, _i18n.__)('The basics') }), HELP_TOPICS.map(({ label, icon, slug }, index) => { const isLastItem = index === HELP_TOPICS.length - 1; return /*#__PURE__*/(0, _jsxRuntime.jsx)(_helpTopicRow.default, { label: label, icon: icon, screenName: slug, isLastItem: isLastItem }, slug); }), showSupport && supportSection] }) }); } })] }) }), HELP_TOPICS.map(({ view, label, slug }) => { return /*#__PURE__*/(0, _jsxRuntime.jsx)(_helpDetailNavigationScreen.default, { name: slug, content: view, label: label, options: { gestureEnabled: false, ..._stack.TransitionPresets.DefaultTransition } }, slug); })] }) }) }); } var _default = exports.default = EditorHelpTopics; //# sourceMappingURL=index.native.js.map