@wordpress/components
Version:
UI components for WordPress.
105 lines (101 loc) • 3.06 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 _compose = require("@wordpress/compose");
var _bottomSheet = _interopRequireDefault(require("../bottom-sheet"));
var _styles = _interopRequireDefault(require("./styles.scss"));
var _body = _interopRequireDefault(require("../../panel/body"));
var _textControl = _interopRequireDefault(require("../../text-control"));
var _jsxRuntime = require("react/jsx-runtime");
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function Separator() {
const separatorStyle = (0, _compose.usePreferredColorSchemeStyle)(_styles.default['components-picker__separator'], _styles.default['components-picker__separator--dark']);
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
style: separatorStyle
});
}
class Picker extends _element.Component {
constructor() {
super(...arguments);
this.onClose = this.onClose.bind(this);
this.onCellPress = this.onCellPress.bind(this);
this.state = {
isVisible: false
};
}
presentPicker() {
this.setState({
isVisible: true
});
}
onClose() {
this.setState({
isVisible: false
});
}
onCellPress(value) {
const {
onChange
} = this.props;
onChange(value);
this.onClose();
}
getOptions() {
const {
options,
leftAlign
} = this.props;
return options.map(option => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_element.Fragment, {
children: [options.length > 1 && option.separated && /*#__PURE__*/(0, _jsxRuntime.jsx)(Separator, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_bottomSheet.default.Cell, {
icon: option.icon,
leftAlign: leftAlign,
label: option.label,
separatorType: "none",
onPress: () => this.onCellPress(option.value),
disabled: option.disabled,
style: option.disabled && _styles.default['components-picker__button--disabled']
})]
}, `${option.label}-${option.value}`));
}
render() {
const {
hideCancelButton,
title,
testID
} = this.props;
const {
isVisible
} = this.state;
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_bottomSheet.default, {
isVisible: isVisible,
onClose: this.onClose,
hideHeader: true,
testID: testID,
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_body.default, {
title: title,
style: _styles.default['components-picker__panel'],
children: [this.getOptions(), !hideCancelButton && /*#__PURE__*/(0, _jsxRuntime.jsx)(_textControl.default, {
label: (0, _i18n.__)('Cancel'),
onPress: this.onClose,
separatorType: "none"
})]
})
});
}
}
exports.default = Picker;
//# sourceMappingURL=index.android.js.map