UNPKG

collaborative-ui

Version:

React component library for building real-time collaborative editing applications.

62 lines (61 loc) 3.41 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.ViewSelect = void 0; const tslib_1 = require("tslib"); const React = tslib_1.__importStar(require("react")); const Iconista_1 = require("nice-ui/lib/icons/Iconista"); const ContextMenu_1 = require("nice-ui/lib/4-card/ContextMenu"); const Split_1 = require("nice-ui/lib/3-list-item/Split"); const Sidetip_1 = require("nice-ui/lib/1-inline/Sidetip"); const Popup_1 = require("nice-ui/lib/4-card/Popup"); const BasicButton_1 = require("nice-ui/lib/2-inline-block/BasicButton"); const useBehaviorSubject_1 = require("nice-ui/lib/hooks/useBehaviorSubject"); const BasicTooltip_1 = require("nice-ui/lib/4-card/BasicTooltip"); const use_t_1 = require("use-t"); const ViewSelect = ({ state }) => { const [t] = (0, use_t_1.useT)(); const view = (0, useBehaviorSubject_1.useBehaviorSubject)(state.view$); let text = t('Explore'); switch (view) { case 'text': text = t('Textual'); break; case 'index': text = t('Index'); break; case 'binary': text = t('Binary'); break; case 'verbose': text = t('Verbose'); break; case 'compact': text = t('Compact'); break; case 'indexed': text = t('Indexed'); break; case 'sidecar': text = t('Sidecar'); break; } return (React.createElement(Popup_1.Popup, { renderContext: () => (React.createElement(ContextMenu_1.ContextPane, { minWidth: 240 }, React.createElement(ContextMenu_1.ContextSep, null), React.createElement(ContextMenu_1.ContextItem, { closePopup: true, inset: true, onClick: () => state.setView('text'), grey: view === 'text', icon: React.createElement(Iconista_1.Iconista, { set: "elastic", icon: "vis_text", width: 16, height: 16 }) }, t('Textual')), React.createElement(ContextMenu_1.ContextSep, null), React.createElement(ContextMenu_1.ContextSep, { line: true }), React.createElement(ContextMenu_1.ContextSep, null), React.createElement(ContextMenu_1.ContextItem, { closePopup: true, inset: true, onClick: () => state.setView('binary'), grey: view === 'binary' }, t('Binary')), React.createElement(ContextMenu_1.ContextItem, { closePopup: true, inset: true, onClick: () => state.setView('verbose'), grey: view === 'verbose' }, React.createElement(Split_1.Split, null, React.createElement("span", null, t('Verbose')), React.createElement(Sidetip_1.Sidetip, { small: true }, 'JSON'))), React.createElement(ContextMenu_1.ContextItem, { closePopup: true, inset: true, onClick: () => state.setView('compact'), grey: view === 'compact' }, React.createElement(Split_1.Split, null, React.createElement("span", null, t('Compact')), React.createElement(Sidetip_1.Sidetip, { small: true }, 'JSON'))), React.createElement(ContextMenu_1.ContextSep, null))) }, React.createElement(BasicTooltip_1.BasicTooltip, { nowrap: true, renderTooltip: () => t('Model view') }, React.createElement(BasicButton_1.BasicButton, { width: 'auto', compact: true, border: true }, text)))); }; exports.ViewSelect = ViewSelect;