@corva/ui 0.34.0-rc.3 → 0.34.0

package/components/Drillstring/BHATable/index.js

@@ -1,120 +1 @@
-import { getUnitDisplay } from '../../../utils/index.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { makeStyles, Table, TableHead, TableRow, TableCell, TableBody } from '@material-ui/core';
-import { memo } from 'react';
-import PropTypes from 'prop-types';
-import BHAComponent from './BHAComponent.js';
-
-var useStyles = makeStyles({
-  tableStyle: {
-    tableLayout: 'fixed'
-  },
-  tableHeadCellStyle: {
-    height: '38px',
-    padding: '0px',
-    color: '#999999',
-    fontSize: '12px',
-    borderTop: '1px solid rgba(81, 81, 81, 1)'
-  }
-});
-
-function BHATable(_ref) {
-  var components = _ref.components,
-      onSelectComponent = _ref.onSelectComponent;
-
-  var _useStyles = useStyles(),
-      tableStyle = _useStyles.tableStyle,
-      tableHeadCellStyle = _useStyles.tableHeadCellStyle;
-
-  return /*#__PURE__*/jsxs(Table, {
-    className: tableStyle,
-    children: [/*#__PURE__*/jsx(TableHead, {
-      children: /*#__PURE__*/jsxs(TableRow, {
-        children: [/*#__PURE__*/jsx(TableCell, {
-          className: tableHeadCellStyle,
-          style: {
-            width: '2%'
-          },
-          children: "#"
-        }), /*#__PURE__*/jsx(TableCell, {
-          className: tableHeadCellStyle,
-          style: {
-            width: '13%',
-            paddingLeft: 44
-          },
-          children: "Category"
-        }), /*#__PURE__*/jsx(TableCell, {
-          className: tableHeadCellStyle,
-          style: {
-            width: '13%'
-          },
-          children: "Name"
-        }), /*#__PURE__*/jsxs(TableCell, {
-          className: tableHeadCellStyle,
-          style: {
-            width: '7%'
-          },
-          children: ["OD (", getUnitDisplay('shortLength'), ")"]
-        }), /*#__PURE__*/jsxs(TableCell, {
-          className: tableHeadCellStyle,
-          style: {
-            width: '7%'
-          },
-          children: ["ID (", getUnitDisplay('shortLength'), ")"]
-        }), /*#__PURE__*/jsxs(TableCell, {
-          className: tableHeadCellStyle,
-          style: {
-            width: '15%'
-          },
-          children: ["Linear Weight (", getUnitDisplay('massPerLength'), ")"]
-        }), /*#__PURE__*/jsxs(TableCell, {
-          className: tableHeadCellStyle,
-          style: {
-            width: '10%'
-          },
-          children: ["Length (", getUnitDisplay('length'), ")"]
-        }), /*#__PURE__*/jsxs(TableCell, {
-          className: tableHeadCellStyle,
-          style: {
-            width: '10%'
-          },
-          children: ["Weight (", getUnitDisplay('mass'), ")"]
-        }), /*#__PURE__*/jsxs(TableCell, {
-          className: tableHeadCellStyle,
-          style: {
-            width: '13%'
-          },
-          children: ["Cum.Length (", getUnitDisplay('length'), ")"]
-        }), /*#__PURE__*/jsx(TableCell, {
-          className: tableHeadCellStyle,
-          style: {
-            width: '7%'
-          },
-          children: "Grade"
-        }), /*#__PURE__*/jsx(TableCell, {
-          className: tableHeadCellStyle,
-          style: {
-            width: '3%'
-          }
-        })]
-      })
-    }), /*#__PURE__*/jsx(TableBody, {
-      children: components.map(function (component, idx) {
-        return /*#__PURE__*/jsx(BHAComponent, {
-          component: component,
-          order: idx + 1,
-          onSelect: onSelectComponent
-        }, component.id);
-      })
-    })]
-  });
-}
-
-BHATable.propTypes = {
-  components: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
-  onSelectComponent: PropTypes.func.isRequired
-};
-var BHATable$1 = memo(BHATable);
-
-export default BHATable$1;
-//# sourceMappingURL=index.js.map
+import{memo as e}from"react";import t from"prop-types";import{makeStyles as l,Table as r,TableHead as a,TableRow as s,TableCell as i,TableBody as n}from"@material-ui/core";import{getUnitDisplay as o}from"../../../utils/index.js";import d from"./BHAComponent.js";import{jsxs as c,jsx as h}from"react/jsx-runtime";var m=l({tableStyle:{tableLayout:"fixed"},tableHeadCellStyle:{height:"38px",padding:"0px",color:"#999999",fontSize:"12px",borderTop:"1px solid rgba(81, 81, 81, 1)"}});function p(e){var t=e.components,l=e.onSelectComponent,p=m(),y=p.tableStyle,f=p.tableHeadCellStyle;return c(r,{className:y,children:[h(a,{children:c(s,{children:[h(i,{className:f,style:{width:"2%"},children:"#"}),h(i,{className:f,style:{width:"13%",paddingLeft:44},children:"Category"}),h(i,{className:f,style:{width:"13%"},children:"Name"}),c(i,{className:f,style:{width:"7%"},children:["OD (",o("shortLength"),")"]}),c(i,{className:f,style:{width:"7%"},children:["ID (",o("shortLength"),")"]}),c(i,{className:f,style:{width:"15%"},children:["Linear Weight (",o("massPerLength"),")"]}),c(i,{className:f,style:{width:"10%"},children:["Length (",o("length"),")"]}),c(i,{className:f,style:{width:"10%"},children:["Weight (",o("mass"),")"]}),c(i,{className:f,style:{width:"13%"},children:["Cum.Length (",o("length"),")"]}),h(i,{className:f,style:{width:"7%"},children:"Grade"}),h(i,{className:f,style:{width:"3%"}})]})}),h(n,{children:t.map((function(e,t){return h(d,{component:e,order:t+1,onSelect:l},e.id)}))})]})}p.propTypes={components:t.arrayOf(t.shape({})).isRequired,onSelectComponent:t.func.isRequired};var y=e(p);export{y as default};

package/components/Drillstring/BhaIndicator/BhaIndicator.js

@@ -1,72 +1 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { oneOf } from 'prop-types';
-import classNames from 'classnames';
-import styles from './styles.css.js';
-
-var ALIGNS = {
-  left: 'left',
-  right: 'right'
-};
-
-var BhaIndicator = function BhaIndicator(_ref) {
-  var _classNames;
-
-  var align = _ref.align;
-  return /*#__PURE__*/jsxs("div", {
-    className: classNames(styles.bhaIndicator, (_classNames = {}, _defineProperty(_classNames, styles.bhaIndicatorLeft, align === ALIGNS.left), _defineProperty(_classNames, styles.bhaIndicatorRight, align === ALIGNS.right), _classNames)),
-    children: [/*#__PURE__*/jsxs("div", {
-      children: [/*#__PURE__*/jsx("div", {
-        className: styles.bhaIndicatorColorBit
-      }), /*#__PURE__*/jsx("div", {
-        className: styles.bhaIndicatorLabel,
-        children: "Bit"
-      })]
-    }), /*#__PURE__*/jsxs("div", {
-      children: [/*#__PURE__*/jsx("div", {
-        className: styles.bhaIndicatorColorUr
-      }), /*#__PURE__*/jsx("div", {
-        className: styles.bhaIndicatorLabel,
-        children: "Under Reamer"
-      })]
-    }), /*#__PURE__*/jsxs("div", {
-      children: [/*#__PURE__*/jsx("div", {
-        className: styles.bhaIndicatorColorRss
-      }), /*#__PURE__*/jsx("div", {
-        className: styles.bhaIndicatorLabel,
-        children: "RSS"
-      })]
-    }), /*#__PURE__*/jsxs("div", {
-      children: [/*#__PURE__*/jsx("div", {
-        className: styles.bhaIndicatorColorPdm
-      }), /*#__PURE__*/jsx("div", {
-        className: styles.bhaIndicatorLabel,
-        children: "PDM"
-      })]
-    }), /*#__PURE__*/jsxs("div", {
-      children: [/*#__PURE__*/jsx("div", {
-        className: styles.bhaIndicatorColorOther
-      }), /*#__PURE__*/jsx("div", {
-        className: styles.bhaIndicatorLabel,
-        children: "Non-mag"
-      })]
-    }), /*#__PURE__*/jsxs("div", {
-      children: [/*#__PURE__*/jsx("div", {
-        className: styles.bhaIndicatorColorStabilizer
-      }), /*#__PURE__*/jsx("div", {
-        className: styles.bhaIndicatorLabel,
-        children: "Stabilizer"
-      })]
-    })]
-  });
-};
-
-BhaIndicator.propTypes = {
-  align: oneOf(['left', 'right'])
-};
-BhaIndicator.defaultProps = {
-  align: 'right'
-};
-
-export default BhaIndicator;
-//# sourceMappingURL=BhaIndicator.js.map
+import a from"@babel/runtime/helpers/defineProperty";import{oneOf as i}from"prop-types";import r from"classnames";import e from"./styles.css.js";import{jsxs as d,jsx as l}from"react/jsx-runtime";var c="left",o="right",t=function(i){var t,s=i.align;return d("div",{className:r(e.bhaIndicator,(t={},a(t,e.bhaIndicatorLeft,s===c),a(t,e.bhaIndicatorRight,s===o),t)),children:[d("div",{children:[l("div",{className:e.bhaIndicatorColorBit}),l("div",{className:e.bhaIndicatorLabel,children:"Bit"})]}),d("div",{children:[l("div",{className:e.bhaIndicatorColorUr}),l("div",{className:e.bhaIndicatorLabel,children:"Under Reamer"})]}),d("div",{children:[l("div",{className:e.bhaIndicatorColorRss}),l("div",{className:e.bhaIndicatorLabel,children:"RSS"})]}),d("div",{children:[l("div",{className:e.bhaIndicatorColorPdm}),l("div",{className:e.bhaIndicatorLabel,children:"PDM"})]}),d("div",{children:[l("div",{className:e.bhaIndicatorColorOther}),l("div",{className:e.bhaIndicatorLabel,children:"Non-mag"})]}),d("div",{children:[l("div",{className:e.bhaIndicatorColorStabilizer}),l("div",{className:e.bhaIndicatorLabel,children:"Stabilizer"})]})]})};t.propTypes={align:i(["left","right"])},t.defaultProps={align:"right"};export{t as default};

package/components/Drillstring/BhaIndicator/styles.css.js

@@ -1,8 +1 @@
-import styleInject from '../../../ext-esm/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".styles_bhaIndicator__3e7RQ {\n  height: 20px;\n  display: flex;\n  justify-content: flex-end;\n  padding: 5px 0;\n}\n.styles_bhaIndicatorRight__2-0KZ {\n  justify-content: flex-end;\n}\n.styles_bhaIndicatorLeft__20Pld {\n  justify-content: flex-start;\n}\n.styles_bhaIndicator__3e7RQ > div {\n  display: flex;\n  align-items: center;\n}\n.styles_bhaIndicatorRight__2-0KZ > div {\n  margin-left: 10px;\n}\n.styles_bhaIndicatorLeft__20Pld > div {\n  margin-right: 10px;\n}\n.styles_bhaIndicatorColorBit__2oS_7 {\n  width: 10px;\n  height: 10px;\n  background-color: #239FE6;\n}\n.styles_bhaIndicatorColorRss__3SHrJ {\n  width: 10px;\n  height: 10px;\n  background-color: #dd375e;\n}\n.styles_bhaIndicatorColorPdm__3wesh {\n  width: 10px;\n  height: 10px;\n  background-color: #C208DF;\n}\n.styles_bhaIndicatorColorOther__39Jjt {\n  width: 10px;\n  height: 10px;\n  background-color: #8398A5;\n}\n.styles_bhaIndicatorColorStabilizer__3YvOX {\n  width: 10px;\n  height: 10px;\n  background-color: yellow;\n}\n.styles_bhaIndicatorColorUr__IYYDE {\n  width: 10px;\n  height: 10px;\n  background-color: #44ff44;\n}\n.styles_bhaIndicatorLabel__1niVa {\n  font-size: 0.75rem;\n  margin-left: 5px;\n}\n.styles_cDashboardReportAppLightTheme__2nQKR .styles_bhaIndicatorLabel__1niVa {\n  color: rgba(0, 0, 0, 0.54);\n}\n";
-var styles = {"bhaIndicator":"styles_bhaIndicator__3e7RQ","bhaIndicatorRight":"styles_bhaIndicatorRight__2-0KZ","bhaIndicatorLeft":"styles_bhaIndicatorLeft__20Pld","bhaIndicatorColorBit":"styles_bhaIndicatorColorBit__2oS_7","bhaIndicatorColorRss":"styles_bhaIndicatorColorRss__3SHrJ","bhaIndicatorColorPdm":"styles_bhaIndicatorColorPdm__3wesh","bhaIndicatorColorOther":"styles_bhaIndicatorColorOther__39Jjt","bhaIndicatorColorStabilizer":"styles_bhaIndicatorColorStabilizer__3YvOX","bhaIndicatorColorUr":"styles_bhaIndicatorColorUr__IYYDE","bhaIndicatorLabel":"styles_bhaIndicatorLabel__1niVa","cDashboardReportAppLightTheme":"styles_cDashboardReportAppLightTheme__2nQKR"};
-styleInject(css_248z);
-
-export default styles;
-//# sourceMappingURL=styles.css.js.map
+import t from'./../../../ext-esm/style-inject/dist/style-inject.es.js';var o={bhaIndicator:"styles_bhaIndicator__DQ-XS",bhaIndicatorRight:"styles_bhaIndicatorRight__zjldo",bhaIndicatorLeft:"styles_bhaIndicatorLeft__4o0L5",bhaIndicatorColorBit:"styles_bhaIndicatorColorBit__AOi-F",bhaIndicatorColorRss:"styles_bhaIndicatorColorRss__w--OQ",bhaIndicatorColorPdm:"styles_bhaIndicatorColorPdm__V-VSL",bhaIndicatorColorOther:"styles_bhaIndicatorColorOther__z6zBV",bhaIndicatorColorStabilizer:"styles_bhaIndicatorColorStabilizer__j7t46",bhaIndicatorColorUr:"styles_bhaIndicatorColorUr__BORpN",bhaIndicatorLabel:"styles_bhaIndicatorLabel__yr4ef",cDashboardReportAppLightTheme:"styles_cDashboardReportAppLightTheme__3aYPR"};t(".styles_bhaIndicator__DQ-XS{display:flex;height:20px;justify-content:flex-end;padding:5px 0}.styles_bhaIndicatorRight__zjldo{justify-content:flex-end}.styles_bhaIndicatorLeft__4o0L5{justify-content:flex-start}.styles_bhaIndicator__DQ-XS>div{align-items:center;display:flex}.styles_bhaIndicatorRight__zjldo>div{margin-left:10px}.styles_bhaIndicatorLeft__4o0L5>div{margin-right:10px}.styles_bhaIndicatorColorBit__AOi-F{background-color:#239fe6;height:10px;width:10px}.styles_bhaIndicatorColorRss__w--OQ{background-color:#dd375e;height:10px;width:10px}.styles_bhaIndicatorColorPdm__V-VSL{background-color:#c208df;height:10px;width:10px}.styles_bhaIndicatorColorOther__z6zBV{background-color:#8398a5;height:10px;width:10px}.styles_bhaIndicatorColorStabilizer__j7t46{background-color:#ff0;height:10px;width:10px}.styles_bhaIndicatorColorUr__BORpN{background-color:#4f4;height:10px;width:10px}.styles_bhaIndicatorLabel__yr4ef{font-size:.75rem;margin-left:5px}.styles_cDashboardReportAppLightTheme__3aYPR .styles_bhaIndicatorLabel__yr4ef{color:rgba(0,0,0,.54)}");export{o as default};

package/components/Drillstring/DrillstringDetail/DrillstringDetail.js

@@ -1,91 +1 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { Button, Dialog, DialogContent } from '@material-ui/core';
-import { useState, useMemo } from 'react';
-import { shape, number, string, func } from 'prop-types';
-import BHATable from '../BHATable/index.js';
-import BHAComponentDetail from '../BHAComponentDetail/index.js';
-import { convertValue } from '@corva/ui/utils';
-import styles from './styles.css.js';
-
-var DrillstringDetail = function DrillstringDetail(_ref) {
-  var _drillStringInfo$data, _drillStringInfo$data2, _drillStringInfo$data3;
-
-  var onDone = _ref.onDone,
-      drillStringInfo = _ref.drillStringInfo,
-      holeDepth = _ref.holeDepth,
-      unit = _ref.unit;
-
-  var _useState = useState(),
-      _useState2 = _slicedToArray(_useState, 2),
-      selectedComponentId = _useState2[0],
-      setSelectedComponentId = _useState2[1];
-
-  var bhaId = (_drillStringInfo$data = drillStringInfo.data) === null || _drillStringInfo$data === void 0 ? void 0 : _drillStringInfo$data.id;
-  var startDepth = Math.floor(convertValue((_drillStringInfo$data2 = drillStringInfo.data) === null || _drillStringInfo$data2 === void 0 ? void 0 : _drillStringInfo$data2.start_depth, 'length', 'ft'));
-  var bhaComponents = ((_drillStringInfo$data3 = drillStringInfo.data) === null || _drillStringInfo$data3 === void 0 ? void 0 : _drillStringInfo$data3.components) || [];
-  var selectedBHAComponent = useMemo(function () {
-    return bhaComponents.find(function (component) {
-      return component.id === selectedComponentId;
-    });
-  }, [bhaComponents, selectedComponentId]);
-  return /*#__PURE__*/jsxs("div", {
-    className: styles.detailsPane,
-    children: [/*#__PURE__*/jsxs("header", {
-      children: [/*#__PURE__*/jsx(Button, {
-        variant: "contained",
-        className: styles.detailDone,
-        onClick: onDone,
-        children: "Close"
-      }), /*#__PURE__*/jsxs("div", {
-        className: styles.detailTitleGroup,
-        children: [/*#__PURE__*/jsx("span", {
-          className: styles.detailTitle,
-          children: "BHA Details"
-        }), /*#__PURE__*/jsx("span", {
-          className: styles.detailTitleSeparator,
-          children: " \xB7 "
-        }), /*#__PURE__*/jsxs("span", {
-          className: styles.detailTitleMore,
-          children: ["BHA # ", bhaId]
-        }), /*#__PURE__*/jsx("span", {
-          className: styles.detailTitleSeparator,
-          children: " \xB7 "
-        }), /*#__PURE__*/jsx("span", {
-          className: styles.detailTitleMore,
-          children: "".concat(startDepth, " - ").concat(holeDepth, " ").concat(unit)
-        })]
-      })]
-    }), /*#__PURE__*/jsx(BHATable, {
-      components: bhaComponents,
-      onSelectComponent: function onSelectComponent(_ref2) {
-        var id = _ref2.id;
-        return setSelectedComponentId(id);
-      }
-    }), /*#__PURE__*/jsx(Dialog, {
-      open: !!selectedComponentId,
-      onClose: function onClose() {
-        return setSelectedComponentId(null);
-      },
-      scroll: "paper",
-      children: /*#__PURE__*/jsx(DialogContent, {
-        children: /*#__PURE__*/jsx(BHAComponentDetail, {
-          component: selectedBHAComponent,
-          onDone: function onDone() {
-            return setSelectedComponentId(null);
-          }
-        })
-      })
-    })]
-  });
-};
-
-DrillstringDetail.propTypes = {
-  drillStringInfo: shape().isRequired,
-  holeDepth: number.isRequired,
-  unit: string.isRequired,
-  onDone: func.isRequired
-};
-
-export default DrillstringDetail;
-//# sourceMappingURL=DrillstringDetail.js.map
+import e from"@babel/runtime/helpers/slicedToArray";import{shape as i,number as n,string as r,func as o}from"prop-types";import{useState as t,useMemo as l}from"react";import{Button as a,Dialog as d,DialogContent as s}from"@material-ui/core";import{convertValue as c}from"@corva/ui/utils";import p from"../BHATable/index.js";import m from"../BHAComponentDetail/index.js";import u from"./styles.css.js";import{jsxs as f,jsx as h}from"react/jsx-runtime";var v=function(i){var n,r,o,v=i.onDone,T=i.drillStringInfo,D=i.holeDepth,N=i.unit,A=t(),C=e(A,2),S=C[0],j=C[1],q=null===(n=T.data)||void 0===n?void 0:n.id,x=Math.floor(c(null===(r=T.data)||void 0===r?void 0:r.start_depth,"length","ft")),y=(null===(o=T.data)||void 0===o?void 0:o.components)||[],B=l((function(){return y.find((function(e){return e.id===S}))}),[y,S]);return f("div",{className:u.detailsPane,children:[f("header",{children:[h(a,{variant:"contained",className:u.detailDone,onClick:v,children:"Close"}),f("div",{className:u.detailTitleGroup,children:[h("span",{className:u.detailTitle,children:"BHA Details"}),h("span",{className:u.detailTitleSeparator,children:" · "}),f("span",{className:u.detailTitleMore,children:["BHA # ",q]}),h("span",{className:u.detailTitleSeparator,children:" · "}),h("span",{className:u.detailTitleMore,children:"".concat(x," - ").concat(D," ").concat(N)})]})]}),h(p,{components:y,onSelectComponent:function(e){var i=e.id;return j(i)}}),h(d,{open:!!S,onClose:function(){return j(null)},scroll:"paper",children:h(s,{children:h(m,{component:B,onDone:function(){return j(null)}})})})]})};v.propTypes={drillStringInfo:i().isRequired,holeDepth:n.isRequired,unit:r.isRequired,onDone:o.isRequired};export{v as default};

package/components/Drillstring/DrillstringDetail/styles.css.js

@@ -1,8 +1 @@
-import styleInject from '../../../ext-esm/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".styles_detailsPane__3EW_n header {\n  border-bottom: 1px solid #888;\n}\n\n.styles_detailTitleGroup__2Tuef {\n  padding: 12px;\n}\n\n.styles_detailTitle__aJJJN {\n  font-weight: bold;\n  font-size: 2rem;\n  margin-top: 0px;\n  color: #ccc;\n}\n\n.styles_detailTitleSeparator__21JR5 {\n  font-size: 2rem;\n  font-weight: bold;\n  margin-left: 10px;\n  margin-right: 10px;\n}\n\n.styles_detailTitleMore__21mkM {\n  font-size: 1.5rem;\n}\n\n.styles_detailDone__1RiK7 {\n  float: right;\n}\n";
-var styles = {"detailsPane":"styles_detailsPane__3EW_n","detailTitleGroup":"styles_detailTitleGroup__2Tuef","detailTitle":"styles_detailTitle__aJJJN","detailTitleSeparator":"styles_detailTitleSeparator__21JR5","detailTitleMore":"styles_detailTitleMore__21mkM","detailDone":"styles_detailDone__1RiK7"};
-styleInject(css_248z);
-
-export default styles;
-//# sourceMappingURL=styles.css.js.map
+import e from'./../../../ext-esm/style-inject/dist/style-inject.es.js';var t={detailsPane:"styles_detailsPane__Tis-d",detailTitleGroup:"styles_detailTitleGroup__71Svc",detailTitle:"styles_detailTitle__zzIr1",detailTitleSeparator:"styles_detailTitleSeparator__9vMfR",detailTitleMore:"styles_detailTitleMore__YXkV2",detailDone:"styles_detailDone__vrZYN"};e(".styles_detailsPane__Tis-d header{border-bottom:1px solid #888}.styles_detailTitleGroup__71Svc{padding:12px}.styles_detailTitle__zzIr1{color:#ccc;font-size:2rem;font-weight:700;margin-top:0}.styles_detailTitleSeparator__9vMfR{font-size:2rem;font-weight:700;margin-left:10px;margin-right:10px}.styles_detailTitleMore__YXkV2{font-size:1.5rem}.styles_detailDone__vrZYN{float:right}");export{t as default};

package/components/EditableItem/EditableItem/index.js

@@ -1,267 +1 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { makeStyles, ClickAwayListener, TextField, Tooltip, InputAdornment } from '@material-ui/core';
-import CloseIcon from '@material-ui/icons/Close';
-import { useState, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import EditIcon from '@material-ui/icons/Edit';
-import DoneIcon from '@material-ui/icons/Done';
-
-var useStyles = makeStyles(function (theme) {
-  return {
-    editableItem: {
-      width: '100%',
-      height: 36,
-      position: 'relative',
-      backgroundColor: theme.palette.background.b8,
-      '&:hover': {
-        backgroundColor: 'rgba(3, 188, 212, 0.07)'
-      },
-      '&:hover svg': {
-        visibility: 'visible'
-      }
-    },
-    editableItemActive: {
-      backgroundColor: 'rgba(3, 188, 212, 0.15)  !important'
-    },
-    value: {
-      color: theme.palette.primary.text6,
-      fontSize: '0.875rem',
-      height: '100%',
-      letterSpacing: '.13132px',
-      lineHeight: '36px',
-      overflow: 'hidden',
-      paddingLeft: 48,
-      textOverflow: 'ellipsis',
-      whiteSpace: 'nowrap',
-      width: 'calc(100% - 32px)',
-      userSelect: 'none'
-    },
-    textField: {
-      width: '100%'
-    },
-    inputRoot: {
-      height: 36,
-      paddingLeft: 48,
-      fontSize: '0.875rem'
-    },
-    inputDisabled: {
-      backgroundColor: 'unset',
-      paddingRight: 16,
-      '&::before': {
-        display: 'none'
-      },
-      pointerEvents: 'none'
-    },
-    // TODO: remove icon styles when Icon component is implemented
-    icon: {
-      boxSizing: 'content-box',
-      cursor: 'pointer',
-      color: theme.palette.primary.text6,
-      padding: 7,
-      fontSize: '1rem',
-      '&:hover': {
-        color: '#FFFFFF',
-        backgroundColor: 'rgba(51, 51, 51, 0.9)',
-        borderRadius: '50%'
-      },
-      '&:target': {
-        backgroundColor: theme.palette.background.b9
-      }
-    },
-    iconPrimary: {
-      color: theme.palette.primary.main
-    },
-    iconPrimaryDisabled: {
-      color: theme.palette.primary.main,
-      opacity: 0.4,
-      cursor: 'default',
-      pointerEvents: 'none'
-    },
-    iconClose: {
-      fill: "".concat(theme.palette.primary.text6, " !important"),
-      '&:hover': {
-        fill: '#FFFFFF !important'
-      }
-    },
-    iconEdit: {
-      position: 'absolute',
-      right: 4,
-      top: 3,
-      visibility: 'hidden'
-    },
-    inputAdornment: {
-      marginTop: 1,
-      marginRight: 4
-    }
-  };
-});
-
-var EditableItem = function EditableItem(_ref) {
-  var className = _ref.className,
-      isEditable = _ref.isEditable,
-      isEditingInitial = _ref.isEditing,
-      onClick = _ref.onClick,
-      onClickAway = _ref.onClickAway,
-      onCancel = _ref.onCancel,
-      onSave = _ref.onSave,
-      initialValue = _ref.value;
-
-  var _useState = useState(initialValue),
-      _useState2 = _slicedToArray(_useState, 2),
-      value = _useState2[0],
-      setValue = _useState2[1];
-
-  var _useState3 = useState(isEditingInitial),
-      _useState4 = _slicedToArray(_useState3, 2),
-      isEditing = _useState4[0],
-      setIsEditing = _useState4[1];
-
-  var classes = useStyles();
-
-  var handleSave = function handleSave(e) {
-    e.stopPropagation();
-    if (!value.length) return;
-    if (value !== initialValue) onSave(value).then(function () {
-      return setIsEditing(false);
-    });
-  };
-
-  useEffect(function () {
-    var handleKeyDown = function handleKeyDown(e) {
-      if (e.key === 'Escape' || e.key === 'Esc') {
-        setValue(initialValue);
-        setIsEditing(false);
-        onClickAway();
-      } else if (e.key === 'Enter') {
-        handleSave(e);
-      }
-    };
-
-    if (isEditing) {
-      document.addEventListener('keydown', handleKeyDown);
-    }
-
-    return function () {
-      return document.removeEventListener('keydown', handleKeyDown);
-    };
-  }, [isEditing, initialValue, value]);
-
-  var handleClickAway = function handleClickAway() {
-    setValue(initialValue);
-    setIsEditing(false);
-    onClickAway();
-  };
-
-  var handleCancel = function handleCancel(e) {
-    e.stopPropagation();
-    setValue(initialValue);
-    setIsEditing(false);
-    onCancel();
-  };
-
-  useEffect(function () {
-    setValue(initialValue);
-  }, [initialValue]);
-
-  var handleChange = function handleChange(e) {
-    e.stopPropagation();
-    setValue(e.target.value);
-  };
-
-  var handleEdit = function handleEdit(e) {
-    e.stopPropagation();
-    setIsEditing(true);
-  };
-
-  var getInputAdornment = function getInputAdornment() {
-    if (!isEditing) return null;
-    return /*#__PURE__*/jsx(InputAdornment, {
-      position: "end",
-      children: /*#__PURE__*/jsxs("span", {
-        className: classes.inputAdornment,
-        children: [/*#__PURE__*/jsx(Tooltip, {
-          title: "Cancel",
-          placement: "bottom-end",
-          children: /*#__PURE__*/jsx(CloseIcon, {
-            className: classNames(classes.icon, classes.iconClose),
-            onClick: handleCancel,
-            fontSize: "small"
-          })
-        }), /*#__PURE__*/jsx(Tooltip, {
-          title: "Save",
-          placement: "bottom-end",
-          children: /*#__PURE__*/jsx(DoneIcon, {
-            color: value === initialValue ? 'disabled' : 'primary',
-            onClick: handleSave,
-            fontSize: "small",
-            disabled: value === initialValue,
-            classes: {
-              root: classes.icon,
-              colorPrimary: classes.iconPrimary,
-              colorDisabled: classes.iconPrimaryDisabled
-            }
-          })
-        })]
-      })
-    });
-  };
-
-  var editableInputClassName = classNames(classes.editableItem, _defineProperty({}, classes.editableItemActive, isEditing), className);
-  return /*#__PURE__*/jsxs("div", {
-    className: editableInputClassName,
-    onClick: onClick,
-    children: [!isEditing && /*#__PURE__*/jsx("div", {
-      className: classes.value,
-      children: value
-    }), isEditing && /*#__PURE__*/jsx(ClickAwayListener, {
-      onClickAway: handleClickAway,
-      children: /*#__PURE__*/jsx(TextField, {
-        autoFocus: true,
-        type: "text",
-        value: value,
-        onChange: handleChange,
-        placeholder: "Page Name...",
-        className: classes.textField,
-        InputProps: {
-          classes: {
-            root: classes.inputRoot
-          },
-          endAdornment: getInputAdornment()
-        }
-      })
-    }), isEditable && !isEditing && /*#__PURE__*/jsx(Tooltip, {
-      title: "Rename Page",
-      placement: "bottom-end",
-      children: /*#__PURE__*/jsx(EditIcon, {
-        className: classNames(classes.icon, classes.iconEdit),
-        onClick: handleEdit,
-        fontSize: "small"
-      })
-    })]
-  });
-};
-
-EditableItem.propTypes = {
-  className: PropTypes.string,
-  isEditable: PropTypes.bool,
-  isEditing: PropTypes.bool,
-  onClick: PropTypes.func,
-  onSave: PropTypes.func.isRequired,
-  onClickAway: PropTypes.func,
-  onCancel: PropTypes.func,
-  value: PropTypes.string.isRequired
-};
-EditableItem.defaultProps = {
-  className: '',
-  isEditable: true,
-  isEditing: false,
-  onClick: function onClick() {},
-  onClickAway: function onClickAway() {},
-  onCancel: function onCancel() {}
-};
-
-export default EditableItem;
-//# sourceMappingURL=index.js.map
+import e from"@babel/runtime/helpers/defineProperty";import i from"@babel/runtime/helpers/slicedToArray";import{useState as o,useEffect as t}from"react";import n from"prop-types";import r from"classnames";import{makeStyles as a,ClickAwayListener as l,TextField as c,Tooltip as s,InputAdornment as d}from"@material-ui/core";import p from"@material-ui/icons/Edit";import m from"@material-ui/icons/Close";import u from"@material-ui/icons/Done";import{jsxs as f,jsx as b}from"react/jsx-runtime";var g=a((function(e){return{editableItem:{width:"100%",height:36,position:"relative",backgroundColor:e.palette.background.b8,"&:hover":{backgroundColor:"rgba(3, 188, 212, 0.07)"},"&:hover svg":{visibility:"visible"}},editableItemActive:{backgroundColor:"rgba(3, 188, 212, 0.15)  !important"},value:{color:e.palette.primary.text6,fontSize:"0.875rem",height:"100%",letterSpacing:".13132px",lineHeight:"36px",overflow:"hidden",paddingLeft:48,textOverflow:"ellipsis",whiteSpace:"nowrap",width:"calc(100% - 32px)",userSelect:"none"},textField:{width:"100%"},inputRoot:{height:36,paddingLeft:48,fontSize:"0.875rem"},inputDisabled:{backgroundColor:"unset",paddingRight:16,"&::before":{display:"none"},pointerEvents:"none"},icon:{boxSizing:"content-box",cursor:"pointer",color:e.palette.primary.text6,padding:7,fontSize:"1rem","&:hover":{color:"#FFFFFF",backgroundColor:"rgba(51, 51, 51, 0.9)",borderRadius:"50%"},"&:target":{backgroundColor:e.palette.background.b9}},iconPrimary:{color:e.palette.primary.main},iconPrimaryDisabled:{color:e.palette.primary.main,opacity:.4,cursor:"default",pointerEvents:"none"},iconClose:{fill:"".concat(e.palette.primary.text6," !important"),"&:hover":{fill:"#FFFFFF !important"}},iconEdit:{position:"absolute",right:4,top:3,visibility:"hidden"},inputAdornment:{marginTop:1,marginRight:4}}})),h=function(n){var a=n.className,h=n.isEditable,v=n.isEditing,y=n.onClick,C=n.onClickAway,k=n.onCancel,E=n.onSave,F=n.value,x=o(F),P=i(x,2),w=P[0],S=P[1],A=o(v),N=i(A,2),R=N[0],z=N[1],D=g(),I=function(e){e.stopPropagation(),w.length&&w!==F&&E(w).then((function(){return z(!1)}))};t((function(){var e=function(e){"Escape"===e.key||"Esc"===e.key?(S(F),z(!1),C()):"Enter"===e.key&&I(e)};return R&&document.addEventListener("keydown",e),function(){return document.removeEventListener("keydown",e)}}),[R,F,w]);var L=function(e){e.stopPropagation(),S(F),z(!1),k()};t((function(){S(F)}),[F]);var T=r(D.editableItem,e({},D.editableItemActive,R),a);return f("div",{className:T,onClick:y,children:[!R&&b("div",{className:D.value,children:w}),R&&b(l,{onClickAway:function(){S(F),z(!1),C()},children:b(c,{autoFocus:!0,type:"text",value:w,onChange:function(e){e.stopPropagation(),S(e.target.value)},placeholder:"Page Name...",className:D.textField,InputProps:{classes:{root:D.inputRoot},endAdornment:R?b(d,{position:"end",children:f("span",{className:D.inputAdornment,children:[b(s,{title:"Cancel",placement:"bottom-end",children:b(m,{className:r(D.icon,D.iconClose),onClick:L,fontSize:"small"})}),b(s,{title:"Save",placement:"bottom-end",children:b(u,{color:w===F?"disabled":"primary",onClick:I,fontSize:"small",disabled:w===F,classes:{root:D.icon,colorPrimary:D.iconPrimary,colorDisabled:D.iconPrimaryDisabled}})})]})}):null}})}),h&&!R&&b(s,{title:"Rename Page",placement:"bottom-end",children:b(p,{className:r(D.icon,D.iconEdit),onClick:function(e){e.stopPropagation(),z(!0)},fontSize:"small"})})]})};h.propTypes={className:n.string,isEditable:n.bool,isEditing:n.bool,onClick:n.func,onSave:n.func.isRequired,onClickAway:n.func,onCancel:n.func,value:n.string.isRequired},h.defaultProps={className:"",isEditable:!0,isEditing:!1,onClick:function(){},onClickAway:function(){},onCancel:function(){}};export{h as default};

package/components/EditableItem/EditableItemWithBadge/index.js

@@ -1,50 +1 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { jsx } from 'react/jsx-runtime';
-import { makeStyles } from '@material-ui/core';
-import PropTypes from 'prop-types';
-import EditableItem from '../EditableItem/index.js';
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-var useStyles = makeStyles(function (theme) {
-  return {
-    root: {
-      cursor: 'pointer'
-    },
-    isSelected: {
-      '& > div': {
-        color: '#FFFFFF'
-      },
-      backgroundColor: 'rgba(3, 188, 212, 0.15)  !important',
-      '&::before': {
-        height: '100%',
-        width: 4,
-        backgroundColor: theme.palette.primary.main,
-        position: 'absolute',
-        content: '""',
-        borderRadius: '4px 0 0 4px',
-        zIndex: 1
-      }
-    }
-  };
-});
-
-var EditableItemWithBadge = function EditableItemWithBadge(props) {
-  var isSelected = props.isSelected;
-  var classes = useStyles();
-  return /*#__PURE__*/jsx(EditableItem, _objectSpread(_objectSpread({}, props), {}, {
-    className: isSelected ? classes.isSelected : classes.root
-  }));
-};
-
-EditableItemWithBadge.propTypes = {
-  isSelected: PropTypes.bool,
-  children: PropTypes.node.isRequired
-};
-EditableItemWithBadge.defaultProps = {
-  isSelected: false
-};
-
-export default EditableItemWithBadge;
-//# sourceMappingURL=index.js.map
+import e from"@babel/runtime/helpers/defineProperty";import{makeStyles as r}from"@material-ui/core";import t from"prop-types";import o from"../EditableItem/index.js";import{jsx as i}from"react/jsx-runtime";function n(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);r&&(o=o.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,o)}return t}function c(r){for(var t=1;t<arguments.length;t++){var o=null!=arguments[t]?arguments[t]:{};t%2?n(Object(o),!0).forEach((function(t){e(r,t,o[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(o)):n(Object(o)).forEach((function(e){Object.defineProperty(r,e,Object.getOwnPropertyDescriptor(o,e))}))}return r}var p=r((function(e){return{root:{cursor:"pointer"},isSelected:{"& > div":{color:"#FFFFFF"},backgroundColor:"rgba(3, 188, 212, 0.15)  !important","&::before":{height:"100%",width:4,backgroundColor:e.palette.primary.main,position:"absolute",content:'""',borderRadius:"4px 0 0 4px",zIndex:1}}}})),s=function(e){var r=e.isSelected,t=p();return i(o,c(c({},e),{},{className:r?t.isSelected:t.root}))};s.propTypes={isSelected:t.bool,children:t.node.isRequired},s.defaultProps={isSelected:!1};export{s as default};