@corva/ui 3.1.0-rc.5 → 3.1.0

package/components/FolderMenuItemWithLinks/index.js

@@ -1,108 +1 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useState } from 'react';
-import PropTypes from 'prop-types';
-import { Collapse, List } from '@material-ui/core';
-import FolderMenuItem from '../FolderMenuItem/index.js';
-import '../EditableItem/EditableItem/index.js';
-import EditableItemWithBadge from '../EditableItem/EditableItemWithBadge/index.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var FolderMenuItemWithLinks = function FolderMenuItemWithLinks(_ref) {
-  var folderColor = _ref.folderColor,
-    id = _ref.id,
-    isCreatable = _ref.isCreatable,
-    initialIsOpen = _ref.isOpen,
-    items = _ref.items,
-    name = _ref.name,
-    _onAdd = _ref.onAdd,
-    onFolderClick = _ref.onFolderClick,
-    onItemClick = _ref.onItemClick,
-    onSave = _ref.onSave,
-    selectedItemId = _ref.selectedItemId;
-  var _useState = useState(initialIsOpen),
-    _useState2 = _slicedToArray(_useState, 2),
-    isOpen = _useState2[0],
-    setIsOpen = _useState2[1];
-
-  // eslint-disable-next-line consistent-return
-  var handleFolderClick = function handleFolderClick() {
-    if (!isOpen) {
-      setIsOpen(true);
-    }
-    if (selectedItemId !== id) {
-      onFolderClick();
-    }
-  };
-  var getItemClickHandler = function getItemClickHandler(item) {
-    return function () {
-      return onItemClick(item);
-    };
-  };
-  var getSaveHandler = function getSaveHandler(id) {
-    return function (title) {
-      return onSave({
-        id: id,
-        title: title
-      });
-    };
-  };
-  return /*#__PURE__*/jsxs("div", {
-    children: [/*#__PURE__*/jsx(FolderMenuItem, {
-      folderColor: folderColor,
-      isCreatable: isCreatable,
-      isOpen: isOpen,
-      isSelected: selectedItemId === id,
-      name: name,
-      onAdd: function onAdd() {
-        return _onAdd(id);
-      },
-      onClick: handleFolderClick,
-      onToggle: function onToggle() {
-        return setIsOpen(!isOpen);
-      }
-    }), /*#__PURE__*/jsx(Collapse, {
-      in: isOpen,
-      timeout: "auto",
-      unmountOnExit: true,
-      children: /*#__PURE__*/jsx(List, {
-        disablePadding: true,
-        children: items.map(function (item) {
-          return /*#__PURE__*/jsx(EditableItemWithBadge, {
-            isEditable: item.isEditable,
-            isSelected: selectedItemId === item.id,
-            onClick: getItemClickHandler(item),
-            onSave: getSaveHandler(item.id),
-            value: item.title
-          }, item.id);
-        })
-      })
-    })]
-  });
-};
-FolderMenuItemWithLinks.propTypes = {
-  id: PropTypes.string.isRequired,
-  isOpen: PropTypes.bool,
-  selectedItemId: PropTypes.string.isRequired,
-  items: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.string.isRequired,
-    title: PropTypes.string.isRequired,
-    isEditable: PropTypes.bool,
-    url: PropTypes.string.isRequired
-  })),
-  name: PropTypes.string.isRequired,
-  onItemClick: PropTypes.func.isRequired,
-  onFolderClick: PropTypes.func,
-  folderColor: PropTypes.string.isRequired,
-  isCreatable: PropTypes.bool,
-  onSave: PropTypes.func.isRequired,
-  onAdd: PropTypes.func.isRequired
-};
-FolderMenuItemWithLinks.defaultProps = {
-  isCreatable: false,
-  isOpen: true,
-  items: [],
-  onFolderClick: function onFolderClick() {}
-};
-
-export { FolderMenuItemWithLinks as default };
-//# sourceMappingURL=index.js.map
+import e from"@babel/runtime/helpers/slicedToArray";import{useState as i}from"react";import r from"prop-types";import{Collapse as t,List as n}from"@material-ui/core";import o from"../FolderMenuItem/index.js";import"../EditableItem/EditableItem/index.js";import d from"../EditableItem/EditableItemWithBadge/index.js";import{jsxs as l,jsx as s}from"react/jsx-runtime";var u=function(r){var u=r.folderColor,a=r.id,m=r.isCreatable,c=r.isOpen,f=r.items,p=r.name,b=r.onAdd,C=r.onFolderClick,g=r.onItemClick,I=r.onSave,q=r.selectedItemId,R=i(c),E=e(R,2),k=E[0],v=E[1],h=function(e){return function(){return g(e)}},x=function(e){return function(i){return I({id:e,title:i})}};return l("div",{children:[s(o,{folderColor:u,isCreatable:m,isOpen:k,isSelected:q===a,name:p,onAdd:function(){return b(a)},onClick:function(){k||v(!0),q!==a&&C()},onToggle:function(){return v(!k)}}),s(t,{in:k,timeout:"auto",unmountOnExit:!0,children:s(n,{disablePadding:!0,children:f.map((function(e){return s(d,{isEditable:e.isEditable,isSelected:q===e.id,onClick:h(e),onSave:x(e.id),value:e.title},e.id)}))})})]})};u.propTypes={id:r.string.isRequired,isOpen:r.bool,selectedItemId:r.string.isRequired,items:r.arrayOf(r.shape({id:r.string.isRequired,title:r.string.isRequired,isEditable:r.bool,url:r.string.isRequired})),name:r.string.isRequired,onItemClick:r.func.isRequired,onFolderClick:r.func,folderColor:r.string.isRequired,isCreatable:r.bool,onSave:r.func.isRequired,onAdd:r.func.isRequired},u.defaultProps={isCreatable:!1,isOpen:!0,items:[],onFolderClick:function(){}};export{u as default};

package/components/Formula/CloseSuggestion.js

@@ -1,64 +1 @@
-import { makeStyles } from '@material-ui/core';
-import { Tooltip } from '../Tooltip/Tooltip.js';
-import '../Tooltip/ScrollableTooltip.js';
-import { CloseSmallIcon } from '../../icons/iconParkIcons.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 { jsx } from 'react/jsx-runtime';
-
-var useStyles = makeStyles(function (theme) {
-  return {
-    buttonWrapper: {
-      display: 'flex',
-      alignItems: 'center',
-      color: theme.palette.primary.text7,
-      '&:hover': {
-        color: theme.palette.primary.text1,
-        cursor: 'pointer'
-      },
-      marginLeft: '-24px',
-      zIndex: 999
-    }
-  };
-});
-function CloseSuggestion(_ref) {
-  var onClose = _ref.onClose;
-  var classes = useStyles();
-  return /*#__PURE__*/jsx("div", {
-    className: classes.buttonWrapper,
-    onClick: onClose,
-    children: /*#__PURE__*/jsx(Tooltip, {
-      title: "Clear",
-      placement: "bottom",
-      children: /*#__PURE__*/jsx(CloseSmallIcon, {
-        size: 16,
-        strokeWidth: 3
-      })
-    })
-  });
-}
-
-export { CloseSuggestion as default };
-//# sourceMappingURL=CloseSuggestion.js.map
+import{makeStyles as o}from"@material-ui/core";import{Tooltip as s}from"../Tooltip/Tooltip.js";import"../Tooltip/ScrollableTooltip.js";import{CloseSmallIcon as c}from"../../icons/iconParkIcons.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{jsx as i}from"react/jsx-runtime";var n=o((function(o){return{buttonWrapper:{display:"flex",alignItems:"center",color:o.palette.primary.text7,"&:hover":{color:o.palette.primary.text1,cursor:"pointer"},marginLeft:"-24px",zIndex:999}}}));function t(o){var t=o.onClose,r=n();return i("div",{className:r.buttonWrapper,onClick:t,children:i(s,{title:"Clear",placement:"bottom",children:i(c,{size:16,strokeWidth:3})})})}export{t as default};

package/components/Formula/Formula.js

@@ -1,285 +1 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useState, useMemo, useRef, useCallback, useEffect } from 'react';
-import classNames from 'classnames';
-import { useTheme, Button } from '@material-ui/core';
-import { replaceStringToLabel } from './utils.js';
-import { useFormulaFunction } from './useFormulaFunction.js';
-import { useFormulaStyles } from './useFormulaStyles.js';
-import RootXIcon from './RootXIcon.js';
-import FormulaTextEditor from './FormulaTextEditor.js';
-import CloseSuggestion from './CloseSuggestion.js';
-import SuggestionsMenu from './SuggestionsMenu.js';
-import { CloseSmallIcon, InfoIcon } from '../../icons/iconParkIcons.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 useOutsideClick from '../../effects/useOutsideClick.js';
-import { Tooltip } from '../Tooltip/Tooltip.js';
-import '../Tooltip/ScrollableTooltip.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var HOT_STR = '/f';
-var mathSymbols = [{
-  value: '*',
-  isShift: true,
-  label: '8'
-}, {
-  value: '/',
-  label: '/'
-}, {
-  value: '(',
-  isShift: true,
-  label: '9'
-}, {
-  value: ')',
-  isShift: true,
-  label: '0'
-}, {
-  value: '+',
-  isShift: true,
-  label: '+'
-}, {
-  value: '-',
-  label: '-'
-}, {
-  value: '^',
-  isShift: true,
-  label: '6'
-}];
-var getColor = function getColor(theme, isHighlight, isError) {
-  if (!isHighlight) return theme.palette.primary.text7;
-  return isError ? theme.palette.error.main : theme.palette.primary.main;
-};
-var Formula = function Formula(_ref) {
-  var _classnames;
-  var _ref$suggestions = _ref.suggestions,
-    suggestions = _ref$suggestions === void 0 ? [] : _ref$suggestions,
-    _ref$initFormula = _ref.initFormula,
-    initFormula = _ref$initFormula === void 0 ? '' : _ref$initFormula,
-    _ref$onSave = _ref.onSave,
-    onSave = _ref$onSave === void 0 ? function () {} : _ref$onSave;
-  var _useState = useState(true),
-    _useState2 = _slicedToArray(_useState, 2),
-    isVerified = _useState2[0],
-    setIsVerified = _useState2[1];
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    isValueUpdated = _useState4[0],
-    setIsValueUpdated = _useState4[1];
-  var _useState5 = useState(false),
-    _useState6 = _slicedToArray(_useState5, 2),
-    isHighlight = _useState6[0],
-    setIsHighlight = _useState6[1];
-  var _useState7 = useState(initFormula),
-    _useState8 = _slicedToArray(_useState7, 2),
-    formulaValue = _useState8[0],
-    setFormulaValue = _useState8[1];
-  var _useState9 = useState(0),
-    _useState10 = _slicedToArray(_useState9, 2),
-    cursorPos = _useState10[0],
-    setCursorPos = _useState10[1];
-  var _useState11 = useState(0),
-    _useState12 = _slicedToArray(_useState11, 2),
-    suggestionsMenuHeight = _useState12[0],
-    setSuggestionsMenuHeight = _useState12[1];
-  var formulaLabel = replaceStringToLabel(formulaValue, suggestions);
-  var hotStrPos = formulaLabel.search(HOT_STR);
-  var isSuggestionState = hotStrPos !== -1;
-  var suggestionKeys = useMemo(function () {
-    return suggestions.map(function (item) {
-      return item.key;
-    });
-  }, [suggestions]);
-  var keyStr = formulaLabel.substring(hotStrPos + HOT_STR.length, cursorPos);
-  var formulaRef = useRef();
-  var classes = useFormulaStyles({
-    isValue: !isSuggestionState && !!formulaValue
-  });
-  var theme = useTheme();
-  var _useFormulaFunction = useFormulaFunction(formulaValue, suggestionKeys),
-    formulaFunction = _useFormulaFunction.formulaFunction,
-    error = _useFormulaFunction.error;
-  useOutsideClick(formulaRef, function () {
-    setIsHighlight(false);
-  });
-  var handleAddSuggestion = function handleAddSuggestion(value) {
-    var _suggestion$label;
-    var suggestion = suggestions.find(function (item) {
-      return item.key === value;
-    });
-    setIsValueUpdated(true);
-    setIsHighlight(true);
-    setFormulaValue(function (prev) {
-      return prev.replace("".concat(HOT_STR).concat(keyStr), value ? "[".concat(value, "]") : '');
-    });
-    setCursorPos(hotStrPos + ((suggestion === null || suggestion === void 0 ? void 0 : (_suggestion$label = suggestion.label) === null || _suggestion$label === void 0 ? void 0 : _suggestion$label.length) || 0));
-  };
-  var handleCloseSuggestionState = function handleCloseSuggestionState() {
-    return handleAddSuggestion('');
-  };
-  var handleChangeEditorValue = useCallback(function (newValue, newCursorPos) {
-    if (cursorPos !== newCursorPos) {
-      setCursorPos(newCursorPos);
-    }
-    if (newValue !== formulaValue) {
-      setFormulaValue(newValue);
-      setIsVerified(false);
-    }
-  }, [formulaValue, cursorPos]);
-  var handleClickValue = function handleClickValue() {
-    setIsHighlight(true);
-  };
-  var handleClear = function handleClear() {
-    if (isSuggestionState) return;
-    setIsVerified(false);
-    setFormulaValue('');
-    setCursorPos(0);
-    setIsValueUpdated(true);
-  };
-  var handleVerify = function handleVerify() {
-    setIsVerified(true);
-    var variables = suggestions.map(function (suggestion) {
-      return suggestion.key;
-    }).filter(function (item) {
-      return formulaValue && formulaValue.includes(item);
-    });
-    onSave({
-      formula: formulaValue,
-      variables: variables,
-      formulaFunc: formulaFunction
-    });
-  };
-  useEffect(function () {
-    setFormulaValue(initFormula);
-  }, [initFormula]);
-  return /*#__PURE__*/jsxs("div", {
-    className: classes.formulaContainer,
-    children: [/*#__PURE__*/jsxs("div", {
-      className: classes.formulaHeaderWrapper,
-      children: [/*#__PURE__*/jsxs("div", {
-        className: classes.formulaHeaderTextWrapper,
-        children: [/*#__PURE__*/jsx(RootXIcon, {
-          color: getColor(theme, isHighlight, error)
-        }), /*#__PURE__*/jsx("div", {
-          className: classes.formulaHeaderText,
-          style: {
-            color: getColor(theme, isHighlight, error)
-          },
-          children: "Formula Expression"
-        })]
-      }), /*#__PURE__*/jsxs("div", {
-        className: classes.formulaHeaderButtonWrapper,
-        onClick: handleClear,
-        children: [/*#__PURE__*/jsx(CloseSmallIcon, {
-          strokeWidth: 3,
-          size: 16
-        }), /*#__PURE__*/jsx("div", {
-          className: classes.formulaHeaderText,
-          children: "Clear"
-        })]
-      })]
-    }), /*#__PURE__*/jsxs("div", {
-      className: classes.formulaEditorWrapper,
-      children: [/*#__PURE__*/jsx("div", {
-        ref: formulaRef,
-        onClick: handleClickValue,
-        children: /*#__PURE__*/jsx(FormulaTextEditor, {
-          initFormula: formulaValue,
-          cursorPos: cursorPos,
-          color: getColor(theme, isHighlight, error),
-          suggestions: suggestions,
-          isValueUpdated: isValueUpdated,
-          setIsValueUpdated: setIsValueUpdated,
-          onChange: handleChangeEditorValue
-        })
-      }), isSuggestionState && /*#__PURE__*/jsx(CloseSuggestion, {
-        onClose: handleCloseSuggestionState
-      })]
-    }), isSuggestionState && /*#__PURE__*/jsx(SuggestionsMenu, {
-      suggestions: suggestions,
-      keyStr: keyStr,
-      onAddSuggestion: handleAddSuggestion,
-      onChangeHeight: setSuggestionsMenuHeight
-    }), /*#__PURE__*/jsxs("div", {
-      className: classes.formulaFooterWrapper,
-      style: {
-        marginTop: isSuggestionState ? -suggestionsMenuHeight : 0
-      },
-      children: [/*#__PURE__*/jsx(InfoIcon, {
-        className: classes.formulaFooterIcon,
-        strokeWidth: 3,
-        size: 16
-      }), /*#__PURE__*/jsx("div", {
-        className: classes.formulaFooterTextWrapper,
-        children: /*#__PURE__*/jsxs("div", {
-          className: classes.formulaFooterText,
-          children: ["Type ", /*#__PURE__*/jsx("span", {
-            className: classes.funcText,
-            children: "/f"
-          }), " to do add live channels to your equation. Use your keybord for numbers and", ' ', /*#__PURE__*/jsx(Tooltip, {
-            title: /*#__PURE__*/jsx("div", {
-              className: classes.tooltipWrapper,
-              children: mathSymbols.map(function (item) {
-                return /*#__PURE__*/jsxs("div", {
-                  className: classes.tooltipLine,
-                  children: [/*#__PURE__*/jsx("span", {
-                    className: classes.tooltipValue,
-                    children: item.value
-                  }), /*#__PURE__*/jsxs("div", {
-                    className: classes.tooltipLabelContainer,
-                    children: [!!item.isShift && /*#__PURE__*/jsx("span", {
-                      className: classes.tooltipSymbol,
-                      children: "\u21E7"
-                    }), /*#__PURE__*/jsx("span", {
-                      children: item.label
-                    })]
-                  }, item.value)]
-                }, item.value);
-              })
-            }),
-            placement: "bottom",
-            children: /*#__PURE__*/jsx("span", {
-              className: classes.successColor,
-              children: "math symbols"
-            })
-          })]
-        })
-      })]
-    }), /*#__PURE__*/jsx(Button, {
-      className: classes.verifyButton,
-      variant: "contained",
-      color: "primary",
-      onClick: handleVerify,
-      disabled: isVerified || !formulaFunction,
-      children: "Verify"
-    }), !!formulaValue && /*#__PURE__*/jsx("span", {
-      className: classNames(classes.resultText, (_classnames = {}, _defineProperty(_classnames, classes.errorColor, !!error), _defineProperty(_classnames, classes.resultSuccessColor, !error), _classnames)),
-      children: error ? 'The formula is not valid' : 'The formula is valid'
-    })]
-  });
-};
-
-export { Formula as default };
-//# sourceMappingURL=Formula.js.map
+import{jsxs as o,jsx as s}from"react/jsx-runtime";import{useState as i,useMemo as e,useRef as r,useCallback as n,useEffect as c}from"react";import t from"classnames";import{useTheme as a,Button as l}from"@material-ui/core";import{replaceStringToLabel as m}from"./utils.js";import{useFormulaFunction as u}from"./useFormulaFunction.js";import{useFormulaStyles as p}from"./useFormulaStyles.js";import d from"./RootXIcon.js";import f from"./FormulaTextEditor.js";import h from"./CloseSuggestion.js";import v from"./SuggestionsMenu.js";import{CloseSmallIcon as j,InfoIcon as I}from"../../icons/iconParkIcons.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 b from"../../effects/useOutsideClick.js";import{Tooltip as C}from"../Tooltip/Tooltip.js";import"../Tooltip/ScrollableTooltip.js";var g=[{value:"*",isShift:!0,label:"8"},{value:"/",label:"/"},{value:"(",isShift:!0,label:"9"},{value:")",isShift:!0,label:"0"},{value:"+",isShift:!0,label:"+"},{value:"-",label:"-"},{value:"^",isShift:!0,label:"6"}],F=function(o,s,i){return s?i?o.palette.error.main:o.palette.primary.main:o.palette.primary.text7},N=function(N){var y,k=N.suggestions,S=void 0===k?[]:k,x=N.initFormula,T=void 0===x?"":x,W=N.onSave,E=void 0===W?function(){}:W,H=i(!0),V=H[0],A=H[1],M=i(!1),O=M[0],R=M[1],q=i(!1),L=q[0],P=q[1],U=i(T),z=U[0],B=U[1],G=i(0),D=G[0],X=G[1],Z=i(0),w=Z[0],J=Z[1],K=m(z,S),Q=K.search("/f"),Y=-1!==Q,$=e((function(){return S.map((function(o){return o.key}))}),[S]),_=K.substring(Q+"/f".length,D),oo=r(),so=p({isValue:!Y&&!!z}),io=a(),eo=u(z,$),ro=eo.formulaFunction,no=eo.error;b(oo,(function(){P(!1)}));var co=function(o){var s,i=S.find((function(s){return s.key===o}));R(!0),P(!0),B((function(s){return s.replace("".concat("/f").concat(_),o?"[".concat(o,"]"):"")})),X(Q+((null===(s=null==i?void 0:i.label)||void 0===s?void 0:s.length)||0))},to=n((function(o,s){D!==s&&X(s),o!==z&&(B(o),A(!1))}),[z,D]);return c((function(){B(T)}),[T]),o("div",{className:so.formulaContainer,children:[o("div",{className:so.formulaHeaderWrapper,children:[o("div",{className:so.formulaHeaderTextWrapper,children:[s(d,{color:F(io,L,no)}),s("div",{className:so.formulaHeaderText,style:{color:F(io,L,no)},children:"Formula Expression"})]}),o("div",{className:so.formulaHeaderButtonWrapper,onClick:function(){Y||(A(!1),B(""),X(0),R(!0))},children:[s(j,{strokeWidth:3,size:16}),s("div",{className:so.formulaHeaderText,children:"Clear"})]})]}),o("div",{className:so.formulaEditorWrapper,children:[s("div",{ref:oo,onClick:function(){P(!0)},children:s(f,{initFormula:z,cursorPos:D,color:F(io,L,no),suggestions:S,isValueUpdated:O,setIsValueUpdated:R,onChange:to})}),Y&&s(h,{onClose:function(){return co("")}})]}),Y&&s(v,{suggestions:S,keyStr:_,onAddSuggestion:co,onChangeHeight:J}),o("div",{className:so.formulaFooterWrapper,style:{marginTop:Y?-w:0},children:[s(I,{className:so.formulaFooterIcon,strokeWidth:3,size:16}),s("div",{className:so.formulaFooterTextWrapper,children:o("div",{className:so.formulaFooterText,children:["Type ",s("span",{className:so.funcText,children:"/f"})," to do add live channels to your equation. Use your keybord for numbers and"," ",s(C,{title:s("div",{className:so.tooltipWrapper,children:g.map((function(i){return o("div",{className:so.tooltipLine,children:[s("span",{className:so.tooltipValue,children:i.value}),o("div",{className:so.tooltipLabelContainer,children:[!!i.isShift&&s("span",{className:so.tooltipSymbol,children:"⇧"}),s("span",{children:i.label})]},i.value)]},i.value)}))}),placement:"bottom",children:s("span",{className:so.successColor,children:"math symbols"})})]})})]}),s(l,{className:so.verifyButton,variant:"contained",color:"primary",onClick:function(){A(!0);var o=S.map((function(o){return o.key})).filter((function(o){return z&&z.includes(o)}));E({formula:z,variables:o,formulaFunc:ro})},disabled:V||!ro,children:"Verify"}),!!z&&s("span",{className:t(so.resultText,(y={},y[so.errorColor]=!!no,y[so.resultSuccessColor]=!no,y)),children:no?"The formula is not valid":"The formula is valid"})]})};export{N as default};

package/components/Formula/FormulaTextEditor.js

@@ -1,97 +1 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useMemo, useState, useRef, useEffect } from 'react';
-import { makeStyles } from '@material-ui/core';
-import { convertStringToEditorValue, getUpdatedHtmlValue, setCaret, getCaret, convertEditorValueToString } from './utils.js';
-import { jsx } from 'react/jsx-runtime';
-
-var useStyles = makeStyles(function () {
-  return {
-    customTextarea: {
-      display: 'flex',
-      flexWrap: 'wrap',
-      alignItems: 'center',
-      width: '442px',
-      maxWidth: '442px',
-      minHeight: '90px',
-      overflowWrap: 'anywhere',
-      whiteSpace: 'normal',
-      margin: '-8px 0',
-      padding: function padding(_ref) {
-        var isEmptyValue = _ref.isEmptyValue;
-        return isEmptyValue ? '31px 24px 24px 16px' : '16px 24px 16px 16px';
-      },
-      fontSize: '16px',
-      lineHeight: '24px',
-      borderRadius: '8px',
-      outline: '0px',
-      border: function border(_ref2) {
-        var color = _ref2.color;
-        return "1px solid ".concat(color);
-      }
-    }
-  };
-});
-var enterKeyCode = 13;
-var FormulaTextEditor = function FormulaTextEditor(_ref3) {
-  var initFormula = _ref3.initFormula,
-    cursorPos = _ref3.cursorPos,
-    color = _ref3.color,
-    suggestions = _ref3.suggestions,
-    isValueUpdated = _ref3.isValueUpdated,
-    setIsValueUpdated = _ref3.setIsValueUpdated,
-    onChange = _ref3.onChange;
-  var initialValue = useMemo(function () {
-    return convertStringToEditorValue(initFormula, suggestions);
-  }, [initFormula, suggestions]);
-  var _useState = useState(initialValue),
-    _useState2 = _slicedToArray(_useState, 2),
-    htmlValue = _useState2[0],
-    setHtmlValue = _useState2[1];
-  var _useMemo = useMemo(function () {
-      return getUpdatedHtmlValue(htmlValue);
-    }, [htmlValue]),
-    _useMemo2 = _slicedToArray(_useMemo, 2),
-    updatedHtmlValue = _useMemo2[0],
-    isEmptyValue = _useMemo2[1];
-  var contentRef = useRef();
-  var initialRef = useRef(false);
-  var classes = useStyles({
-    color: color,
-    isEmptyValue: isEmptyValue
-  });
-  var handleKeyPress = function handleKeyPress(event) {
-    // prevent Enter key
-    if (event.charCode === enterKeyCode) {
-      event.preventDefault();
-    }
-  };
-  var handleChange = function handleChange(event) {
-    var caretPos = getCaret(contentRef.current);
-    setHtmlValue(event.target.innerHTML);
-    onChange(convertEditorValueToString(event.target.innerHTML, suggestions), caretPos);
-  };
-  useEffect(function () {
-    if (isValueUpdated) {
-      initialRef.current = true;
-      setHtmlValue(initialValue);
-      setIsValueUpdated(false);
-    }
-  }, [initialValue, isValueUpdated]);
-  useEffect(function () {
-    setCaret(contentRef.current, cursorPos);
-    if (initialRef.current) contentRef.current.focus();
-  }, [updatedHtmlValue]);
-  return /*#__PURE__*/jsx("span", {
-    ref: contentRef,
-    contentEditable: true,
-    onInput: handleChange,
-    onKeyPress: handleKeyPress,
-    className: classes.customTextarea,
-    dangerouslySetInnerHTML: {
-      __html: updatedHtmlValue
-    }
-  });
-};
-
-export { FormulaTextEditor as default, useStyles };
-//# sourceMappingURL=FormulaTextEditor.js.map
+import r from"@babel/runtime/helpers/slicedToArray";import{useMemo as e,useState as t,useRef as n,useEffect as o}from"react";import{makeStyles as a}from"@material-ui/core";import{convertStringToEditorValue as i,getUpdatedHtmlValue as u,setCaret as p,getCaret as c,convertEditorValueToString as s}from"./utils.js";import{jsx as l}from"react/jsx-runtime";var m=a((function(){return{customTextarea:{display:"flex",flexWrap:"wrap",alignItems:"center",width:"442px",maxWidth:"442px",minHeight:"90px",overflowWrap:"anywhere",whiteSpace:"normal",margin:"-8px 0",padding:function(r){return r.isEmptyValue?"31px 24px 24px 16px":"16px 24px 16px 16px"},fontSize:"16px",lineHeight:"24px",borderRadius:"8px",outline:"0px",border:function(r){var e=r.color;return"1px solid ".concat(e)}}}})),x=function(a){var x=a.initFormula,f=a.cursorPos,d=a.color,g=a.suggestions,h=a.isValueUpdated,y=a.setIsValueUpdated,v=a.onChange,T=e((function(){return i(x,g)}),[x,g]),b=t(T),w=r(b,2),H=w[0],I=w[1],V=e((function(){return u(H)}),[H]),E=r(V,2),L=E[0],M=E[1],S=n(),W=n(!1),j=m({color:d,isEmptyValue:M});return o((function(){h&&(W.current=!0,I(T),y(!1))}),[T,h]),o((function(){p(S.current,f),W.current&&S.current.focus()}),[L]),l("span",{ref:S,contentEditable:!0,onInput:function(r){var e=c(S.current);I(r.target.innerHTML),v(s(r.target.innerHTML,g),e)},onKeyPress:function(r){13===r.charCode&&r.preventDefault()},className:j.customTextarea,dangerouslySetInnerHTML:{__html:L}})};export{x as default,m as useStyles};

package/components/Formula/RootXIcon.js

@@ -1,41 +1 @@
-import PropTypes from 'prop-types';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var RootXIcon = function RootXIcon(_ref) {
-  var color = _ref.color;
-  return /*#__PURE__*/jsxs("svg", {
-    width: "12",
-    height: "10",
-    viewBox: "0 0 12 10",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    children: [/*#__PURE__*/jsx("path", {
-      d: "M11.25 1.25H6L3.75 9.5L2.25 5.75H0.75",
-      stroke: color,
-      strokeMiterlimit: "10",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M6.75 5.375L10.5 9.5",
-      stroke: color,
-      strokeMiterlimit: "10",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }), /*#__PURE__*/jsx("path", {
-      d: "M10.5 5.375L6.75 9.5",
-      stroke: color,
-      strokeMiterlimit: "10",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    })]
-  });
-};
-RootXIcon.propTypes = {
-  color: PropTypes.string
-};
-RootXIcon.defaultProps = {
-  color: '#03BCD4'
-};
-
-export { RootXIcon as default };
-//# sourceMappingURL=RootXIcon.js.map
+import r from"prop-types";import{jsxs as o,jsx as t}from"react/jsx-runtime";var e=function(r){var e=r.color;return o("svg",{width:"12",height:"10",viewBox:"0 0 12 10",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("path",{d:"M11.25 1.25H6L3.75 9.5L2.25 5.75H0.75",stroke:e,strokeMiterlimit:"10",strokeLinecap:"round",strokeLinejoin:"round"}),t("path",{d:"M6.75 5.375L10.5 9.5",stroke:e,strokeMiterlimit:"10",strokeLinecap:"round",strokeLinejoin:"round"}),t("path",{d:"M10.5 5.375L6.75 9.5",stroke:e,strokeMiterlimit:"10",strokeLinecap:"round",strokeLinejoin:"round"})]})};e.propTypes={color:r.string},e.defaultProps={color:"#03BCD4"};export{e as default};