UNPKG

synapse-react-client

Version:

[![Build Status](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client.svg?branch=main)](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client) [![npm version](https://badge.fury.io/js/synapse-react-client.svg)](https://badge.fury.io/js/synaps

52 lines 3.09 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var tslib_1 = require("tslib"); var icons_1 = require("@material-ui/icons"); var react_1 = (0, tslib_1.__importDefault)(require("react")); var utils_1 = require("../../../utils"); var unCamelCase_1 = require("../../../utils/functions/unCamelCase"); var ElementWithTooltip_1 = require("../ElementWithTooltip"); var SelectionCriteriaPill = function (props) { var innerText, tooltipText = ''; if ('facetWithSelection' in props) { var facetWithSelection = props.facetWithSelection; if (facetWithSelection.facet.facetType === 'enumeration') { innerText = facetWithSelection.displayValue === utils_1.SynapseConstants.VALUE_NOT_SET ? utils_1.SynapseConstants.FRIENDLY_VALUE_NOT_SET : facetWithSelection.displayValue; } else { innerText = facetWithSelection.facet .selectedMin + " \n - " + facetWithSelection.facet.selectedMax; } tooltipText = (0, unCamelCase_1.unCamelCase)(facetWithSelection.facet.columnName) + ": " + innerText; } else if ('filter' in props) { var filter = props.filter; var filterValue = filter.value; if ((filterValue === null || filterValue === void 0 ? void 0 : filterValue.startsWith('%')) && (filterValue === null || filterValue === void 0 ? void 0 : filterValue.endsWith('%'))) { // strip '%' wildcard character when using a LIKE condition filterValue = filterValue.substring(1, filterValue.length - 1); } // For full-text search, set the pill text and tooltip text innerText = filterValue; tooltipText = "Text matches: \"" + filterValue + "\""; // If searching in a specific column, use different inner/tooltip text if (filter.columnName) { innerText = "\"" + filterValue + "\" in " + (0, unCamelCase_1.unCamelCase)(filter === null || filter === void 0 ? void 0 : filter.columnName); tooltipText = (0, unCamelCase_1.unCamelCase)(filter === null || filter === void 0 ? void 0 : filter.columnName) + ": " + filterValue; } } else { console.warn('Expected either facetWithSelection or filter in SelectionCriteriaPill but got neither'); } var key = btoa(tooltipText); return (react_1.default.createElement(ElementWithTooltip_1.ElementWithTooltip, { idForToolTip: "selectionCriteria_" + key, tooltipText: tooltipText, callbackFn: function () { } }, react_1.default.createElement("label", { className: "SelectionCriteriaPill", key: "SelectionCriteriaPill " + key }, react_1.default.createElement("span", null, innerText), react_1.default.createElement("button", { onClick: function () { return props.onRemove(); }, className: "SelectionCriteriaPill__btnRemove", title: "deselect" }, react_1.default.createElement(icons_1.Close, null))))); }; exports.default = SelectionCriteriaPill; //# sourceMappingURL=SelectionCriteriaPill.js.map