@theoplayer/react-native-ui/lib/module/ui/components/menu/SettingsMenuButton.js

A React Native UI for @theoplayer/react-native

import React, { useContext } from 'react';
import { MenuButton } from './common/MenuButton';
import { SettingsSvg } from '../button/svg/SettingsSvg';
import { MenuView } from './common/MenuView';
import { ScrollableMenu } from './common/ScrollableMenu';
import { PlayerContext } from '../util/PlayerContext';
import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
/**
 * A button component that opens a settings menu containing all children for the `react-native-theoplayer` UI.
 */
export const SettingsMenuButton = props => {
  const {
    children,
    menuStyle,
    icon
  } = props;
  const context = useContext(PlayerContext);

  // Do not render an empty menu
  if (React.Children.toArray(children).length === 0) {
    return /*#__PURE__*/_jsx(_Fragment, {});
  }
  const createMenu = () => {
    return /*#__PURE__*/_jsx(MenuView, {
      style: menuStyle,
      menu: /*#__PURE__*/_jsx(ScrollableMenu, {
        title: context.locale.settingsTitle,
        items: children
      })
    });
  };
  return /*#__PURE__*/_jsx(MenuButton, {
    svg: icon ?? /*#__PURE__*/_jsx(SettingsSvg, {}),
    menuConstructor: createMenu
  });
};
//# sourceMappingURL=SettingsMenuButton.js.map