@corva/ui 3.1.0-rc.5 → 3.1.0

package/components/ParameterCharts/components/TrackSettings.js

@@ -1,234 +1 @@
-import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useState } from 'react';
-import PropTypes from 'prop-types';
-import uuid from 'uuid';
-import { withStyles, Grid, FormControl, TextField, IconButton, Button } from '@material-ui/core';
-import NavigateNextIcon from '@material-ui/icons/NavigateNext';
-import AddIcon from '@material-ui/icons/Add';
-import { MAX_TRACE_COUNT, DEFAULT_TRACE_SETTINGS } from '../constants.js';
-import TraceSettings from './TraceSettings.js';
-import TraceSelect from './TraceSelect.js';
-import styles from './TrackSettings.css.js';
-import ColorPicker from '../../ColorPicker/ColorPicker.js';
-import Modal from '../../Modal/Modal.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var TrackSettings = function TrackSettings(_ref) {
-  var _ref$settings = _ref.settings,
-    name = _ref$settings.name,
-    traces = _ref$settings.traces,
-    _onChange = _ref.onChange,
-    classes = _ref.classes,
-    mapping = _ref.mapping;
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    isTraceSettingsVisible = _useState2[0],
-    setIsTraceSettingsVisible = _useState2[1];
-  var _useState3 = useState(),
-    _useState4 = _slicedToArray(_useState3, 2),
-    selectedTrace = _useState4[0],
-    setSelectedTrace = _useState4[1];
-  var onTraceTypeChange = function onTraceTypeChange(id, value) {
-    var updatedTraces = traces.map(function (trace) {
-      var currentMapping = mapping.find(function (_ref2) {
-        var key = _ref2.key;
-        return value === key;
-      });
-      if (trace.id === id) {
-        return _objectSpread(_objectSpread({}, trace), currentMapping);
-      } else {
-        return trace;
-      }
-    });
-    _onChange('traces', updatedTraces);
-  };
-  var onTraceChange = function onTraceChange(id, key, value) {
-    var updatedTraces = traces.map(function (trace) {
-      if (trace.id === id) {
-        return _objectSpread(_objectSpread({}, trace), {}, _defineProperty({}, key, value));
-      } else {
-        return trace;
-      }
-    });
-    _onChange('traces', updatedTraces);
-  };
-  var addTrace = function addTrace() {
-    if (!traces || !traces.length) {
-      _onChange('traces', [_objectSpread({
-        id: uuid()
-      }, DEFAULT_TRACE_SETTINGS)]);
-    } else {
-      _onChange('traces', [].concat(_toConsumableArray(traces), [_objectSpread({
-        id: uuid()
-      }, DEFAULT_TRACE_SETTINGS)]));
-    }
-  };
-  var isMaxNumOftraces = traces && traces.length > MAX_TRACE_COUNT;
-  var showTraceSettings = function showTraceSettings(index) {
-    setSelectedTrace(traces[index]);
-    setIsTraceSettingsVisible(true);
-  };
-  var onTraceSettingsChange = function onTraceSettingsChange(key, value) {
-    setSelectedTrace(_objectSpread(_objectSpread({}, selectedTrace), {}, _defineProperty({}, key, value)));
-  };
-  var deleteTrace = function deleteTrace() {
-    var updatedTraces = traces.filter(function (_ref3) {
-      var id = _ref3.id;
-      return id !== selectedTrace.id;
-    });
-    _onChange('traces', updatedTraces);
-    setIsTraceSettingsVisible(false);
-  };
-  var saveTrace = function saveTrace() {
-    var updatedTraces = traces.map(function (trace) {
-      return trace.id === selectedTrace.id ? selectedTrace : trace;
-    });
-    _onChange('traces', updatedTraces);
-    setIsTraceSettingsVisible(false);
-  };
-  return /*#__PURE__*/jsxs(Grid, {
-    className: classes.container,
-    children: [/*#__PURE__*/jsx(FormControl, {
-      className: classes.input,
-      children: /*#__PURE__*/jsx(TextField, {
-        label: "Track Name",
-        value: name,
-        className: classes.input,
-        onChange: function onChange(_ref4) {
-          var value = _ref4.target.value;
-          return _onChange('name', value);
-        }
-      })
-    }), /*#__PURE__*/jsx("div", {
-      className: styles.title,
-      children: "Traces: "
-    }), traces && !!traces.length && /*#__PURE__*/jsx("div", {
-      className: styles.tracesContainer,
-      children: traces.map(function (_ref5, index) {
-        var id = _ref5.id,
-          key = _ref5.key,
-          color = _ref5.color;
-        return /*#__PURE__*/jsxs("div", {
-          className: styles.tracesItem,
-          children: [/*#__PURE__*/jsx(TraceSelect, {
-            value: key,
-            onChange: function onChange(val) {
-              return onTraceTypeChange(id, val);
-            },
-            mapping: mapping
-          }), /*#__PURE__*/jsx("div", {
-            className: styles.colorPicker,
-            children: /*#__PURE__*/jsx(ColorPicker, {
-              value: color,
-              onChange: function onChange(val) {
-                return onTraceChange(id, 'color', val);
-              },
-              hideLabel: true,
-              buttonClassName: classes.picker
-            })
-          }), /*#__PURE__*/jsx(IconButton, {
-            onClick: function onClick() {
-              return showTraceSettings(index);
-            },
-            className: classes.navBtn,
-            children: /*#__PURE__*/jsx(NavigateNextIcon, {
-              fontSize: "small",
-              className: classes.navIcon
-            })
-          })]
-        }, id);
-      })
-    }), !isMaxNumOftraces && /*#__PURE__*/jsxs(Button, {
-      color: "primary",
-      onClick: addTrace,
-      children: [/*#__PURE__*/jsx(AddIcon, {}), /*#__PURE__*/jsx("span", {
-        children: "Add Trace"
-      })]
-    }), /*#__PURE__*/jsx(Modal, {
-      open: isTraceSettingsVisible,
-      title: /*#__PURE__*/jsxs("div", {
-        className: styles.modalTitle,
-        children: [/*#__PURE__*/jsxs("span", {
-          className: styles.trackTitle,
-          onClick: saveTrace,
-          children: ["Track Settings /", ' ']
-        }), selectedTrace && selectedTrace.name || 'Empty Trace']
-      }),
-      actions: /*#__PURE__*/jsxs("div", {
-        className: styles.actions,
-        children: [/*#__PURE__*/jsx(Button, {
-          className: classes.button,
-          color: "primary",
-          onClick: deleteTrace,
-          children: "Delete Trace"
-        }), /*#__PURE__*/jsx(Button, {
-          className: classes.button,
-          color: "primary",
-          onClick: function onClick() {
-            return setIsTraceSettingsVisible(false);
-          },
-          children: "Cancel"
-        }), /*#__PURE__*/jsx(Button, {
-          className: classes.button,
-          variant: "contained",
-          color: "primary",
-          onClick: saveTrace,
-          children: "Save"
-        })]
-      }),
-      children: /*#__PURE__*/jsx(TraceSettings, {
-        traceSettings: selectedTrace,
-        onChange: onTraceSettingsChange,
-        mapping: mapping
-      })
-    })]
-  });
-};
-TrackSettings.propTypes = {
-  settings: PropTypes.shape({
-    name: PropTypes.string.isRequired,
-    traces: PropTypes.arrayOf(PropTypes.shape({}))
-  }).isRequired,
-  onChange: PropTypes.func.isRequired,
-  classes: PropTypes.shape({}).isRequired,
-  mapping: PropTypes.arrayOf(PropTypes.shape({
-    name: PropTypes.string.isRequired,
-    key: PropTypes.string.isRequired
-  }).isRequired).isRequired
-};
-var TrackSettings$1 = withStyles(function (_theme) {
-  return {
-    container: {
-      paddingTop: 20,
-      minWidth: 300
-    },
-    input: {
-      width: 200
-    },
-    picker: {
-      width: 36,
-      minWidth: 36,
-      height: 24
-    },
-    navBtn: {
-      position: 'absolute',
-      right: -10,
-      top: '50%',
-      transform: 'translate(0, -50%)'
-    },
-    navIcon: {
-      color: '#BDBDBD'
-    },
-    button: {
-      fontSize: 14,
-      marginLeft: 20
-    }
-  };
-})(TrackSettings);
-
-export { TrackSettings$1 as default };
-//# sourceMappingURL=TrackSettings.js.map
+import e from"@babel/runtime/helpers/toConsumableArray";import r from"@babel/runtime/helpers/defineProperty";import t from"@babel/runtime/helpers/slicedToArray";import{useState as n}from"react";import i from"prop-types";import a from"uuid";import{withStyles as o,Grid as c,FormControl as s,TextField as l,IconButton as m,Button as u}from"@material-ui/core";import p from"@material-ui/icons/NavigateNext";import d from"@material-ui/icons/Add";import{MAX_TRACE_COUNT as f,DEFAULT_TRACE_SETTINGS as h}from"../constants.js";import g from"./TraceSettings.js";import v from"./TraceSelect.js";import b from"./TrackSettings.css.js";import y from"../../ColorPicker/ColorPicker.js";import k from"../../Modal/Modal.js";import{jsxs as N,jsx as O}from"react/jsx-runtime";function j(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function C(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?j(Object(n),!0).forEach((function(t){r(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):j(Object(n)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))}))}return e}var T=function(i){var o=i.settings,j=o.name,T=o.traces,P=i.onChange,S=i.classes,q=i.mapping,w=n(!1),D=t(w,2),R=D[0],B=D[1],A=n(),x=t(A,2),E=x[0],I=x[1],z=T&&T.length>f,L=function(){var e=T.map((function(e){return e.id===E.id?E:e}));P("traces",e),B(!1)};return N(c,{className:S.container,children:[O(s,{className:S.input,children:O(l,{label:"Track Name",value:j,className:S.input,onChange:function(e){var r=e.target.value;return P("name",r)}})}),O("div",{className:b.title,children:"Traces: "}),T&&!!T.length&&O("div",{className:b.tracesContainer,children:T.map((function(e,t){var n=e.id,i=e.key,a=e.color;return N("div",{className:b.tracesItem,children:[O(v,{value:i,onChange:function(e){return function(e,r){var t=T.map((function(t){var n=q.find((function(e){var t=e.key;return r===t}));return t.id===e?C(C({},t),n):t}));P("traces",t)}(n,e)},mapping:q}),O("div",{className:b.colorPicker,children:O(y,{value:a,onChange:function(e){return function(e,t,n){var i=T.map((function(i){return i.id===e?C(C({},i),{},r({},t,n)):i}));P("traces",i)}(n,"color",e)},hideLabel:!0,buttonClassName:S.picker})}),O(m,{onClick:function(){return function(e){I(T[e]),B(!0)}(t)},className:S.navBtn,children:O(p,{fontSize:"small",className:S.navIcon})})]},n)}))}),!z&&N(u,{color:"primary",onClick:function(){T&&T.length?P("traces",[].concat(e(T),[C({id:a()},h)])):P("traces",[C({id:a()},h)])},children:[O(d,{}),O("span",{children:"Add Trace"})]}),O(k,{open:R,title:N("div",{className:b.modalTitle,children:[N("span",{className:b.trackTitle,onClick:L,children:["Track Settings /"," "]}),E&&E.name||"Empty Trace"]}),actions:N("div",{className:b.actions,children:[O(u,{className:S.button,color:"primary",onClick:function(){var e=T.filter((function(e){return e.id!==E.id}));P("traces",e),B(!1)},children:"Delete Trace"}),O(u,{className:S.button,color:"primary",onClick:function(){return B(!1)},children:"Cancel"}),O(u,{className:S.button,variant:"contained",color:"primary",onClick:L,children:"Save"})]}),children:O(g,{traceSettings:E,onChange:function(e,t){I(C(C({},E),{},r({},e,t)))},mapping:q})})]})};T.propTypes={settings:i.shape({name:i.string.isRequired,traces:i.arrayOf(i.shape({}))}).isRequired,onChange:i.func.isRequired,classes:i.shape({}).isRequired,mapping:i.arrayOf(i.shape({name:i.string.isRequired,key:i.string.isRequired}).isRequired).isRequired};var P=o((function(e){return{container:{paddingTop:20,minWidth:300},input:{width:200},picker:{width:36,minWidth:36,height:24},navBtn:{position:"absolute",right:-10,top:"50%",transform:"translate(0, -50%)"},navIcon:{color:"#BDBDBD"},button:{fontSize:14,marginLeft:20}}}))(T);export{P as default};

package/components/ParameterCharts/constants.js

@@ -1,16 +1 @@
-var SETTINGS_KEY = 'parameterChart';
-var DEFAULT_TRACK_SETTINGS = {
-  name: 'New Track',
-  traces: []
-};
-var DEFAULT_TRACE_SETTINGS = {
-  traceType: 'line',
-  dashStyle: 'Solid',
-  lineColor: '#ccc',
-  lineWidth: 1,
-  autoScale: true
-};
-var MAX_TRACE_COUNT = 10;
-
-export { DEFAULT_TRACE_SETTINGS, DEFAULT_TRACK_SETTINGS, MAX_TRACE_COUNT, SETTINGS_KEY };
-//# sourceMappingURL=constants.js.map
+var e="parameterChart",a={name:"New Track",traces:[]},r={traceType:"line",dashStyle:"Solid",lineColor:"#ccc",lineWidth:1,autoScale:!0},t=10;export{r as DEFAULT_TRACE_SETTINGS,a as DEFAULT_TRACK_SETTINGS,t as MAX_TRACE_COUNT,e as SETTINGS_KEY};

package/components/ParameterCharts/utils/dataParser.js

@@ -1,39 +1 @@
-import { get } from 'lodash';
-import { convertValue } from '../../../utils/convert.js';
-
-var convertData = function convertData(_ref) {
-  var mapping = _ref.mapping,
-    data = _ref.data,
-    indexesKeys = _ref.indexesKeys;
-  return mapping.reduce(function (acc, _ref2) {
-    var key = _ref2.key,
-      unit = _ref2.unit,
-      unitType = _ref2.unitType,
-      collection = _ref2.collection;
-    var dataKey = "".concat(collection, ".").concat(key);
-    var index = indexesKeys[collection];
-    var min = Infinity;
-    var max = -Infinity;
-    acc[dataKey] = {};
-    if (data[collection]) {
-      acc[dataKey].data = data[collection].map(function (item) {
-        var val = convertValue(get(item, key), unitType, unit);
-        if (Number.isFinite(val)) {
-          if (val > max) {
-            max = val;
-          }
-          if (val < min) {
-            min = val;
-          }
-        }
-        return [convertValue(get(item, index.key), index.unitType, index.unit), val];
-      });
-      acc[dataKey].min = min;
-      acc[dataKey].max = max;
-    }
-    return acc;
-  }, {});
-};
-
-export { convertData };
-//# sourceMappingURL=dataParser.js.map
+import{get as n}from"lodash";import{convertValue as t}from"../../../utils/convert.js";var r=function(r){var e=r.mapping,i=r.data,a=r.indexesKeys;return e.reduce((function(r,e){var o=e.key,u=e.unit,c=e.unitType,m=e.collection,p="".concat(m,".").concat(o),s=a[m],d=1/0,f=-1/0;return r[p]={},i[m]&&(r[p].data=i[m].map((function(r){var e=t(n(r,o),c,u);return Number.isFinite(e)&&(e>f&&(f=e),e<d&&(d=e)),[t(n(r,s.key),s.unitType,s.unit),e]})),r[p].min=d,r[p].max=f),r}),{})};export{r as convertData};

package/components/PinnableFilters/PinnableFilters.css.js

@@ -1,8 +1 @@
-import styleInject from './../../ext-esm/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".PinnableFilters_containerLarge__HlHk- {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n}\n\n.PinnableFilters_containerLargeTopright__5O3XY {\n  display: flex;\n  align-items: center;\n}\n\n.PinnableFilters_containerMedium__UJyYm {\n  display: flex;\n  flex-direction: column;\n}\n\n.PinnableFilters_containerMediumTop__8AYOD {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n}\n\n.PinnableFilters_containerMediumTopright__uWjrK {\n  display: flex;\n  align-items: center;\n}\n\n.PinnableFilters_containerMediumBottom__omJHC {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n}\n\n.PinnableFilters_containerMediumBottom__omJHC > div {\n  margin-bottom: 8px;\n}\n\n.PinnableFilters_containerSmall__vHCZw {\n  display: flex;\n  flex-direction: column;\n}\n\n.PinnableFilters_containerSmallTop__f2ksN {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n}\n\n.PinnableFilters_containerSmallMiddle__cWqNa {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n}\n\n.PinnableFilters_containerSmallBottom__4Yvda {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n}\n\n.PinnableFilters_containerPopper__2d-E7 {\n  display: flex;\n  flex-direction: column;\n  padding: 1rem 1rem 0 1rem;\n}\n\n.PinnableFilters_containerPopper__2d-E7 > div {\n  margin-bottom: 16px;\n}\n\n.PinnableFilters_containerButtonsWrapper__Gy6Ej {\n  display: flex;\n}\n";
-var styles = {"containerLarge":"PinnableFilters_containerLarge__HlHk-","containerLargeTopright":"PinnableFilters_containerLargeTopright__5O3XY","containerMedium":"PinnableFilters_containerMedium__UJyYm","containerMediumTop":"PinnableFilters_containerMediumTop__8AYOD","containerMediumTopright":"PinnableFilters_containerMediumTopright__uWjrK","containerMediumBottom":"PinnableFilters_containerMediumBottom__omJHC","containerSmall":"PinnableFilters_containerSmall__vHCZw","containerSmallTop":"PinnableFilters_containerSmallTop__f2ksN","containerSmallMiddle":"PinnableFilters_containerSmallMiddle__cWqNa","containerSmallBottom":"PinnableFilters_containerSmallBottom__4Yvda","containerPopper":"PinnableFilters_containerPopper__2d-E7","containerButtonsWrapper":"PinnableFilters_containerButtonsWrapper__Gy6Ej"};
-styleInject(css_248z);
-
-export { styles as default };
-//# sourceMappingURL=PinnableFilters.css.js.map
+import e from'./../../ext-esm/style-inject/dist/style-inject.es.js';var n={containerLarge:"PinnableFilters_containerLarge__HlHk-",containerLargeTopright:"PinnableFilters_containerLargeTopright__5O3XY",containerMedium:"PinnableFilters_containerMedium__UJyYm",containerMediumTop:"PinnableFilters_containerMediumTop__8AYOD",containerMediumTopright:"PinnableFilters_containerMediumTopright__uWjrK",containerMediumBottom:"PinnableFilters_containerMediumBottom__omJHC",containerSmall:"PinnableFilters_containerSmall__vHCZw",containerSmallTop:"PinnableFilters_containerSmallTop__f2ksN",containerSmallMiddle:"PinnableFilters_containerSmallMiddle__cWqNa",containerSmallBottom:"PinnableFilters_containerSmallBottom__4Yvda",containerPopper:"PinnableFilters_containerPopper__2d-E7",containerButtonsWrapper:"PinnableFilters_containerButtonsWrapper__Gy6Ej"};e(".PinnableFilters_containerLarge__HlHk-{align-items:center;display:flex;justify-content:space-between}.PinnableFilters_containerLargeTopright__5O3XY{align-items:center;display:flex}.PinnableFilters_containerMedium__UJyYm{display:flex;flex-direction:column}.PinnableFilters_containerMediumTop__8AYOD{align-items:center;display:flex;justify-content:space-between}.PinnableFilters_containerMediumTopright__uWjrK{align-items:center;display:flex}.PinnableFilters_containerMediumBottom__omJHC{align-items:center;display:flex;flex-wrap:wrap}.PinnableFilters_containerMediumBottom__omJHC>div{margin-bottom:8px}.PinnableFilters_containerSmall__vHCZw{display:flex;flex-direction:column}.PinnableFilters_containerSmallTop__f2ksN{align-items:center;display:flex;justify-content:space-between}.PinnableFilters_containerSmallMiddle__cWqNa{align-items:center;display:flex;flex-wrap:wrap}.PinnableFilters_containerSmallBottom__4Yvda{align-items:center;display:flex;justify-content:flex-end}.PinnableFilters_containerPopper__2d-E7{display:flex;flex-direction:column;padding:1rem 1rem 0}.PinnableFilters_containerPopper__2d-E7>div{margin-bottom:16px}.PinnableFilters_containerButtonsWrapper__Gy6Ej{display:flex}");export{n as default};

package/components/PinnableFilters/PinnableFilters.js

@@ -1,234 +1 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useState } from 'react';
-import PropTypes from 'prop-types';
-import { SizeMe } from 'react-sizeme';
-import { Collapse, Popover } from '@material-ui/core';
-import { withStyles } from '@material-ui/core/styles';
-import FiltersToggler from './components/FiltersToggler.js';
-import PinAppSwitch from './components/PinAppSwitch.js';
-import { useComonentsWidth, useAppFilterTogglerWidth, useFilterLayout } from './effects/index.js';
-import { getStartComponent, getMiddleComponent, getEndComponents } from './utils.js';
-import { LARGE_SIZE_LAYOUT, MEDIUM_SIZE_LAYOUT, SMALL_SIZE_LAYOUT } from './constants.js';
-import styles from './PinnableFilters.css.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var _excluded = ["children"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var muiStyles = {
-  paper: {
-    backgroundColor: '#414141'
-  }
-};
-function PinnableFilters(_ref) {
-  var children = _ref.children,
-    classes = _ref.classes,
-    appWidth = _ref.appWidth,
-    isPinnedInitial = _ref.isPinnedInitial,
-    isShownInitial = _ref.isShownInitial,
-    onShowCallback = _ref.onShowCallback,
-    onPinCallback = _ref.onPinCallback;
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    anchorEl = _useState2[0],
-    setAnchorEl = _useState2[1];
-  var _useState3 = useState(isPinnedInitial),
-    _useState4 = _slicedToArray(_useState3, 2),
-    isPinned = _useState4[0],
-    setIsPinned = _useState4[1];
-  var _useState5 = useState(isShownInitial),
-    _useState6 = _slicedToArray(_useState5, 2),
-    isShown = _useState6[0],
-    setIsShown = _useState6[1];
-  var _useState7 = useState(false),
-    _useState8 = _slicedToArray(_useState7, 2),
-    showPin = _useState8[0],
-    setShowPin = _useState8[1];
-  var handleChangePinned = function handleChangePinned(value) {
-    setIsPinned(value);
-    if (onPinCallback) onPinCallback(value);
-  };
-  var handleChangeShown = function handleChangeShown(value) {
-    setIsShown(value);
-    if (onShowCallback) onShowCallback(value);
-  };
-
-  // NOTE: Calcualte width of each components
-  var _useComonentsWidth = useComonentsWidth(children),
-    componentsWidth = _useComonentsWidth.componentsWidth,
-    hiddenElements = _useComonentsWidth.hiddenElements;
-
-  // NOTE: Calculate app filter toggler width
-  var appFilterTogglerWidth = useAppFilterTogglerWidth();
-
-  // NOTE: Determine layout to be shown based on the calculated width
-  var layout = useFilterLayout(children, componentsWidth, appFilterTogglerWidth, appWidth);
-  var filtersComponent = getStartComponent(children);
-  var goalComponent = getMiddleComponent(children);
-  var switchComponent = getEndComponents(children);
-  var handleOpen = function handleOpen(e) {
-    if (isPinned) {
-      handleChangeShown(!isShown);
-    } else {
-      setAnchorEl(e.currentTarget);
-    }
-  };
-  var handleClose = function handleClose() {
-    setAnchorEl(null);
-  };
-  var handlePinClick = function handlePinClick() {
-    var newPinState = !isPinned;
-    if (newPinState) {
-      setAnchorEl(null);
-      handleChangeShown(true);
-    }
-    handleChangePinned(newPinState);
-  };
-  return /*#__PURE__*/jsxs("div", {
-    style: {
-      width: '100%'
-    },
-    children: [/*#__PURE__*/jsx(Collapse, {
-      timeout: 10,
-      in: layout === LARGE_SIZE_LAYOUT,
-      children: /*#__PURE__*/jsxs("div", {
-        className: styles.containerLarge,
-        children: [/*#__PURE__*/jsx("div", {
-          children: filtersComponent
-        }), /*#__PURE__*/jsxs("div", {
-          className: styles.containerLargeTopright,
-          children: [goalComponent, switchComponent]
-        })]
-      })
-    }), /*#__PURE__*/jsx(Collapse, {
-      timeout: 10,
-      in: layout === MEDIUM_SIZE_LAYOUT,
-      children: /*#__PURE__*/jsxs("div", {
-        className: styles.containerMedium,
-        children: [/*#__PURE__*/jsxs("div", {
-          className: styles.containerMediumTop,
-          children: [/*#__PURE__*/jsxs("div", {
-            className: styles.containerButtonsWrapper,
-            onMouseEnter: function onMouseEnter() {
-              return setShowPin(true);
-            },
-            onMouseLeave: function onMouseLeave() {
-              return setShowPin(false);
-            },
-            children: [/*#__PURE__*/jsx(FiltersToggler, {
-              onClick: handleOpen
-            }), (showPin || isPinned || Boolean(anchorEl)) && /*#__PURE__*/jsx(PinAppSwitch, {
-              isPinned: isPinned,
-              onClick: handlePinClick
-            })]
-          }), /*#__PURE__*/jsxs("div", {
-            className: styles.containerMediumTopright,
-            children: [goalComponent, switchComponent]
-          })]
-        }), /*#__PURE__*/jsx(Collapse, {
-          timeout: 100,
-          in: isPinned && isShown,
-          children: /*#__PURE__*/jsx("div", {
-            className: styles.containerMediumBottom,
-            children: filtersComponent
-          })
-        })]
-      })
-    }), /*#__PURE__*/jsx(Collapse, {
-      timeout: 10,
-      in: layout === SMALL_SIZE_LAYOUT,
-      children: /*#__PURE__*/jsxs("div", {
-        className: styles.containerSmall,
-        children: [/*#__PURE__*/jsxs("div", {
-          className: styles.containerSmallTop,
-          children: [/*#__PURE__*/jsxs("div", {
-            className: styles.containerButtonsWrapper,
-            onMouseEnter: function onMouseEnter() {
-              return setShowPin(true);
-            },
-            onMouseLeave: function onMouseLeave() {
-              return setShowPin(false);
-            },
-            children: [/*#__PURE__*/jsx(FiltersToggler, {
-              onClick: handleOpen
-            }), (showPin || isPinned || Boolean(anchorEl)) && /*#__PURE__*/jsx(PinAppSwitch, {
-              isPinned: isPinned,
-              onClick: handlePinClick
-            })]
-          }), /*#__PURE__*/jsx("div", {
-            children: switchComponent
-          })]
-        }), /*#__PURE__*/jsx(Collapse, {
-          timeout: 100,
-          in: isPinned && isShown,
-          children: /*#__PURE__*/jsx("div", {
-            className: styles.containerSmallMiddle,
-            children: filtersComponent
-          })
-        }), /*#__PURE__*/jsx("div", {
-          className: styles.containerSmallBottom,
-          children: goalComponent
-        })]
-      })
-    }), /*#__PURE__*/jsx(Popover, {
-      id: "filters-popper",
-      classes: {
-        paper: classes.paper
-      },
-      open: Boolean(anchorEl),
-      anchorEl: anchorEl,
-      onClose: handleClose,
-      anchorOrigin: {
-        vertical: 'bottom',
-        horizontal: 'left'
-      },
-      transformOrigin: {
-        vertical: 'top',
-        horizontal: 'left'
-      },
-      children: /*#__PURE__*/jsx("div", {
-        className: styles.containerPopper,
-        children: filtersComponent
-      })
-    }), hiddenElements]
-  });
-}
-PinnableFilters.propTypes = {
-  classes: PropTypes.shape({}).isRequired,
-  appWidth: PropTypes.number.isRequired,
-  children: PropTypes.arrayOf(PropTypes.node).isRequired,
-  isPinnedInitial: PropTypes.bool,
-  isShownInitial: PropTypes.bool,
-  onShowCallback: PropTypes.func,
-  onPinCallback: PropTypes.func
-};
-PinnableFilters.defaultProps = {
-  isPinnedInitial: false,
-  isShownInitial: false,
-  onShowCallback: undefined,
-  onPinCallback: undefined
-};
-var StyledPinnableFilters = withStyles(muiStyles)(PinnableFilters);
-function WithSizeMe(_ref2) {
-  var _children = _ref2.children,
-    props = _objectWithoutProperties(_ref2, _excluded);
-  return /*#__PURE__*/jsx(SizeMe, {
-    monitorWidth: true,
-    children: function children(_ref3) {
-      var size = _ref3.size;
-      return /*#__PURE__*/jsx(StyledPinnableFilters, _objectSpread(_objectSpread({
-        appWidth: size.width - 21
-      }, props), {}, {
-        children: _children
-      }));
-    }
-  });
-}
-WithSizeMe.propTypes = {
-  children: PropTypes.arrayOf(PropTypes.node).isRequired
-};
-
-export { WithSizeMe as default };
-//# sourceMappingURL=PinnableFilters.js.map
+import e from"@babel/runtime/helpers/defineProperty";import r from"@babel/runtime/helpers/objectWithoutProperties";import i from"@babel/runtime/helpers/slicedToArray";import{useState as n}from"react";import o from"prop-types";import{SizeMe as t}from"react-sizeme";import{Collapse as l,Popover as a}from"@material-ui/core";import{withStyles as c}from"@material-ui/core/styles";import s from"./components/FiltersToggler.js";import d from"./components/PinAppSwitch.js";import{useComonentsWidth as p,useAppFilterTogglerWidth as m,useFilterLayout as u}from"./effects/index.js";import{getStartComponent as h,getMiddleComponent as f,getEndComponents as b}from"./utils.js";import{LARGE_SIZE_LAYOUT as v,MEDIUM_SIZE_LAYOUT as P,SMALL_SIZE_LAYOUT as O}from"./constants.js";import y from"./PinnableFilters.css.js";import{jsxs as j,jsx as g}from"react/jsx-runtime";var w=["children"];function N(e,r){var i=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),i.push.apply(i,n)}return i}function S(r){for(var i=1;i<arguments.length;i++){var n=null!=arguments[i]?arguments[i]:{};i%2?N(Object(n),!0).forEach((function(i){e(r,i,n[i])})):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(n)):N(Object(n)).forEach((function(e){Object.defineProperty(r,e,Object.getOwnPropertyDescriptor(n,e))}))}return r}function k(e){var r=e.children,o=e.classes,t=e.appWidth,c=e.isPinnedInitial,w=e.isShownInitial,N=e.onShowCallback,S=e.onPinCallback,k=n(null),C=i(k,2),M=C[0],T=C[1],W=n(c),B=i(W,2),E=B[0],I=B[1],q=n(w),z=i(q,2),D=z[0],L=z[1],R=n(!1),x=i(R,2),A=x[0],F=x[1],G=function(e){L(e),N&&N(e)},H=p(r),J=H.componentsWidth,K=H.hiddenElements,Q=m(),U=u(r,J,Q,t),V=h(r),X=f(r),Y=b(r),Z=function(e){E?G(!D):T(e.currentTarget)},$=function(){var e,r=!E;r&&(T(null),G(!0)),I(e=r),S&&S(e)};return j("div",{style:{width:"100%"},children:[g(l,{timeout:10,in:U===v,children:j("div",{className:y.containerLarge,children:[g("div",{children:V}),j("div",{className:y.containerLargeTopright,children:[X,Y]})]})}),g(l,{timeout:10,in:U===P,children:j("div",{className:y.containerMedium,children:[j("div",{className:y.containerMediumTop,children:[j("div",{className:y.containerButtonsWrapper,onMouseEnter:function(){return F(!0)},onMouseLeave:function(){return F(!1)},children:[g(s,{onClick:Z}),(A||E||Boolean(M))&&g(d,{isPinned:E,onClick:$})]}),j("div",{className:y.containerMediumTopright,children:[X,Y]})]}),g(l,{timeout:100,in:E&&D,children:g("div",{className:y.containerMediumBottom,children:V})})]})}),g(l,{timeout:10,in:U===O,children:j("div",{className:y.containerSmall,children:[j("div",{className:y.containerSmallTop,children:[j("div",{className:y.containerButtonsWrapper,onMouseEnter:function(){return F(!0)},onMouseLeave:function(){return F(!1)},children:[g(s,{onClick:Z}),(A||E||Boolean(M))&&g(d,{isPinned:E,onClick:$})]}),g("div",{children:Y})]}),g(l,{timeout:100,in:E&&D,children:g("div",{className:y.containerSmallMiddle,children:V})}),g("div",{className:y.containerSmallBottom,children:X})]})}),g(a,{id:"filters-popper",classes:{paper:o.paper},open:Boolean(M),anchorEl:M,onClose:function(){T(null)},anchorOrigin:{vertical:"bottom",horizontal:"left"},transformOrigin:{vertical:"top",horizontal:"left"},children:g("div",{className:y.containerPopper,children:V})}),K]})}k.propTypes={classes:o.shape({}).isRequired,appWidth:o.number.isRequired,children:o.arrayOf(o.node).isRequired,isPinnedInitial:o.bool,isShownInitial:o.bool,onShowCallback:o.func,onPinCallback:o.func},k.defaultProps={isPinnedInitial:!1,isShownInitial:!1,onShowCallback:void 0,onPinCallback:void 0};var C=c({paper:{backgroundColor:"#414141"}})(k);function M(e){var i=e.children,n=r(e,w);return g(t,{monitorWidth:!0,children:function(e){var r=e.size;return g(C,S(S({appWidth:r.width-21},n),{},{children:i}))}})}M.propTypes={children:o.arrayOf(o.node).isRequired};export{M as default};

package/components/PinnableFilters/components/FiltersToggler.js

@@ -1,70 +1 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import PropTypes from 'prop-types';
-import SortIcon from '@material-ui/icons/Sort';
-import { withStyles } from '@material-ui/core/styles';
-import Button from '../../Button/components/Button/index.js';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import 'react';
-import 'moment-timezone';
-import '@material-ui/core';
-import 'classnames';
-import '@icon-park/react/es/all';
-import { jsx } from 'react/jsx-runtime';
-import '../../../icons/IconParkProvider.js';
-import '../../../icons/customIcons/icons/AddMessage.js';
-import '../../../icons/customIcons/icons/Attention.js';
-import '../../../icons/customIcons/icons/Collapse.js';
-import '../../../icons/customIcons/icons/Dashboard.js';
-import '../../../icons/customIcons/icons/Expand.js';
-import '../../../icons/customIcons/icons/FolderClosed.js';
-import '../../../icons/customIcons/icons/FolderClosedFilled.js';
-import '../../../icons/customIcons/icons/FolderOpened.js';
-import '../../../icons/customIcons/icons/GreaterOrEqual.js';
-import '../../../icons/customIcons/icons/LessOrEqual.js';
-import '../../../icons/customIcons/icons/Search.js';
-import '../../../icons/customIcons/icons/Wellhub.js';
-import '../../../icons/customIcons/icons/MultiRuler.js';
-import '../../../icons/customIcons/icons/Checkbox.js';
-import '../../../icons/customIcons/icons/CheckboxChecked.js';
-import '../../../icons/customIcons/icons/CheckboxIndeterminate.js';
-import '../../../icons/customIcons/icons/Radio.js';
-import '../../../icons/customIcons/icons/RadioChecked.js';
-import '../../../icons/customIcons/icons/SimulFrac.js';
-import '../../../icons/customIcons/icons/ZipperFrac.js';
-import '../../../icons/customIcons/icons/CautionFilled.js';
-import '../../../icons/customIcons/icons/MoreApp.js';
-import '../../../icons/customIcons/icons/Pad.js';
-import '../../../icons/customIcons/icons/Gap.js';
-import '../../Button/components/LiveButton/components/LiveButtonStateIndicator/index.js';
-import '../../Button/components/LiveButton/styles.js';
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var muiStyles = function muiStyles(theme) {
-  return {
-    button: _objectSpread(_objectSpread({}, theme.isLightTheme ? {
-      color: 'black'
-    } : {}), {}, {
-      marginRight: theme.spacing()
-    })
-  };
-};
-function FiltersToggler(_ref) {
-  var onClick = _ref.onClick,
-    classes = _ref.classes;
-  return /*#__PURE__*/jsx("div", {
-    onClick: onClick,
-    children: /*#__PURE__*/jsx(Button, {
-      className: classes.button,
-      startIcon: /*#__PURE__*/jsx(SortIcon, {}),
-      children: "Filters"
-    })
-  });
-}
-FiltersToggler.propTypes = {
-  onClick: PropTypes.func.isRequired
-};
-var FiltersToggler$1 = withStyles(muiStyles)(FiltersToggler);
-
-export { FiltersToggler$1 as default };
-//# sourceMappingURL=FiltersToggler.js.map
+import o from"@babel/runtime/helpers/defineProperty";import s from"prop-types";import t from"@material-ui/icons/Sort";import{withStyles as c}from"@material-ui/core/styles";import n from"../../Button/components/Button/index.js";import{jsx as i}from"react/jsx-runtime";import"moment-timezone";import"@material-ui/core";import"classnames";import"react";import"@icon-park/react/es/all";import"../../../icons/IconParkProvider.js";import"../../../icons/customIcons/icons/AddMessage.js";import"../../../icons/customIcons/icons/Attention.js";import"../../../icons/customIcons/icons/Collapse.js";import"../../../icons/customIcons/icons/Dashboard.js";import"../../../icons/customIcons/icons/Expand.js";import"../../../icons/customIcons/icons/FolderClosed.js";import"../../../icons/customIcons/icons/FolderClosedFilled.js";import"../../../icons/customIcons/icons/FolderOpened.js";import"../../../icons/customIcons/icons/GreaterOrEqual.js";import"../../../icons/customIcons/icons/LessOrEqual.js";import"../../../icons/customIcons/icons/Search.js";import"../../../icons/customIcons/icons/Wellhub.js";import"../../../icons/customIcons/icons/MultiRuler.js";import"../../../icons/customIcons/icons/Checkbox.js";import"../../../icons/customIcons/icons/CheckboxChecked.js";import"../../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../../icons/customIcons/icons/Radio.js";import"../../../icons/customIcons/icons/RadioChecked.js";import"../../../icons/customIcons/icons/SimulFrac.js";import"../../../icons/customIcons/icons/ZipperFrac.js";import"../../../icons/customIcons/icons/CautionFilled.js";import"../../../icons/customIcons/icons/MoreApp.js";import"../../../icons/customIcons/icons/Pad.js";import"../../../icons/customIcons/icons/Gap.js";import"../../Button/components/LiveButton/components/LiveButtonStateIndicator/index.js";import"../../Button/components/LiveButton/styles.js";function r(o,s){var t=Object.keys(o);if(Object.getOwnPropertySymbols){var c=Object.getOwnPropertySymbols(o);s&&(c=c.filter((function(s){return Object.getOwnPropertyDescriptor(o,s).enumerable}))),t.push.apply(t,c)}return t}function e(s){for(var t=1;t<arguments.length;t++){var c=null!=arguments[t]?arguments[t]:{};t%2?r(Object(c),!0).forEach((function(t){o(s,t,c[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(s,Object.getOwnPropertyDescriptors(c)):r(Object(c)).forEach((function(o){Object.defineProperty(s,o,Object.getOwnPropertyDescriptor(c,o))}))}return s}function m(o){var s=o.onClick,c=o.classes;return i("div",{onClick:s,children:i(n,{className:c.button,startIcon:i(t,{}),children:"Filters"})})}m.propTypes={onClick:s.func.isRequired};var p=c((function(o){return{button:e(e({},o.isLightTheme?{color:"black"}:{}),{},{marginRight:o.spacing()})}}))(m);export{p as default};