@corva/ui 0.34.0-rc.2 → 0.34.0-rc.3

package/components/AssetEditor/AssetEditorAutocomplete.js

@@ -1 +1,355 @@
-import e from"@babel/runtime/helpers/slicedToArray";import t from"@babel/runtime/helpers/defineProperty";import r from"@babel/runtime/helpers/objectWithoutProperties";import{forwardRef as n,useState as o,useEffect as i,useMemo as a}from"react";import l from"prop-types";import{debounce as s,identity as p}from"lodash";import{List as u,withStyles as d,Typography as c,FormControl as m,InputLabel as f,Tooltip as b,Chip as y,FormHelperText as g,TextField as h,InputAdornment as O}from"@material-ui/core";import{Search as v}from"@material-ui/icons";import{Autocomplete as x}from"@material-ui/lab";import T from"../TruncatedText/index.js";import{PER_PAGE as I,SCROLL_THRESHOLD as P}from"./constants.js";import{useAssetAutoCompleteSelectData as C}from"./effects/index.js";import{jsxs as j,jsx as A}from"react/jsx-runtime";var S=["children","loading","hasMore"];function M(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function q(e){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?M(Object(n),!0).forEach((function(r){t(e,r,n[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):M(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var w="DC_SingleAssetEditorAutocomplete",L={paddingLeft:"16px",height:36,listStyleType:"none",display:"flex",alignItems:"center"},D=function(e){var t=e.text;return A("li",{style:L,children:A(c,{variant:"body2",color:"textSecondary",children:void 0===t?"Loading...":t})},"loading")},N=n((function(e,t){var n=e.children,o=e.loading,i=e.hasMore,a=r(e,S);return j(u,q(q({},a),{},{ref:t,role:"listbox",children:[n,(i||o)&&A(D,{})]}))})),R=function(t){var r,n=t["data-testid"],l=t.appKey,u=t.assetType,d=t.classes,c=t.companyId,S=t.currentValue,M=t.disabled,L=t.disableClearable,R=t.errorText,V=t.isMultiple,E=t.isNullable,K=t.label,_=t.onChange,k=t.parentAssetId,z=t.parentAssetType,H=t.queryParams,B=o(V?[]:null),W=e(B,2),F=W[0],G=W[1],J=o(""),Q=e(J,2),U=Q[0],X=Q[1],Y=o(""),Z=e(Y,2),$=Z[0],ee=Z[1],te=o(!1),re=e(te,2),ne=re[0],oe=re[1],ie=o(1),ae=e(ie,2),le=ae[0],se=ae[1],pe=o(!0),ue=e(pe,2),de=ue[0],ce=ue[1];i((function(){G(V?[]:null),se(1),oe(!1)}),[u]);var me=C({appKey:l,assetType:u,companyId:c,currentValue:S,isMultiple:V,parentAssetId:k,parentAssetType:z,scrollPage:le,searchText:U,setCurrentOption:G,queryParams:H}),fe=me.assets,be=me.loading;i((function(){var e=fe.length>=I*le;ce(e)}),[fe,le]);var ye=a((function(){return s((function(e){se(1),X(e)}),200)}),[]),ge=a((function(){return s((function(){return se((function(e){return e+1}))}),250)}),[]),he={endAdornment:d.endAdornment,inputRoot:d.inputRoot,listbox:d.listbox,noOptions:d.noOptions,option:d.option,popupIndicator:d.popupIndicator,root:d.root};return j(m,{disabled:M,error:!!R,className:d.formControl,children:[!E&&A(f,{shrink:!0,children:K}),A(b,{title:null!==(r=null==F?void 0:F.name)&&void 0!==r?r:"",children:A(x,q({disabled:M,blurOnSelect:!0,classes:he,clearOnBlur:!0,clearOnEscape:!0,"data-testid":n,disableClearable:L,filterOptions:p,getOptionLabel:function(e){return null==e?void 0:e.name},getOptionSelected:function(e,t){return e&&t&&e.id===t.id},inputValue:ne?$:(null==F?void 0:F.name)||"",ListboxComponent:N,ListboxProps:{onScroll:function(e){if(de&&!be){var t=e.currentTarget;t.scrollTop+t.clientHeight>t.scrollHeight-P&&ge()}},loading:be,hasMore:de},options:fe,onChange:function(e,t){var r;G(t),_(V?t.map((function(e){return e.id})):null!==(r=null==t?void 0:t.id)&&void 0!==r?r:null,t)},onClose:function(){ee(""),X(""),oe(!1),se(1)},onInputChange:function(e,t,r){"input"===r?(ee(t),oe(!0),ye(t)):X("")},noOptionsText:A(D,{text:be?"Loading...":"No options"}),renderInput:function(e){return A(h,q(q({},e),{},{variant:"standard",placeholder:"Search for asset..."},!V&&{InputProps:q(q({},e.InputProps),{},{startAdornment:A(O,{children:A(v,{className:d.searchIcon})})})}))},renderOption:function(e){var t=e.id,r=e.name;return A(T,{"data-testid":"".concat(w,"_option_").concat(r,"MenuItem"),children:V&&S.includes(t)?"".concat(r," (already selected)"):r},t)},value:F,multiple:V},V&&{renderTags:function(e,t){return e.map((function(e,r){return A(y,q({label:null==e?void 0:e.name},t({index:r})),e.id)}))},getOptionDisabled:function(e){return S.includes(e.id)}}))}),A(g,{children:R})]})};R.defaultProps={label:"Choose An Asset",currentValue:void 0,disableClearable:!0,isNullable:!1,parentAssetId:void 0,parentAssetType:void 0,companyId:void 0,errorText:"","data-testid":"".concat(w,"_autoComplete"),disabled:!1,isMultiple:!1,appKey:null,queryParams:{}},R.propTypes={label:l.string,currentValue:l.oneOfType([l.number,l.arrayOf(l.number)]),isNullable:l.bool,onChange:l.func.isRequired,classes:l.shape({}).isRequired,disableClearable:l.bool,parentAssetId:l.number,parentAssetType:l.string,companyId:l.number,assetType:l.string.isRequired,errorText:l.string,"data-testid":l.string,disabled:l.bool,isMultiple:l.bool,appKey:l.string,queryParams:l.shape({})};var V=d((function(e){return{formControl:{},listbox:{maxHeight:350},root:{fontSize:16},inputRoot:{paddingTop:16,padding:"8px 0",paddingBottom:0,width:350,fontSize:16},popupIndicator:{display:"none"},option:{paddingLeft:"16px !important",height:36,"&[aria-disabled=true]":{color:e.palette.primary.text9,opacity:1,backgroundColor:"unset"}},noOptions:{padding:0},searchIcon:{fontSize:"20px !important"}}}))(R);export{V as default};
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { debounce, identity } from 'lodash';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { withStyles, List, FormControl, InputLabel, Tooltip, FormHelperText, Typography, TextField, InputAdornment, Chip } from '@material-ui/core';
+import { forwardRef, useState, useEffect, useMemo } from 'react';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import PropTypes from 'prop-types';
+import { Search } from '@material-ui/icons';
+import TruncatedText from '../TruncatedText/index.js';
+import { PER_PAGE, SCROLL_THRESHOLD } from './constants.js';
+import { useAssetAutoCompleteSelectData } from './effects/index.js';
+import { Autocomplete } from '@material-ui/lab';
+
+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 PAGE_NAME = 'DC_SingleAssetEditorAutocomplete';
+
+var muiStyles = function muiStyles(theme) {
+  return {
+    formControl: {},
+    listbox: {
+      maxHeight: 350
+    },
+    root: {
+      fontSize: 16
+    },
+    inputRoot: {
+      paddingTop: 16,
+      padding: '8px 0',
+      paddingBottom: 0,
+      width: 350,
+      fontSize: 16
+    },
+    popupIndicator: {
+      display: 'none'
+    },
+    option: {
+      paddingLeft: '16px !important',
+      height: 36,
+      '&[aria-disabled=true]': {
+        color: theme.palette.primary.text9,
+        opacity: 1,
+        backgroundColor: 'unset'
+      }
+    },
+    noOptions: {
+      padding: 0
+    },
+    searchIcon: {
+      fontSize: '20px !important'
+    }
+  };
+};
+
+var infoListItemStyles = {
+  paddingLeft: '16px',
+  height: 36,
+  listStyleType: 'none',
+  display: 'flex',
+  alignItems: 'center'
+};
+/* eslint-disable react/prop-types */
+
+var InfoListItem = function InfoListItem(_ref) {
+  var _ref$text = _ref.text,
+      text = _ref$text === void 0 ? 'Loading...' : _ref$text;
+  return /*#__PURE__*/jsx("li", {
+    style: infoListItemStyles,
+    children: /*#__PURE__*/jsx(Typography, {
+      variant: "body2",
+      color: "textSecondary",
+      children: text
+    })
+  }, "loading");
+};
+
+var ListboxComponent = forwardRef(function (_ref2, ref) {
+  var children = _ref2.children,
+      loading = _ref2.loading,
+      hasMore = _ref2.hasMore,
+      otherProps = _objectWithoutProperties(_ref2, ["children", "loading", "hasMore"]);
+
+  return /*#__PURE__*/jsxs(List, _objectSpread(_objectSpread({}, otherProps), {}, {
+    ref: ref,
+    role: "listbox",
+    children: [children, (hasMore || loading) && /*#__PURE__*/jsx(InfoListItem, {})]
+  }));
+});
+/* eslint-enable react/prop-types */
+
+var AssetEditorAutocomplete = function AssetEditorAutocomplete(_ref3) {
+  var _currentOption$name;
+
+  var dataTestId = _ref3['data-testid'],
+      appKey = _ref3.appKey,
+      assetType = _ref3.assetType,
+      classes = _ref3.classes,
+      companyId = _ref3.companyId,
+      currentValue = _ref3.currentValue,
+      disabled = _ref3.disabled,
+      disableClearable = _ref3.disableClearable,
+      errorText = _ref3.errorText,
+      isMultiple = _ref3.isMultiple,
+      isNullable = _ref3.isNullable,
+      label = _ref3.label,
+      _onChange = _ref3.onChange,
+      parentAssetId = _ref3.parentAssetId,
+      parentAssetType = _ref3.parentAssetType,
+      queryParams = _ref3.queryParams;
+
+  // NOTE: Store currently selected option
+  var _useState = useState(isMultiple ? [] : null),
+      _useState2 = _slicedToArray(_useState, 2),
+      currentOption = _useState2[0],
+      setCurrentOption = _useState2[1];
+
+  var _useState3 = useState(''),
+      _useState4 = _slicedToArray(_useState3, 2),
+      searchText = _useState4[0],
+      setSearchText = _useState4[1]; // NOTE: For ui input
+
+
+  var _useState5 = useState(''),
+      _useState6 = _slicedToArray(_useState5, 2),
+      searchValue = _useState6[0],
+      setSearchValue = _useState6[1]; // NOTE: Used for api filtering
+
+
+  var _useState7 = useState(false),
+      _useState8 = _slicedToArray(_useState7, 2),
+      isSearchMode = _useState8[0],
+      setSearchMode = _useState8[1];
+
+  var _useState9 = useState(1),
+      _useState10 = _slicedToArray(_useState9, 2),
+      scrollPage = _useState10[0],
+      setScrollPage = _useState10[1];
+
+  var _useState11 = useState(true),
+      _useState12 = _slicedToArray(_useState11, 2),
+      hasMore = _useState12[0],
+      setHasMore = _useState12[1];
+
+  useEffect(function () {
+    // NOTE: Asset type has been changed. Clear currently selected option
+    setCurrentOption(isMultiple ? [] : null);
+    setScrollPage(1);
+    setSearchMode(false);
+  }, [assetType]);
+
+  var _useAssetAutoComplete = useAssetAutoCompleteSelectData({
+    appKey: appKey,
+    assetType: assetType,
+    companyId: companyId,
+    currentValue: currentValue,
+    isMultiple: isMultiple,
+    parentAssetId: parentAssetId,
+    parentAssetType: parentAssetType,
+    scrollPage: scrollPage,
+    searchText: searchText,
+    setCurrentOption: setCurrentOption,
+    queryParams: queryParams
+  }),
+      assets = _useAssetAutoComplete.assets,
+      loading = _useAssetAutoComplete.loading;
+
+  useEffect(function () {
+    var hasMoreAssets = assets.length >= PER_PAGE * scrollPage;
+    setHasMore(hasMoreAssets);
+  }, [assets, scrollPage]);
+  var onInputChange = useMemo(function () {
+    return debounce(function (value) {
+      setScrollPage(1);
+      setSearchText(value);
+    }, 200);
+  }, []);
+
+  var handleInputChange = function handleInputChange(event, value, reason) {
+    if (reason === 'input') {
+      setSearchValue(value);
+      setSearchMode(true);
+      onInputChange(value); // NOTE: Trigger api call
+    } else {
+      // NOTE: Clean searchText for "reset" and "clear" reasons
+      setSearchText('');
+    }
+  };
+
+  var handleFetchNext = useMemo(function () {
+    return debounce(function () {
+      return setScrollPage(function (prevScrollPage) {
+        return prevScrollPage + 1;
+      });
+    }, 250);
+  }, []);
+
+  var onClose = function onClose() {
+    setSearchValue('');
+    setSearchText('');
+    setSearchMode(false);
+    setScrollPage(1);
+  };
+
+  var onScrollListbox = function onScrollListbox(event) {
+    if (!hasMore || loading) return;
+    var listboxNode = event.currentTarget;
+
+    if (listboxNode.scrollTop + listboxNode.clientHeight > listboxNode.scrollHeight - SCROLL_THRESHOLD) {
+      handleFetchNext();
+    }
+  };
+
+  var renderInput = function renderInput(params) {
+    return /*#__PURE__*/jsx(TextField, _objectSpread(_objectSpread({}, params), {}, {
+      variant: "standard",
+      placeholder: "Search for asset..."
+    }, !isMultiple && {
+      InputProps: _objectSpread(_objectSpread({}, params.InputProps), {}, {
+        startAdornment: /*#__PURE__*/jsx(InputAdornment, {
+          children: /*#__PURE__*/jsx(Search, {
+            className: classes.searchIcon
+          })
+        })
+      })
+    }));
+  };
+
+  var renderOption = function renderOption(_ref4) {
+    var id = _ref4.id,
+        name = _ref4.name;
+    return /*#__PURE__*/jsx(TruncatedText, {
+      "data-testid": "".concat(PAGE_NAME, "_option_").concat(name, "MenuItem"),
+      children: isMultiple && currentValue.includes(id) ? "".concat(name, " (already selected)") : name
+    }, id);
+  };
+
+  var autocompleteClasses = {
+    endAdornment: classes.endAdornment,
+    inputRoot: classes.inputRoot,
+    listbox: classes.listbox,
+    noOptions: classes.noOptions,
+    option: classes.option,
+    popupIndicator: classes.popupIndicator,
+    root: classes.root
+  };
+  return /*#__PURE__*/jsxs(FormControl, {
+    disabled: disabled,
+    error: !!errorText,
+    className: classes.formControl,
+    children: [!isNullable && /*#__PURE__*/jsx(InputLabel, {
+      shrink: true,
+      children: label
+    }), /*#__PURE__*/jsx(Tooltip, {
+      title: (_currentOption$name = currentOption === null || currentOption === void 0 ? void 0 : currentOption.name) !== null && _currentOption$name !== void 0 ? _currentOption$name : '',
+      children: /*#__PURE__*/jsx(Autocomplete, _objectSpread({
+        disabled: disabled,
+        blurOnSelect: true,
+        classes: autocompleteClasses,
+        clearOnBlur: true,
+        clearOnEscape: true,
+        "data-testid": dataTestId,
+        disableClearable: disableClearable,
+        filterOptions: identity,
+        getOptionLabel: function getOptionLabel(option) {
+          return option === null || option === void 0 ? void 0 : option.name;
+        },
+        getOptionSelected: function getOptionSelected(option, value) {
+          return option && value && option.id === value.id;
+        },
+        inputValue: isSearchMode ? searchValue : (currentOption === null || currentOption === void 0 ? void 0 : currentOption.name) || '',
+        ListboxComponent: ListboxComponent,
+        ListboxProps: {
+          onScroll: onScrollListbox,
+          loading: loading,
+          hasMore: hasMore
+        },
+        options: assets,
+        onChange: function onChange(event, selected) {
+          var _selected$id;
+
+          setCurrentOption(selected);
+
+          _onChange(isMultiple ? selected.map(function (_ref5) {
+            var id = _ref5.id;
+            return id;
+          }) : (_selected$id = selected === null || selected === void 0 ? void 0 : selected.id) !== null && _selected$id !== void 0 ? _selected$id : null, selected);
+        },
+        onClose: onClose,
+        onInputChange: handleInputChange,
+        noOptionsText: /*#__PURE__*/jsx(InfoListItem, {
+          text: loading ? 'Loading...' : 'No options'
+        }),
+        renderInput: renderInput,
+        renderOption: renderOption,
+        value: currentOption,
+        multiple: isMultiple
+      }, isMultiple && {
+        renderTags: function renderTags(value, getTagProps) {
+          return value.map(function (option, index) {
+            return /*#__PURE__*/jsx(Chip, _objectSpread({
+              label: option === null || option === void 0 ? void 0 : option.name
+            }, getTagProps({
+              index: index
+            })), option.id);
+          });
+        },
+        getOptionDisabled: function getOptionDisabled(option) {
+          return currentValue.includes(option.id);
+        }
+      }))
+    }), /*#__PURE__*/jsx(FormHelperText, {
+      children: errorText
+    })]
+  });
+};
+
+AssetEditorAutocomplete.defaultProps = {
+  label: 'Choose An Asset',
+  currentValue: undefined,
+  disableClearable: true,
+  isNullable: false,
+  parentAssetId: undefined,
+  parentAssetType: undefined,
+  companyId: undefined,
+  errorText: '',
+  'data-testid': "".concat(PAGE_NAME, "_autoComplete"),
+  disabled: false,
+  isMultiple: false,
+  appKey: null,
+  queryParams: {}
+};
+AssetEditorAutocomplete.propTypes = {
+  label: PropTypes.string,
+  currentValue: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.number)]),
+  isNullable: PropTypes.bool,
+  onChange: PropTypes.func.isRequired,
+  classes: PropTypes.shape({}).isRequired,
+  disableClearable: PropTypes.bool,
+  parentAssetId: PropTypes.number,
+  parentAssetType: PropTypes.string,
+  companyId: PropTypes.number,
+  assetType: PropTypes.string.isRequired,
+  errorText: PropTypes.string,
+  'data-testid': PropTypes.string,
+  disabled: PropTypes.bool,
+  isMultiple: PropTypes.bool,
+  appKey: PropTypes.string,
+  queryParams: PropTypes.shape({})
+};
+var AssetEditorAutocomplete$1 = withStyles(muiStyles)(AssetEditorAutocomplete);
+
+export default AssetEditorAutocomplete$1;
+//# sourceMappingURL=AssetEditorAutocomplete.js.map

package/components/AssetEditor/AssetEditorAutocomplete.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssetEditorAutocomplete.js","sources":["../../../src/components/AssetEditor/AssetEditorAutocomplete.js"],"sourcesContent":["import { useMemo, useState, useEffect, forwardRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { debounce, identity } from 'lodash';\n\nimport {\n  FormControl,\n  InputLabel,\n  TextField,\n  FormHelperText,\n  withStyles,\n  Typography,\n  List,\n  InputAdornment,\n  Chip,\n  Tooltip,\n} from '@material-ui/core';\nimport { Search as SearchIcon } from '@material-ui/icons';\nimport { Autocomplete } from '@material-ui/lab';\nimport TruncatedText from '../TruncatedText';\nimport { PER_PAGE, SCROLL_THRESHOLD } from './constants';\nimport { useAssetAutoCompleteSelectData } from './effects';\n\nconst PAGE_NAME = 'DC_SingleAssetEditorAutocomplete';\n\nconst muiStyles = theme => ({\n  formControl: {},\n  listbox: { maxHeight: 350 },\n  root: { fontSize: 16 },\n  inputRoot: {\n    paddingTop: 16,\n    padding: '8px 0',\n    paddingBottom: 0,\n    width: 350,\n    fontSize: 16,\n  },\n  popupIndicator: { display: 'none' },\n  option: {\n    paddingLeft: '16px !important',\n    height: 36,\n    '&[aria-disabled=true]': {\n      color: theme.palette.primary.text9,\n      opacity: 1,\n      backgroundColor: 'unset',\n    },\n  },\n  noOptions: { padding: 0 },\n  searchIcon: { fontSize: '20px !important' },\n});\n\nconst infoListItemStyles = {\n  paddingLeft: '16px',\n  height: 36,\n  listStyleType: 'none',\n  display: 'flex',\n  alignItems: 'center',\n};\n\n/* eslint-disable react/prop-types */\nconst InfoListItem = ({ text = 'Loading...' }) => (\n  <li key=\"loading\" style={infoListItemStyles}>\n    <Typography variant=\"body2\" color=\"textSecondary\">\n      {text}\n    </Typography>\n  </li>\n);\n\nconst ListboxComponent = forwardRef(({ children, loading, hasMore, ...otherProps }, ref) => (\n  <List {...otherProps} ref={ref} role=\"listbox\">\n    {children}\n    {(hasMore || loading) && <InfoListItem />}\n  </List>\n));\n/* eslint-enable react/prop-types */\n\nconst AssetEditorAutocomplete = ({\n  'data-testid': dataTestId,\n  appKey,\n  assetType,\n  classes,\n  companyId,\n  currentValue,\n  disabled,\n  disableClearable,\n  errorText,\n  isMultiple,\n  isNullable,\n  label,\n  onChange,\n  parentAssetId,\n  parentAssetType,\n  queryParams,\n}) => {\n  // NOTE: Store currently selected option\n  const [currentOption, setCurrentOption] = useState(isMultiple ? [] : null);\n\n  const [searchText, setSearchText] = useState(''); // NOTE: For ui input\n  const [searchValue, setSearchValue] = useState(''); // NOTE: Used for api filtering\n  const [isSearchMode, setSearchMode] = useState(false);\n\n  const [scrollPage, setScrollPage] = useState(1);\n  const [hasMore, setHasMore] = useState(true);\n\n  useEffect(() => {\n    // NOTE: Asset type has been changed. Clear currently selected option\n    setCurrentOption(isMultiple ? [] : null);\n    setScrollPage(1);\n    setSearchMode(false);\n  }, [assetType]);\n\n  const { assets, loading } = useAssetAutoCompleteSelectData({\n    appKey,\n    assetType,\n    companyId,\n    currentValue,\n    isMultiple,\n    parentAssetId,\n    parentAssetType,\n    scrollPage,\n    searchText,\n    setCurrentOption,\n    queryParams,\n  });\n\n  useEffect(() => {\n    const hasMoreAssets = assets.length >= PER_PAGE * scrollPage;\n    setHasMore(hasMoreAssets);\n  }, [assets, scrollPage]);\n\n  const onInputChange = useMemo(\n    () =>\n      debounce(value => {\n        setScrollPage(1);\n        setSearchText(value);\n      }, 200),\n    []\n  );\n\n  const handleInputChange = (event, value, reason) => {\n    if (reason === 'input') {\n      setSearchValue(value);\n      setSearchMode(true);\n      onInputChange(value); // NOTE: Trigger api call\n    } else {\n      // NOTE: Clean searchText for \"reset\" and \"clear\" reasons\n      setSearchText('');\n    }\n  };\n\n  const handleFetchNext = useMemo(\n    () => debounce(() => setScrollPage(prevScrollPage => prevScrollPage + 1), 250),\n    []\n  );\n  const onClose = () => {\n    setSearchValue('');\n    setSearchText('');\n    setSearchMode(false);\n    setScrollPage(1);\n  };\n\n  const onScrollListbox = event => {\n    if (!hasMore || loading) return;\n    const listboxNode = event.currentTarget;\n    if (\n      listboxNode.scrollTop + listboxNode.clientHeight >\n      listboxNode.scrollHeight - SCROLL_THRESHOLD\n    ) {\n      handleFetchNext();\n    }\n  };\n\n  const renderInput = params => (\n    <TextField\n      {...params}\n      variant=\"standard\"\n      placeholder=\"Search for asset...\"\n      {...(!isMultiple && {\n        InputProps: {\n          ...params.InputProps,\n          startAdornment: (\n            <InputAdornment>\n              <SearchIcon className={classes.searchIcon} />\n            </InputAdornment>\n          ),\n        },\n      })}\n    />\n  );\n\n  const renderOption = ({ id, name }) => (\n    <TruncatedText key={id} data-testid={`${PAGE_NAME}_option_${name}MenuItem`}>\n      {isMultiple && currentValue.includes(id) ? `${name} (already selected)` : name}\n    </TruncatedText>\n  );\n\n  const autocompleteClasses = {\n    endAdornment: classes.endAdornment,\n    inputRoot: classes.inputRoot,\n    listbox: classes.listbox,\n    noOptions: classes.noOptions,\n    option: classes.option,\n    popupIndicator: classes.popupIndicator,\n    root: classes.root,\n  };\n\n  return (\n    <FormControl disabled={disabled} error={!!errorText} className={classes.formControl}>\n      {!isNullable && <InputLabel shrink>{label}</InputLabel>}\n      <Tooltip title={currentOption?.name ?? ''}>\n        <Autocomplete\n          disabled={disabled}\n          blurOnSelect\n          classes={autocompleteClasses}\n          clearOnBlur\n          clearOnEscape\n          data-testid={dataTestId}\n          disableClearable={disableClearable}\n          filterOptions={identity}\n          getOptionLabel={option => option?.name}\n          getOptionSelected={(option, value) => option && value && option.id === value.id}\n          inputValue={isSearchMode ? searchValue : currentOption?.name || ''}\n          ListboxComponent={ListboxComponent}\n          ListboxProps={{ onScroll: onScrollListbox, loading, hasMore }}\n          options={assets}\n          onChange={(event, selected) => {\n            setCurrentOption(selected);\n            onChange(isMultiple ? selected.map(({ id }) => id) : selected?.id ?? null, selected);\n          }}\n          onClose={onClose}\n          onInputChange={handleInputChange}\n          noOptionsText={<InfoListItem text={loading ? 'Loading...' : 'No options'} />}\n          renderInput={renderInput}\n          renderOption={renderOption}\n          value={currentOption}\n          multiple={isMultiple}\n          {...(isMultiple && {\n            renderTags: (value, getTagProps) => {\n              return value.map((option, index) => (\n                <Chip key={option.id} label={option?.name} {...getTagProps({ index })} />\n              ));\n            },\n            getOptionDisabled: option => currentValue.includes(option.id),\n          })}\n        />\n      </Tooltip>\n      <FormHelperText>{errorText}</FormHelperText>\n    </FormControl>\n  );\n};\n\nAssetEditorAutocomplete.defaultProps = {\n  label: 'Choose An Asset',\n  currentValue: undefined,\n  disableClearable: true,\n  isNullable: false,\n  parentAssetId: undefined,\n  parentAssetType: undefined,\n  companyId: undefined,\n  errorText: '',\n  'data-testid': `${PAGE_NAME}_autoComplete`,\n  disabled: false,\n  isMultiple: false,\n  appKey: null,\n  queryParams: {},\n};\n\nAssetEditorAutocomplete.propTypes = {\n  label: PropTypes.string,\n  currentValue: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.number)]),\n  isNullable: PropTypes.bool,\n  onChange: PropTypes.func.isRequired,\n  classes: PropTypes.shape({}).isRequired,\n  disableClearable: PropTypes.bool,\n  parentAssetId: PropTypes.number,\n  parentAssetType: PropTypes.string,\n  companyId: PropTypes.number,\n  assetType: PropTypes.string.isRequired,\n  errorText: PropTypes.string,\n  'data-testid': PropTypes.string,\n  disabled: PropTypes.bool,\n  isMultiple: PropTypes.bool,\n  appKey: PropTypes.string,\n  queryParams: PropTypes.shape({}),\n};\n\nexport default withStyles(muiStyles)(AssetEditorAutocomplete);\n"],"names":["PAGE_NAME","muiStyles","theme","formControl","listbox","maxHeight","root","fontSize","inputRoot","paddingTop","padding","paddingBottom","width","popupIndicator","display","option","paddingLeft","height","color","palette","primary","text9","opacity","backgroundColor","noOptions","searchIcon","infoListItemStyles","listStyleType","alignItems","InfoListItem","text","_jsx","ListboxComponent","forwardRef","ref","children","loading","hasMore","otherProps","_jsxs","AssetEditorAutocomplete","dataTestId","appKey","assetType","classes","companyId","currentValue","disabled","disableClearable","errorText","isMultiple","isNullable","label","onChange","parentAssetId","parentAssetType","queryParams","useState","currentOption","setCurrentOption","searchText","setSearchText","searchValue","setSearchValue","isSearchMode","setSearchMode","scrollPage","setScrollPage","setHasMore","useEffect","useAssetAutoCompleteSelectData","assets","hasMoreAssets","length","PER_PAGE","onInputChange","useMemo","debounce","value","handleInputChange","event","reason","handleFetchNext","prevScrollPage","onClose","onScrollListbox","listboxNode","currentTarget","scrollTop","clientHeight","scrollHeight","SCROLL_THRESHOLD","renderInput","params","InputProps","startAdornment","SearchIcon","renderOption","id","name","includes","autocompleteClasses","endAdornment","identity","onScroll","selected","map","renderTags","getTagProps","index","getOptionDisabled","defaultProps","undefined","propTypes","PropTypes","string","oneOfType","number","arrayOf","bool","func","isRequired","shape","withStyles"],"mappings":"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"}

package/components/AssetEditor/AssetEditors.css.js

@@ -1 +1,8 @@
-import t from'./../../ext-esm/style-inject/dist/style-inject.es.js';var i={main:"AssetEditors_main__cSJlb",editor:"AssetEditors_editor__mFjiQ",title:"AssetEditors_title__IZ2VK"};t(".AssetEditors_editor__mFjiQ{align-items:center;display:flex;margin-top:8px}.AssetEditors_editor__mFjiQ button{margin-left:24px}.AssetEditors_title__IZ2VK{font-size:20px;font-weight:400;margin:16px 0}");export{i as default};
+import styleInject from '../../ext-esm/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".AssetEditors_main__3CGQN {\n}\n\n.AssetEditors_editor__1hHNY {\n  display: flex;\n  align-items: center;\n  margin-top: 8px;\n}\n\n.AssetEditors_editor__1hHNY button {\n  margin-left: 24px;\n}\n\n.AssetEditors_title__2rt8L {\n  font-weight: 400;\n  font-size: 20px;\n  margin: 16px 0;\n}\n";
+var styles = {"main":"AssetEditors_main__3CGQN","editor":"AssetEditors_editor__1hHNY","title":"AssetEditors_title__2rt8L"};
+styleInject(css_248z);
+
+export default styles;
+//# sourceMappingURL=AssetEditors.css.js.map

package/components/AssetEditor/AssetEditors.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,wBAAwB,oDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA;"}

package/components/AssetEditor/SingleAssetEditor.js

@@ -1 +1,119 @@
-import e from"prop-types";import{withStyles as t,FormControl as a,InputLabel as s,Select as r,MenuItem as n,CircularProgress as i}from"@material-ui/core";import l from"../TruncatedText/index.js";import{useAssetSelectData as p}from"./effects/index.js";import{jsxs as d,jsx as u}from"react/jsx-runtime";var o="DC_SingleAssetEditor",c=function(e){var t=e.appKey,c=e.label,m=e.currentValue,h=e.defaultValue,y=e.isNullable,f=e.onChange,g=e.classes,v=e.parentAssetId,A=e.assetType,T=e.parentAssetType,b=p({appKey:t,assetId:m,assetType:A,parentAssetId:v,parentAssetType:T}),I=b.assets,N=b.loading,x=m||h;return d("div",{children:[d(a,{disabled:N,children:[!y&&u(s,{shrink:!!x,children:c}),d(r,{"data-testid":e["data-testid"],value:x,onChange:function(e){return f(e.target.value)},className:g.select,MenuProps:{className:g.selectMenu},children:[y&&u(n,{"data-testid":"".concat(o,"_noActiveAssetMenuItem"),value:h,className:g.menuItem,children:"No active asset"},"empty item"),I.map((function(e){var t=(null==e?void 0:e.name)||"";return u(n,{"data-testid":"".concat(o,"_option_").concat(t,"MenuItem"),value:Number(e.id),className:g.menuItem,children:u(l,{children:t})},e.id)}))]})]}),N&&u(i,{"data-testid":"".concat(o,"_CircularProgress"),size:20,className:g.progress})]})};c.propTypes={classes:e.shape({}).isRequired,appType:e.shape({constants:e.shape({})}),currentValue:e.oneOfType([e.number,e.string]),defaultValue:e.any,onChange:e.func.isRequired,label:e.string,isNullable:e.bool,parentAssetId:e.number,parentAssetType:e.string,assetType:e.string.isRequired,"data-testid":e.string,appKey:e.string},c.defaultProps={label:"Choose An Asset",currentValue:"",defaultValue:"",appType:void 0,isNullable:!1,parentAssetId:void 0,parentAssetType:void 0,"data-testid":"".concat(o,"_autoComplete"),appKey:null};var m=t({progress:{margin:"0 15px"},select:{width:350},selectMenu:{maxHeight:350},menuItem:{width:350}})(c);export{m as default};
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { withStyles, FormControl, InputLabel, Select, MenuItem, CircularProgress } from '@material-ui/core';
+import PropTypes from 'prop-types';
+import TruncatedText from '../TruncatedText/index.js';
+import { useAssetSelectData } from './effects/index.js';
+
+var PAGE_NAME = 'DC_SingleAssetEditor';
+var muiStyles = {
+  progress: {
+    margin: '0 15px'
+  },
+  select: {
+    width: 350
+  },
+  selectMenu: {
+    maxHeight: 350
+  },
+  menuItem: {
+    width: 350
+  }
+};
+
+var SingleAssetEditor = function SingleAssetEditor(props) {
+  var appKey = props.appKey,
+      label = props.label,
+      currentValue = props.currentValue,
+      defaultValue = props.defaultValue,
+      isNullable = props.isNullable,
+      _onChange = props.onChange,
+      classes = props.classes,
+      parentAssetId = props.parentAssetId,
+      assetType = props.assetType,
+      parentAssetType = props.parentAssetType;
+
+  var _useAssetSelectData = useAssetSelectData({
+    appKey: appKey,
+    assetId: currentValue,
+    assetType: assetType,
+    parentAssetId: parentAssetId,
+    parentAssetType: parentAssetType
+  }),
+      assets = _useAssetSelectData.assets,
+      loading = _useAssetSelectData.loading;
+
+  var value = currentValue || defaultValue;
+  return /*#__PURE__*/jsxs("div", {
+    children: [/*#__PURE__*/jsxs(FormControl, {
+      disabled: loading,
+      children: [!isNullable && /*#__PURE__*/jsx(InputLabel, {
+        shrink: !!value,
+        children: label
+      }), /*#__PURE__*/jsxs(Select, {
+        "data-testid": props['data-testid'],
+        value: value,
+        onChange: function onChange(event) {
+          return _onChange(event.target.value);
+        },
+        className: classes.select,
+        MenuProps: {
+          className: classes.selectMenu
+        },
+        children: [isNullable && /*#__PURE__*/jsx(MenuItem, {
+          "data-testid": "".concat(PAGE_NAME, "_noActiveAssetMenuItem"),
+          value: defaultValue,
+          className: classes.menuItem,
+          children: "No active asset"
+        }, "empty item"), assets.map(function (asset) {
+          var assetName = (asset === null || asset === void 0 ? void 0 : asset.name) || '';
+          return /*#__PURE__*/jsx(MenuItem, {
+            "data-testid": "".concat(PAGE_NAME, "_option_").concat(assetName, "MenuItem"),
+            value: Number(asset.id),
+            className: classes.menuItem,
+            children: /*#__PURE__*/jsx(TruncatedText, {
+              children: assetName
+            })
+          }, asset.id);
+        })]
+      })]
+    }), loading && /*#__PURE__*/jsx(CircularProgress, {
+      "data-testid": "".concat(PAGE_NAME, "_CircularProgress"),
+      size: 20,
+      className: classes.progress
+    })]
+  });
+};
+
+SingleAssetEditor.propTypes = {
+  classes: PropTypes.shape({}).isRequired,
+  appType: PropTypes.shape({
+    constants: PropTypes.shape({})
+  }),
+  currentValue: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  defaultValue: PropTypes.any,
+  // eslint-disable-line react/forbid-prop-types
+  onChange: PropTypes.func.isRequired,
+  label: PropTypes.string,
+  isNullable: PropTypes.bool,
+  parentAssetId: PropTypes.number,
+  parentAssetType: PropTypes.string,
+  assetType: PropTypes.string.isRequired,
+  'data-testid': PropTypes.string,
+  appKey: PropTypes.string
+};
+SingleAssetEditor.defaultProps = {
+  label: 'Choose An Asset',
+  currentValue: '',
+  // NOTE: If 'undefined' <SelectField /> displays 'label'
+  defaultValue: '',
+  appType: undefined,
+  isNullable: false,
+  parentAssetId: undefined,
+  parentAssetType: undefined,
+  'data-testid': "".concat(PAGE_NAME, "_autoComplete"),
+  appKey: null
+};
+var SingleAssetEditor$1 = withStyles(muiStyles)(SingleAssetEditor);
+
+export default SingleAssetEditor$1;
+//# sourceMappingURL=SingleAssetEditor.js.map

package/components/AssetEditor/SingleAssetEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleAssetEditor.js","sources":["../../../src/components/AssetEditor/SingleAssetEditor.js"],"sourcesContent":["import PropTypes from 'prop-types';\n\nimport {\n  CircularProgress,\n  MenuItem,\n  Select,\n  FormControl,\n  InputLabel,\n  withStyles,\n} from '@material-ui/core';\n\nimport TruncatedText from '../TruncatedText';\n\nimport { useAssetSelectData } from './effects';\n\nconst PAGE_NAME = 'DC_SingleAssetEditor';\n\nconst muiStyles = {\n  progress: { margin: '0 15px' },\n  select: { width: 350 },\n  selectMenu: { maxHeight: 350 },\n  menuItem: { width: 350 },\n};\n\nconst SingleAssetEditor = props => {\n  const {\n    appKey,\n    label,\n    currentValue,\n    defaultValue,\n    isNullable,\n    onChange,\n    classes,\n    parentAssetId,\n    assetType,\n    parentAssetType,\n  } = props;\n\n  const { assets, loading } = useAssetSelectData({\n    appKey,\n    assetId: currentValue,\n    assetType,\n    parentAssetId,\n    parentAssetType,\n  });\n  const value = currentValue || defaultValue;\n\n  return (\n    <div>\n      <FormControl disabled={loading}>\n        {!isNullable && <InputLabel shrink={!!value}>{label}</InputLabel>}\n        <Select\n          data-testid={props['data-testid']}\n          value={value}\n          onChange={event => onChange(event.target.value)}\n          className={classes.select}\n          MenuProps={{ className: classes.selectMenu }}\n        >\n          {isNullable && (\n            <MenuItem\n              data-testid={`${PAGE_NAME}_noActiveAssetMenuItem`}\n              key=\"empty item\"\n              value={defaultValue}\n              className={classes.menuItem}\n            >\n              No active asset\n            </MenuItem>\n          )}\n          {assets.map(asset => {\n            const assetName = asset?.name || '';\n            return (\n              <MenuItem\n                data-testid={`${PAGE_NAME}_option_${assetName}MenuItem`}\n                key={asset.id}\n                value={Number(asset.id)}\n                className={classes.menuItem}\n              >\n                <TruncatedText>{assetName}</TruncatedText>\n              </MenuItem>\n            );\n          })}\n        </Select>\n      </FormControl>\n\n      {loading && (\n        <CircularProgress\n          data-testid={`${PAGE_NAME}_CircularProgress`}\n          size={20}\n          className={classes.progress}\n        />\n      )}\n    </div>\n  );\n};\n\nSingleAssetEditor.propTypes = {\n  classes: PropTypes.shape({}).isRequired,\n  appType: PropTypes.shape({\n    constants: PropTypes.shape({}),\n  }),\n  currentValue: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n  defaultValue: PropTypes.any, // eslint-disable-line react/forbid-prop-types\n  onChange: PropTypes.func.isRequired,\n  label: PropTypes.string,\n  isNullable: PropTypes.bool,\n  parentAssetId: PropTypes.number,\n  parentAssetType: PropTypes.string,\n  assetType: PropTypes.string.isRequired,\n  'data-testid': PropTypes.string,\n  appKey: PropTypes.string,\n};\n\nSingleAssetEditor.defaultProps = {\n  label: 'Choose An Asset',\n  currentValue: '', // NOTE: If 'undefined' <SelectField /> displays 'label'\n  defaultValue: '',\n  appType: undefined,\n  isNullable: false,\n  parentAssetId: undefined,\n  parentAssetType: undefined,\n  'data-testid': `${PAGE_NAME}_autoComplete`,\n  appKey: null,\n};\n\nexport default withStyles(muiStyles)(SingleAssetEditor);\n"],"names":["PAGE_NAME","muiStyles","progress","margin","select","width","selectMenu","maxHeight","menuItem","SingleAssetEditor","props","appKey","label","currentValue","defaultValue","isNullable","onChange","classes","parentAssetId","assetType","parentAssetType","useAssetSelectData","assetId","assets","loading","value","_jsxs","_jsx","event","target","className","map","asset","assetName","name","Number","id","propTypes","PropTypes","shape","isRequired","appType","constants","oneOfType","number","string","any","func","bool","defaultProps","undefined","withStyles"],"mappings":"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"}

package/components/AssetEditor/constants.js

@@ -1 +1,6 @@
-var r=200,a=400;export{r as PER_PAGE,a as SCROLL_THRESHOLD};
+var PER_PAGE = 200; // The distance in pixels before the end of the items that will trigger a call to loadMore.
+
+var SCROLL_THRESHOLD = 400;
+
+export { PER_PAGE, SCROLL_THRESHOLD };
+//# sourceMappingURL=constants.js.map

package/components/AssetEditor/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../src/components/AssetEditor/constants.js"],"sourcesContent":["export const PER_PAGE = 200;\n\n// The distance in pixels before the end of the items that will trigger a call to loadMore.\nexport const SCROLL_THRESHOLD = 400;\n"],"names":["PER_PAGE","SCROLL_THRESHOLD"],"mappings":"IAAaA,QAAQ,GAAG;;IAGXC,gBAAgB,GAAG;;;;"}