@corva/ui 3.1.0-rc.4 → 3.1.0-rc.5

package/components/Search/effects/useAutocompleteOptions.js

@@ -1 +1,50 @@
-import r from"@babel/runtime/helpers/slicedToArray";import{useState as t,useCallback as o,useEffect as e}from"react";import{isEmpty as n,sortBy as i,isEqual as u}from"lodash";import{getFormattedOptions as p}from"../utils/getFormattedOptions.js";var s=function(s){var a=s.value,l=s.options,m=s.groups,c=s.selectedGroup,d=s.isPrioritizedSelectedOptions,f=t(l),h=r(f,2),v=h[0],g=h[1],A=(null==l?void 0:l.some((function(r){return r.group})))||!n(m),O=p(l,A,c),y=o((function(r){if(!Array.isArray(r))return O;var t=new Set(r.map((function(r){return r.id})));return i(O,(function(r){return!t.has(r.id)}))}),[O.length]);return e((function(){d?g(y(a)):u(O,v)||g(O)}),[O]),{autocompleteOptions:v,handleAutocompleOptionsUpdate:function(){d&&g(y(a))},isGrouped:A}};export{s as useAutocompletOptions};
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { useState, useCallback, useEffect } from 'react';
+import { isEmpty, sortBy, isEqual } from 'lodash';
+import { getFormattedOptions } from '../utils/getFormattedOptions.js';
+
+var useAutocompletOptions = function useAutocompletOptions(_ref) {
+  var value = _ref.value,
+    options = _ref.options,
+    groups = _ref.groups,
+    selectedGroup = _ref.selectedGroup,
+    isPrioritizedSelectedOptions = _ref.isPrioritizedSelectedOptions;
+  var _useState = useState(options),
+    _useState2 = _slicedToArray(_useState, 2),
+    autocompleteOptions = _useState2[0],
+    setAutocompleteOptions = _useState2[1];
+  var isGrouped = (options === null || options === void 0 ? void 0 : options.some(function (option) {
+    return option.group;
+  })) || !isEmpty(groups);
+  var formattedOptions = getFormattedOptions(options, isGrouped, selectedGroup);
+  var getSortedOptions = useCallback(function (valueToSortBy) {
+    if (!Array.isArray(valueToSortBy)) return formattedOptions;
+    var selectedIds = new Set(valueToSortBy.map(function (item) {
+      return item.id;
+    }));
+    return sortBy(formattedOptions, function (option) {
+      return !selectedIds.has(option.id);
+    });
+  }, [formattedOptions.length]);
+  var handleAutocompleOptionsUpdate = function handleAutocompleOptionsUpdate() {
+    if (!isPrioritizedSelectedOptions) return;
+    setAutocompleteOptions(getSortedOptions(value));
+  };
+  useEffect(function () {
+    if (isPrioritizedSelectedOptions) {
+      setAutocompleteOptions(getSortedOptions(value));
+      return;
+    }
+    if (!isEqual(formattedOptions, autocompleteOptions)) {
+      setAutocompleteOptions(formattedOptions);
+    }
+  }, [formattedOptions]);
+  return {
+    autocompleteOptions: autocompleteOptions,
+    handleAutocompleOptionsUpdate: handleAutocompleOptionsUpdate,
+    isGrouped: isGrouped
+  };
+};
+
+export { useAutocompletOptions };
+//# sourceMappingURL=useAutocompleteOptions.js.map

package/components/Search/effects/useAutocompleteOptions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAutocompleteOptions.js","sources":["../../../../src/components/Search/effects/useAutocompleteOptions.js"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react';\nimport { isEmpty, isEqual, sortBy } from 'lodash';\n\nimport { getFormattedOptions } from '../utils';\n\nexport const useAutocompletOptions = ({\n  value,\n  options,\n  groups,\n  selectedGroup,\n  isPrioritizedSelectedOptions,\n}) => {\n  const [autocompleteOptions, setAutocompleteOptions] = useState(options);\n\n  const isGrouped = options?.some(option => option.group) || !isEmpty(groups);\n  const formattedOptions = getFormattedOptions(options, isGrouped, selectedGroup);\n\n  const getSortedOptions = useCallback(\n    valueToSortBy => {\n      if (!Array.isArray(valueToSortBy)) return formattedOptions;\n      const selectedIds = new Set(valueToSortBy.map(item => item.id));\n      return sortBy(formattedOptions, option => !selectedIds.has(option.id));\n    },\n    [formattedOptions.length]\n  );\n\n  const handleAutocompleOptionsUpdate = () => {\n    if (!isPrioritizedSelectedOptions) return;\n    setAutocompleteOptions(getSortedOptions(value));\n  };\n\n  useEffect(() => {\n    if (isPrioritizedSelectedOptions) {\n      setAutocompleteOptions(getSortedOptions(value));\n      return;\n    }\n    if (!isEqual(formattedOptions, autocompleteOptions)) {\n      setAutocompleteOptions(formattedOptions);\n    }\n  }, [formattedOptions]);\n\n  return { autocompleteOptions, handleAutocompleOptionsUpdate, isGrouped };\n};\n"],"names":["useAutocompletOptions","value","options","groups","selectedGroup","isPrioritizedSelectedOptions","useState","autocompleteOptions","setAutocompleteOptions","isGrouped","some","option","group","isEmpty","formattedOptions","getFormattedOptions","getSortedOptions","useCallback","valueToSortBy","Array","isArray","selectedIds","Set","map","item","id","sortBy","has","length","handleAutocompleOptionsUpdate","useEffect","isEqual"],"mappings":";;;;;AAKaA,IAAAA,qBAAqB,GAAG,SAAxBA,qBAAqB,CAM5B,IAAA,EAAA;EAAA,IALJC,KAAK,QAALA,KAAK;AACLC,IAAAA,OAAO,QAAPA,OAAO;AACPC,IAAAA,MAAM,QAANA,MAAM;AACNC,IAAAA,aAAa,QAAbA,aAAa;AACbC,IAAAA,4BAA4B,QAA5BA,4BAA4B,CAAA;EAE5B,IAAsDC,SAAAA,GAAAA,QAAQ,CAACJ,OAAO,CAAC;AAAA,IAAA,UAAA,GAAA,cAAA,CAAA,SAAA,EAAA,CAAA,CAAA;IAAhEK,mBAAmB,GAAA,UAAA,CAAA,CAAA,CAAA;IAAEC,sBAAsB,GAAA,UAAA,CAAA,CAAA,CAAA,CAAA;AAElD,EAAA,IAAMC,SAAS,GAAG,CAAAP,OAAO,KAAPA,IAAAA,IAAAA,OAAO,KAAPA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,OAAO,CAAEQ,IAAI,CAAC,UAAAC,MAAM,EAAA;IAAA,OAAIA,MAAM,CAACC,KAAK,CAAA;AAAA,GAAA,CAAC,KAAI,CAACC,OAAO,CAACV,MAAM,CAAC,CAAA;EAC3E,IAAMW,gBAAgB,GAAGC,mBAAmB,CAACb,OAAO,EAAEO,SAAS,EAAEL,aAAa,CAAC,CAAA;AAE/E,EAAA,IAAMY,gBAAgB,GAAGC,WAAW,CAClC,UAAAC,aAAa,EAAI;IACf,IAAI,CAACC,KAAK,CAACC,OAAO,CAACF,aAAa,CAAC,EAAE,OAAOJ,gBAAgB,CAAA;IAC1D,IAAMO,WAAW,GAAG,IAAIC,GAAG,CAACJ,aAAa,CAACK,GAAG,CAAC,UAAAC,IAAI,EAAA;MAAA,OAAIA,IAAI,CAACC,EAAE,CAAA;AAAA,KAAA,CAAC,CAAC,CAAA;AAC/D,IAAA,OAAOC,MAAM,CAACZ,gBAAgB,EAAE,UAAAH,MAAM,EAAA;MAAA,OAAI,CAACU,WAAW,CAACM,GAAG,CAAChB,MAAM,CAACc,EAAE,CAAC,CAAA;KAAC,CAAA,CAAA;AACxE,GAAC,EACD,CAACX,gBAAgB,CAACc,MAAM,CAAC,CAC1B,CAAA;AAED,EAAA,IAAMC,6BAA6B,GAAG,SAAhCA,6BAA6B,GAAS;IAC1C,IAAI,CAACxB,4BAA4B,EAAE,OAAA;AACnCG,IAAAA,sBAAsB,CAACQ,gBAAgB,CAACf,KAAK,CAAC,CAAC,CAAA;GAChD,CAAA;AAED6B,EAAAA,SAAS,CAAC,YAAM;AACd,IAAA,IAAIzB,4BAA4B,EAAE;AAChCG,MAAAA,sBAAsB,CAACQ,gBAAgB,CAACf,KAAK,CAAC,CAAC,CAAA;AAC/C,MAAA,OAAA;AACF,KAAA;AACA,IAAA,IAAI,CAAC8B,OAAO,CAACjB,gBAAgB,EAAEP,mBAAmB,CAAC,EAAE;MACnDC,sBAAsB,CAACM,gBAAgB,CAAC,CAAA;AAC1C,KAAA;AACF,GAAC,EAAE,CAACA,gBAAgB,CAAC,CAAC,CAAA;EAEtB,OAAO;AAAEP,IAAAA,mBAAmB,EAAnBA,mBAAmB;AAAEsB,IAAAA,6BAA6B,EAA7BA,6BAA6B;AAAEpB,IAAAA,SAAS,EAATA,SAAAA;GAAW,CAAA;AAC1E;;;;"}

package/components/Search/styles.js

@@ -1 +1,189 @@
-import{makeStyles as t}from"@material-ui/core";var i=t((function(t){var i=t.palette;return{searchInput:{"& .MuiInputAdornment-positionStart":{marginRight:4},"&::before":{borderColor:i.primary.text9},"&:hover $popupIndicator svg > path":{stroke:i.primary.contrastText,fill:i.primary.contrastText},"&:hover .MuiInputAdornment-root svg path":{fill:"".concat(i.primary.contrastText," !important")},"&:hover .MuiInput-underline:not(.Mui-disabled):before":{borderBottom:"2px solid ".concat(i.primary.contrastText," !important")},"& .Mui-focused .MuiInputAdornment-positionStart svg path":{fill:"".concat(i.primary.main," !important")}},popper:{top:"4px !important"},popupIndicator:{right:4,height:0,padding:0,"& span > span":{width:16,height:24},"& span > span > svg":{width:16,height:16},"& svg > path":{stroke:i.primary.text6,fill:i.primary.text6},"&:hover":{backgroundColor:"transparent"}},popupIndicatorOpen:{padding:0,color:i.primary.main,transform:"unset",height:0,"& span > span > svg":{transform:"rotate(180deg)"},"& svg > path":{stroke:"".concat(i.primary.main," !important"),fill:"".concat(i.primary.main," !important")}},label:{textAlign:"center",fontStyle:"italic",fontSize:12,fontWeight:400},listbox:{maxHeight:160,position:"relative",padding:0},inputExpanded:{width:"auto",minWidth:30},inputShrinked:{width:0,minWidth:"0 !important",flexGrow:0},searchIcon:{fill:"".concat(i.primary.text6," !important"),width:"24px",height:"24px"},closeIcon:{fill:"".concat(i.primary.text6," !important"),"&:hover":{fill:"".concat(i.primary.contrastText," !important")}},iconButton:{padding:"0px !important","&:hover":{backgroundColor:"transparent",backdropFilter:"none"}},option:{display:"flex","&.large":{padding:"9px 0"}},group:{padding:"4px 0"},optionLabelContainer:{flexGrow:1,minWidth:0},groupChip:{margin:"0 16px 4px",color:i.primary.text6,border:"1px solid ".concat(i.primary.text9),fontSize:14,"&:hover":{backgroundColor:"initial"}},selectedGroup:{padding:"4px 2px",marginRight:8,color:i.primary.text6,border:"1px solid ".concat(i.primary.text9),height:20,fontSize:14,"& .MuiChip-label":{padding:"0px 0px 0px 8px"}},selectedGroupLabel:{display:"flex",alignItems:"center"},removeIcon:{fontSize:"16px",margin:"0 4px",cursor:"pointer"},removeIconWithDropdown:{marginRight:20,zIndex:1},checkbox:{padding:"0 8px 0 0","&:hover":{backgroundColor:"initial !important"}},selectAllCheckbox:{margin:0,height:54,width:"100%",borderBottom:"1px solid ".concat(i.primary.text9),padding:"16px 8px 8px 8px","& .MuiCheckbox-root .MuiSvgIcon-root":{fontSize:"20px !important"},"& .Mui-checked:hover, & .MuiCheckbox-indeterminate:hover":{backgroundColor:"initial !important"},"& .Mui-checked:active, & .MuiCheckbox-indeterminate:active":{backgroundColor:"initial !important"}},selectedLabel:{maxWidth:124},selectedLabelExpanded:{maxWidth:"unset",flexGrow:1},menuItem:{padding:0,"&:hover":{backgroundColor:"initial"}},endAdornment:{marginLeft:0}}}));export{i as default};
+import { makeStyles } from '@material-ui/core';
+
+var useStyles = makeStyles(function (_ref) {
+  var palette = _ref.palette;
+  return {
+    searchInput: {
+      '& .MuiInputAdornment-positionStart': {
+        marginRight: 4
+      },
+      '&::before': {
+        borderColor: palette.primary.text9
+      },
+      '&:hover $popupIndicator svg > path': {
+        stroke: palette.primary.contrastText,
+        fill: palette.primary.contrastText
+      },
+      '&:hover .MuiInputAdornment-root svg path': {
+        fill: "".concat(palette.primary.contrastText, " !important")
+      },
+      '&:hover .MuiInput-underline:not(.Mui-disabled):before': {
+        borderBottom: "2px solid ".concat(palette.primary.contrastText, " !important")
+      },
+      '& .Mui-focused .MuiInputAdornment-positionStart svg path': {
+        fill: "".concat(palette.primary.main, " !important")
+      }
+    },
+    popper: {
+      top: '4px !important'
+    },
+    popupIndicator: {
+      right: 4,
+      height: 0,
+      padding: 0,
+      '& span > span': {
+        width: 16,
+        height: 24
+      },
+      '& span > span > svg': {
+        width: 16,
+        height: 16
+      },
+      '& svg > path': {
+        stroke: palette.primary.text6,
+        fill: palette.primary.text6
+      },
+      '&:hover': {
+        backgroundColor: 'transparent'
+      }
+    },
+    popupIndicatorOpen: {
+      padding: 0,
+      color: palette.primary.main,
+      transform: 'unset',
+      height: 0,
+      '& span > span > svg': {
+        transform: 'rotate(180deg)'
+      },
+      '& svg > path': {
+        stroke: "".concat(palette.primary.main, " !important"),
+        fill: "".concat(palette.primary.main, " !important")
+      }
+    },
+    label: {
+      textAlign: 'center',
+      fontStyle: 'italic',
+      fontSize: 12,
+      fontWeight: 400
+    },
+    listbox: {
+      maxHeight: 160,
+      position: 'relative',
+      padding: 0
+    },
+    inputExpanded: {
+      width: 'auto',
+      minWidth: 30
+    },
+    inputShrinked: {
+      width: 0,
+      minWidth: '0 !important',
+      flexGrow: 0
+    },
+    searchIcon: {
+      fill: "".concat(palette.primary.text6, " !important"),
+      width: '24px',
+      height: '24px'
+    },
+    closeIcon: {
+      fill: "".concat(palette.primary.text6, " !important"),
+      '&:hover': {
+        fill: "".concat(palette.primary.contrastText, " !important")
+      }
+    },
+    iconButton: {
+      padding: '0px !important',
+      '&:hover': {
+        backgroundColor: 'transparent',
+        backdropFilter: 'none'
+      }
+    },
+    option: {
+      display: 'flex',
+      '&.large': {
+        padding: '9px 0'
+      }
+    },
+    group: {
+      padding: '4px 0'
+    },
+    optionLabelContainer: {
+      flexGrow: 1,
+      minWidth: 0
+    },
+    groupChip: {
+      margin: '0 16px 4px',
+      color: palette.primary.text6,
+      border: "1px solid ".concat(palette.primary.text9),
+      fontSize: 14,
+      '&:hover': {
+        backgroundColor: 'initial'
+      }
+    },
+    selectedGroup: {
+      padding: '4px 2px',
+      marginRight: 8,
+      color: palette.primary.text6,
+      border: "1px solid ".concat(palette.primary.text9),
+      height: 20,
+      fontSize: 14,
+      '& .MuiChip-label': {
+        padding: '0px 0px 0px 8px'
+      }
+    },
+    selectedGroupLabel: {
+      display: 'flex',
+      alignItems: 'center'
+    },
+    removeIcon: {
+      fontSize: '16px',
+      margin: '0 4px',
+      cursor: 'pointer'
+    },
+    removeIconWithDropdown: {
+      marginRight: 20,
+      zIndex: 1
+    },
+    checkbox: {
+      padding: '0 8px 0 0',
+      '&:hover': {
+        backgroundColor: 'initial !important'
+      }
+    },
+    selectAllCheckbox: {
+      margin: 0,
+      height: 54,
+      width: '100%',
+      borderBottom: "1px solid ".concat(palette.primary.text9),
+      padding: '16px 8px 8px 8px',
+      '& .MuiCheckbox-root .MuiSvgIcon-root': {
+        fontSize: '20px !important'
+      },
+      '& .Mui-checked:hover, & .MuiCheckbox-indeterminate:hover': {
+        backgroundColor: 'initial !important'
+      },
+      '& .Mui-checked:active, & .MuiCheckbox-indeterminate:active': {
+        backgroundColor: 'initial !important'
+      }
+    },
+    selectedLabel: {
+      maxWidth: 124
+    },
+    selectedLabelExpanded: {
+      maxWidth: 'unset',
+      flexGrow: 1
+    },
+    menuItem: {
+      padding: 0,
+      '&:hover': {
+        backgroundColor: 'initial'
+      }
+    },
+    endAdornment: {
+      marginLeft: 0
+    }
+  };
+});
+
+export { useStyles as default };
+//# sourceMappingURL=styles.js.map

package/components/Search/utils/getFormattedOptions.js

@@ -1 +1,16 @@
-import{isEmpty as o}from"lodash";var r=function(r,n,t){var i=null==r?void 0:r.sort((function(o,r){var n,t;return null===(n=r.group)||void 0===n?void 0:n.toString().localeCompare(null===(t=o.group)||void 0===t?void 0:t.toString())}));return n&&o(t)?i:o(t)?r:null==r?void 0:r.filter((function(o){return o.group===t.name}))};export{r as getFormattedOptions};
+import { isEmpty } from 'lodash';
+
+var getFormattedOptions = function getFormattedOptions(options, isGroupped, selectedGroup) {
+  var sortedOptionsByGroup = options === null || options === void 0 ? void 0 : options.sort(function (curr, next) {
+    var _next$group, _curr$group;
+    return (_next$group = next.group) === null || _next$group === void 0 ? void 0 : _next$group.toString().localeCompare((_curr$group = curr.group) === null || _curr$group === void 0 ? void 0 : _curr$group.toString());
+  });
+  if (isGroupped && isEmpty(selectedGroup)) return sortedOptionsByGroup;
+  if (!isEmpty(selectedGroup)) return options === null || options === void 0 ? void 0 : options.filter(function (option) {
+    return option.group === selectedGroup.name;
+  });
+  return options;
+};
+
+export { getFormattedOptions };
+//# sourceMappingURL=getFormattedOptions.js.map

package/components/Search/utils/getFormattedOptions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getFormattedOptions.js","sources":["../../../../src/components/Search/utils/getFormattedOptions.ts"],"sourcesContent":["import { isEmpty } from 'lodash';\n\nexport const getFormattedOptions = (options, isGroupped, selectedGroup) => {\n  const sortedOptionsByGroup = options?.sort((curr, next) =>\n    next.group?.toString().localeCompare(curr.group?.toString())\n  );\n  if (isGroupped && isEmpty(selectedGroup)) return sortedOptionsByGroup;\n\n  if (!isEmpty(selectedGroup))\n    return options?.filter(option => option.group === selectedGroup.name);\n\n  return options;\n};\n"],"names":["getFormattedOptions","options","isGroupped","selectedGroup","sortedOptionsByGroup","sort","curr","next","group","toString","localeCompare","isEmpty","filter","option","name"],"mappings":";;AAEO,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAmB,CAAIC,OAAO,EAAEC,UAAU,EAAEC,aAAa,EAAK;AACzE,EAAA,IAAMC,oBAAoB,GAAGH,OAAO,KAAA,IAAA,IAAPA,OAAO,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAPA,OAAO,CAAEI,IAAI,CAAC,UAACC,IAAI,EAAEC,IAAI,EAAA;AAAA,IAAA,IAAA,WAAA,EAAA,WAAA,CAAA;AAAA,IAAA,OAAA,CAAA,WAAA,GACpDA,IAAI,CAACC,KAAK,MAAV,IAAA,IAAA,WAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAYC,QAAQ,EAAE,CAACC,aAAa,CAAA,CAAA,WAAA,GAACJ,IAAI,CAACE,KAAK,gDAAV,WAAYC,CAAAA,QAAQ,EAAE,CAAC,CAAA;GAC7D,CAAA,CAAA;EACD,IAAIP,UAAU,IAAIS,OAAO,CAACR,aAAa,CAAC,EAAE,OAAOC,oBAAoB,CAAA;AAErE,EAAA,IAAI,CAACO,OAAO,CAACR,aAAa,CAAC,EACzB,OAAOF,OAAO,KAAPA,IAAAA,IAAAA,OAAO,uBAAPA,OAAO,CAAEW,MAAM,CAAC,UAAAC,MAAM,EAAA;AAAA,IAAA,OAAIA,MAAM,CAACL,KAAK,KAAKL,aAAa,CAACW,IAAI,CAAA;GAAC,CAAA,CAAA;AAEvE,EAAA,OAAOb,OAAO,CAAA;AAChB;;;;"}

package/components/Search/utils/truncate.js

@@ -1 +1,10 @@
-var r=function(r,a){var c=a.maxChars,t=a.charsNumFromStart,n=a.charsNumFromEnd;return r.length>c?"".concat(r.slice(0,t),"...").concat(r.slice(r.length-n)):r};export{r as truncateString};
+var truncateString = function truncateString(label, truncateOptions) {
+  var maxChars = truncateOptions.maxChars,
+    charsNumFromStart = truncateOptions.charsNumFromStart,
+    charsNumFromEnd = truncateOptions.charsNumFromEnd;
+  if (label.length > maxChars) return "".concat(label.slice(0, charsNumFromStart), "...").concat(label.slice(label.length - charsNumFromEnd));
+  return label;
+};
+
+export { truncateString };
+//# sourceMappingURL=truncate.js.map

package/components/SearchInput/index.js

@@ -1 +1,90 @@
-import r from"@babel/runtime/helpers/slicedToArray";import{useState as e,useCallback as a}from"react";import{debounce as o}from"lodash";import{makeStyles as t,Paper as i,InputBase as n}from"@material-ui/core";import c from"@material-ui/icons/Search";import s from"@material-ui/icons/Close";import l from"prop-types";import m from"classnames";import{jsxs as p,jsx as h}from"react/jsx-runtime";var u=t((function(r){return{root:{display:"flex",alignItems:"center",height:30,paddingLeft:19,borderRadius:30,boxShadow:"none","&:focus-within":{boxShadow:"inset 0 0 0 2px ".concat(r.palette.primary.main)}},input:{flex:1,fontFamily:"Roboto",fontSize:14,fontWeight:200},searchIcon:{height:16,width:16,color:r.palette.primary.contrastText,marginRight:9},closeIcon:{height:16,width:16,margin:"0 10px",color:r.palette.primary.text6,cursor:"pointer"}}}));function f(t){var l=t.handleSearch,f=t.className,d=u(),g=e(""),x=r(g,2),y=x[0],b=x[1],N=a(o(l,500),[]);return p(i,{className:m(d.root,f),children:[h(c,{className:d.searchIcon}),h(n,{className:d.input,placeholder:"Search ...",value:y,inputProps:{"aria-label":"search"},onChange:function(r){return e=r.target.value,b(e),void N(e);var e}}),y&&h(s,{className:d.closeIcon,onClick:function(){l(""),b("")}})]})}f.propTypes={handleSearch:l.func.isRequired,className:l.string},f.defaultProps={className:""};export{f as default};
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { useState, useCallback } from 'react';
+import { debounce } from 'lodash';
+import { makeStyles, Paper, InputBase } from '@material-ui/core';
+import SearchIcon from '@material-ui/icons/Search';
+import CloseIcon from '@material-ui/icons/Close';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var useStyles = makeStyles(function (theme) {
+  return {
+    root: {
+      display: 'flex',
+      alignItems: 'center',
+      height: 30,
+      paddingLeft: 19,
+      borderRadius: 30,
+      boxShadow: 'none',
+      '&:focus-within': {
+        boxShadow: "inset 0 0 0 2px ".concat(theme.palette.primary.main)
+      }
+    },
+    input: {
+      flex: 1,
+      fontFamily: 'Roboto',
+      fontSize: 14,
+      fontWeight: 200
+    },
+    searchIcon: {
+      height: 16,
+      width: 16,
+      color: theme.palette.primary.contrastText,
+      marginRight: 9
+    },
+    closeIcon: {
+      height: 16,
+      width: 16,
+      margin: '0 10px',
+      color: theme.palette.primary.text6,
+      cursor: 'pointer'
+    }
+  };
+});
+function SearchInput(_ref) {
+  var handleSearch = _ref.handleSearch,
+    className = _ref.className;
+  var styles = useStyles();
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    inputValue = _useState2[0],
+    setInputValue = _useState2[1];
+  var handleChangeDebounced = useCallback(debounce(handleSearch, 500), []);
+  var handleInputChange = function handleInputChange(targetValue) {
+    setInputValue(targetValue);
+    handleChangeDebounced(targetValue);
+  };
+  return /*#__PURE__*/jsxs(Paper, {
+    className: classNames(styles.root, className),
+    children: [/*#__PURE__*/jsx(SearchIcon, {
+      className: styles.searchIcon
+    }), /*#__PURE__*/jsx(InputBase, {
+      className: styles.input,
+      placeholder: "Search ...",
+      value: inputValue,
+      inputProps: {
+        'aria-label': 'search'
+      },
+      onChange: function onChange(e) {
+        return handleInputChange(e.target.value);
+      }
+    }), inputValue && /*#__PURE__*/jsx(CloseIcon, {
+      className: styles.closeIcon,
+      onClick: function onClick() {
+        handleSearch('');
+        setInputValue('');
+      }
+    })]
+  });
+}
+SearchInput.propTypes = {
+  handleSearch: PropTypes.func.isRequired,
+  className: PropTypes.string
+};
+SearchInput.defaultProps = {
+  className: ''
+};
+
+export { SearchInput as default };
+//# sourceMappingURL=index.js.map

package/components/SearchInput/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/SearchInput/index.js"],"sourcesContent":["import { useState, useCallback } from 'react';\nimport { debounce } from 'lodash';\nimport { Paper, InputBase, makeStyles } from '@material-ui/core';\nimport SearchIcon from '@material-ui/icons/Search';\nimport CloseIcon from '@material-ui/icons/Close';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nconst useStyles = makeStyles(theme => ({\n  root: {\n    display: 'flex',\n    alignItems: 'center',\n    height: 30,\n    paddingLeft: 19,\n    borderRadius: 30,\n    boxShadow: 'none',\n    '&:focus-within': {\n      boxShadow: `inset 0 0 0 2px ${theme.palette.primary.main}`,\n    },\n  },\n  input: {\n    flex: 1,\n    fontFamily: 'Roboto',\n    fontSize: 14,\n    fontWeight: 200,\n  },\n  searchIcon: {\n    height: 16,\n    width: 16,\n    color: theme.palette.primary.contrastText,\n    marginRight: 9,\n  },\n  closeIcon: {\n    height: 16,\n    width: 16,\n    margin: '0 10px',\n    color: theme.palette.primary.text6,\n    cursor: 'pointer',\n  },\n}));\n\nfunction SearchInput({ handleSearch, className }) {\n  const styles = useStyles();\n\n  const [inputValue, setInputValue] = useState('');\n\n  const handleChangeDebounced = useCallback(debounce(handleSearch, 500), []);\n\n  const handleInputChange = targetValue => {\n    setInputValue(targetValue);\n\n    handleChangeDebounced(targetValue);\n  };\n\n  return (\n    <Paper className={classNames(styles.root, className)}>\n      <SearchIcon className={styles.searchIcon} />\n      <InputBase\n        className={styles.input}\n        placeholder=\"Search ...\"\n        value={inputValue}\n        inputProps={{ 'aria-label': 'search' }}\n        onChange={e => handleInputChange(e.target.value)}\n      />\n      {inputValue && (\n        <CloseIcon\n          className={styles.closeIcon}\n          onClick={() => {\n            handleSearch('');\n            setInputValue('');\n          }}\n        />\n      )}\n    </Paper>\n  );\n}\n\nSearchInput.propTypes = {\n  handleSearch: PropTypes.func.isRequired,\n  className: PropTypes.string,\n};\n\nSearchInput.defaultProps = {\n  className: '',\n};\n\nexport default SearchInput;\n"],"names":["useStyles","makeStyles","theme","root","display","alignItems","height","paddingLeft","borderRadius","boxShadow","palette","primary","main","input","flex","fontFamily","fontSize","fontWeight","searchIcon","width","color","contrastText","marginRight","closeIcon","margin","text6","cursor","SearchInput","handleSearch","className","styles","useState","inputValue","setInputValue","handleChangeDebounced","useCallback","debounce","handleInputChange","targetValue","_jsxs","classNames","_jsx","e","target","value","propTypes","PropTypes","func","isRequired","string","defaultProps"],"mappings":"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"}

package/components/Select/SelectFilterBy.js

@@ -1 +1,95 @@
-import{__assign as o}from'./../../ext-esm/tslib/tslib.es6.js';import{jsx as s}from"react/jsx-runtime";import{makeStyles as c,InputAdornment as i}from"@material-ui/core";import{LayersIcon as n}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 t from"./index.js";var r=c((function(o){return{emptyItem:{color:o.palette.primary.text6},formControlRoot:{"&:hover":{"& .MuiFormLabel-root":{color:o.palette.primary.text6},"& .MuiFormLabel-root.Mui-focused":{color:o.palette.primary.main}},"& .MuiFormLabel-root":{color:o.palette.primary.text6},"& .MuiSelect-filled":{paddingLeft:0},"& .MuiSelect-select:focus":{backgroundColor:"transparent"},"& .MuiFilledInput-root":{backgroundColor:"#FFFFFF10","&:hover":{backgroundColor:"#FFFFFF20"},"&.Mui-disabled":{backgroundColor:"#FFFFFF10"}}}}})),e=function(c){var e=r();return s(t,o({disableUnderline:!0,displayEmpty:!0,FormControlProps:{variant:"filled",classes:{root:e.formControlRoot}},renderValue:function(o){return o||s("span",{className:e.emptyItem,children:"None"})},startAdornment:s(i,{position:"start",children:s(n,{size:16})})},c))};export{e as SelectFilterBy};
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { makeStyles, InputAdornment } from '@material-ui/core';
+import { LayersIcon } 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 Select from './index.js';
+import { 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 useStyles = makeStyles(function (theme) {
+  return {
+    emptyItem: {
+      color: theme.palette.primary.text6
+    },
+    formControlRoot: {
+      '&:hover': {
+        '& .MuiFormLabel-root': {
+          color: theme.palette.primary.text6
+        },
+        '& .MuiFormLabel-root.Mui-focused': {
+          color: theme.palette.primary.main
+        }
+      },
+      '& .MuiFormLabel-root': {
+        color: theme.palette.primary.text6
+      },
+      '& .MuiSelect-filled': {
+        paddingLeft: 0
+      },
+      '& .MuiSelect-select:focus': {
+        backgroundColor: 'transparent'
+      },
+      '& .MuiFilledInput-root': {
+        backgroundColor: '#FFFFFF10',
+        '&:hover': {
+          backgroundColor: '#FFFFFF20'
+        },
+        '&.Mui-disabled': {
+          backgroundColor: '#FFFFFF10'
+        }
+      }
+    }
+  };
+});
+var SelectFilterBy = function SelectFilterBy(props) {
+  var classes = useStyles();
+  return /*#__PURE__*/jsx(Select, _objectSpread({
+    disableUnderline: true,
+    displayEmpty: true,
+    FormControlProps: {
+      variant: 'filled',
+      classes: {
+        root: classes.formControlRoot
+      }
+    },
+    renderValue: function renderValue(value) {
+      return value ? value : /*#__PURE__*/jsx("span", {
+        className: classes.emptyItem,
+        children: "None"
+      });
+    },
+    startAdornment: /*#__PURE__*/jsx(InputAdornment, {
+      position: "start",
+      children: /*#__PURE__*/jsx(LayersIcon, {
+        size: 16
+      })
+    })
+  }, props));
+};
+
+export { SelectFilterBy };
+//# sourceMappingURL=SelectFilterBy.js.map

package/components/Select/SelectFilterBy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectFilterBy.js","sources":["../../../src/components/Select/SelectFilterBy.tsx"],"sourcesContent":["import { InputAdornment, makeStyles } from '@material-ui/core';\nimport { LayersIcon } from '~/icons';\nimport Select from './index';\nimport { SelectProps } from './types';\n\nconst useStyles = makeStyles(theme => ({\n  emptyItem: { color: theme.palette.primary.text6 },\n  formControlRoot: {\n    '&:hover': {\n      '& .MuiFormLabel-root': { color: theme.palette.primary.text6 },\n      '& .MuiFormLabel-root.Mui-focused': { color: theme.palette.primary.main },\n    },\n    '& .MuiFormLabel-root': { color: theme.palette.primary.text6 },\n    '& .MuiSelect-filled': { paddingLeft: 0 },\n    '& .MuiSelect-select:focus': { backgroundColor: 'transparent' },\n    '& .MuiFilledInput-root': {\n      backgroundColor: '#FFFFFF10',\n      '&:hover': { backgroundColor: '#FFFFFF20' },\n      '&.Mui-disabled': { backgroundColor: '#FFFFFF10' },\n    },\n  },\n}));\n\nexport const SelectFilterBy = <T extends unknown>(props: SelectProps<T>): JSX.Element => {\n  const classes = useStyles();\n\n  return (\n    <Select\n      disableUnderline\n      displayEmpty\n      FormControlProps={{\n        variant: 'filled',\n        classes: { root: classes.formControlRoot },\n      }}\n      renderValue={(value: any) =>\n        value ? value : <span className={classes.emptyItem}>None</span>\n      }\n      startAdornment={\n        <InputAdornment position=\"start\">\n          <LayersIcon size={16} />\n        </InputAdornment>\n      }\n      {...props}\n    />\n  );\n};\n"],"names":["useStyles","makeStyles","theme","emptyItem","color","palette","primary","text6","formControlRoot","main","paddingLeft","backgroundColor","SelectFilterBy","props","classes","_jsx","variant","root","value"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,IAAMA,SAAS,GAAGC,UAAU,CAAC,UAAAC,KAAK,EAAA;EAAA,OAAK;AACrCC,IAAAA,SAAS,EAAE;AAAEC,MAAAA,KAAK,EAAEF,KAAK,CAACG,OAAO,CAACC,OAAO,CAACC,KAAAA;KAAO;AACjDC,IAAAA,eAAe,EAAE;AACf,MAAA,SAAS,EAAE;AACT,QAAA,sBAAsB,EAAE;AAAEJ,UAAAA,KAAK,EAAEF,KAAK,CAACG,OAAO,CAACC,OAAO,CAACC,KAAAA;SAAO;AAC9D,QAAA,kCAAkC,EAAE;AAAEH,UAAAA,KAAK,EAAEF,KAAK,CAACG,OAAO,CAACC,OAAO,CAACG,IAAAA;AAAK,SAAA;OACzE;AACD,MAAA,sBAAsB,EAAE;AAAEL,QAAAA,KAAK,EAAEF,KAAK,CAACG,OAAO,CAACC,OAAO,CAACC,KAAAA;OAAO;AAC9D,MAAA,qBAAqB,EAAE;AAAEG,QAAAA,WAAW,EAAE,CAAA;OAAG;AACzC,MAAA,2BAA2B,EAAE;AAAEC,QAAAA,eAAe,EAAE,aAAA;OAAe;AAC/D,MAAA,wBAAwB,EAAE;AACxBA,QAAAA,eAAe,EAAE,WAAW;AAC5B,QAAA,SAAS,EAAE;AAAEA,UAAAA,eAAe,EAAE,WAAA;SAAa;AAC3C,QAAA,gBAAgB,EAAE;AAAEA,UAAAA,eAAe,EAAE,WAAA;AAAY,SAAA;AACnD,OAAA;AACF,KAAA;GACD,CAAA;AAAA,CAAC,CAAC,CAAA;IAEUC,cAAc,GAAG,SAAjBA,cAAc,CAAuBC,KAAqB,EAAkB;EACvF,IAAMC,OAAO,GAAGd,SAAS,EAAE,CAAA;AAE3B,EAAA,oBACEe,IAAC,MAAM,EAAA,aAAA,CAAA;IACL,gBAAgB,EAAA,IAAA;IAChB,YAAY,EAAA,IAAA;AACZ,IAAA,gBAAgB,EAAE;AAChBC,MAAAA,OAAO,EAAE,QAAQ;AACjBF,MAAAA,OAAO,EAAE;QAAEG,IAAI,EAAEH,OAAO,CAACN,eAAAA;AAAgB,OAAA;KACzC;IACF,WAAW,EAAE,qBAACU,KAAU,EAAA;MAAA,OACtBA,KAAK,GAAGA,KAAK,gBAAGH,GAAA,CAAA,MAAA,EAAA;QAAM,SAAS,EAAED,OAAO,CAACX,SAAU;AAAA,QAAA,QAAA,EAAA,MAAA;OAAY,CAAA,CAAA;KAChE;IACD,cAAc,eACZY,IAAC,cAAc,EAAA;AAAC,MAAA,QAAQ,EAAC,OAAO;AAAA,MAAA,QAAA,eAC9BA,IAAC,UAAU,EAAA;AAAC,QAAA,IAAI,EAAE,EAAA;AAAG,OAAA,CAAA;AAAG,KAAA,CAAA;AAE3B,GAAA,EACGF,KAAK,CACT,CAAA,CAAA;AAEN;;;;"}