@wordpress/components
Version:
UI components for WordPress.
93 lines (89 loc) • 2.79 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _reactNative = require("react-native");
var _i18n = require("@wordpress/i18n");
var _element = require("@wordpress/element");
var _data = require("@wordpress/data");
var _compose = require("@wordpress/compose");
var _styles = _interopRequireDefault(require("./styles.scss"));
var _bottomSheetContext = require("../bottom-sheet/bottom-sheet-context");
var _jsxRuntime = require("react/jsx-runtime");
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
class Picker extends _element.Component {
presentPicker() {
const {
options,
onChange,
title,
destructiveButtonIndex,
disabledButtonIndices,
getAnchor,
isBottomSheetOpened,
closeBottomSheet,
onHandleClosingBottomSheet,
colorScheme
} = this.props;
const labels = options.map(({
label
}) => label);
const fullOptions = [(0, _i18n.__)('Cancel')].concat(labels);
const buttonTitleColor = colorScheme === 'light' ? _styles.default['components-picker__button-title'].color : _styles.default['components-picker__button-title--dark'].color;
_reactNative.ActionSheetIOS.showActionSheetWithOptions({
title,
options: fullOptions,
cancelButtonIndex: 0,
destructiveButtonIndex,
disabledButtonIndices,
anchor: getAnchor && getAnchor(),
tintColor: buttonTitleColor
}, buttonIndex => {
if (buttonIndex === 0) {
return;
}
const selected = options[buttonIndex - 1];
if (selected.requiresModal && isBottomSheetOpened) {
onHandleClosingBottomSheet(() => {
onChange(selected.value);
});
closeBottomSheet();
} else {
onChange(selected.value);
}
});
}
render() {
return null;
}
}
const PickerComponent = (0, _element.forwardRef)((props, ref) => {
const isBottomSheetOpened = (0, _data.useSelect)(select => select('core/edit-post').isEditorSidebarOpened());
const {
closeGeneralSidebar
} = (0, _data.useDispatch)('core/edit-post');
const {
onHandleClosingBottomSheet
} = (0, _element.useContext)(_bottomSheetContext.BottomSheetContext);
const colorScheme = (0, _compose.usePreferredColorScheme)();
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Picker, {
ref: ref,
...props,
isBottomSheetOpened: isBottomSheetOpened,
closeBottomSheet: closeGeneralSidebar,
onHandleClosingBottomSheet: onHandleClosingBottomSheet,
colorScheme: colorScheme
});
});
var _default = exports.default = PickerComponent;
//# sourceMappingURL=index.ios.js.map