aefis-core-ui 2.1.5 → 2.1.6-rc1

package/dist/index.modern.js

@@ -2049,7 +2049,8 @@ const ContentBox = props => {
     height: props.imageHeight,
     backgroundColor: props.imageBackgroundColor ? props.imageBackgroundColor : "transparent"
   } : {};
-  return /*#__PURE__*/jsxs("div", {
+  return /*#__PURE__*/jsxs(Box$1, {
+    sx: props.sx,
     style: props.containerStyle,
     children: [props.header && /*#__PURE__*/jsx("div", {
       className: classes.sectionHeader,
@@ -2153,7 +2154,9 @@ ContentBox.propTypes = {
   /** Additional styles for the card */
   cardStyle: PropTypes.any,
   /** Additional styles for the content box container */
-  containerStyle: PropTypes.any
+  containerStyle: PropTypes.any,
+  /** Additional styles to apply */
+  sx: PropTypes.object
 };
 
 const defaultColorPalette = {
@@ -3617,7 +3620,6 @@ const IsometricImage = _ref => {
     } = _ref,
     other = _objectWithoutPropertiesLoose(_ref, _excluded$f);
   const image = getIsometricImage(type);
-  console.log("image ", image);
   return /*#__PURE__*/jsx(Image, _extends({
     src: image
   }, other));
@@ -6800,7 +6802,7 @@ const setQueryStringWithoutPageReload = qsValue => {
   }, "", newurl);
 };
 const setQueryStringValue = (key, value, queryString = window.location.search) => {
-  const values = qs.parse(queryString);
+  const values = qs.parse(queryString, options);
   const newQsValue = qs.stringify(_extends({}, values, {
     [key]: value
   }), options);
@@ -8348,6 +8350,8 @@ const FilterPanel = props => {
   const [pickerFilters, setPickerFilters] = useState([]);
   useEffect(() => {
     const formattedFilters = formatFilters(filtersProp, configuration);
+    console.log("filtersProp ", filtersProp);
+    console.log("formattedFilters ", formattedFilters);
     setFilters(formattedFilters);
   }, [filtersProp]);
 
@@ -11178,9 +11182,6 @@ const BusinessObjectPicker = _ref => {
   const handleIsOptionEqualToValue = useCallback((a, b) => getKey(a) == getKey(b), []);
   const renderCustomTags = useCallback(value => value.map(option => /*#__PURE__*/jsx(Box$1, {
     children: /*#__PURE__*/jsx(Chip, {
-      sx: {
-        margin: 0.1
-      },
       id: getKey(option),
       label: getLabel(option),
       tooltipText: option.description,
@@ -11190,9 +11191,6 @@ const BusinessObjectPicker = _ref => {
     })
   }, getKey(option))), [props.size, getKey, getLabel, handleTagDelete]);
   const renderTypeTags = useCallback(value => value.map(option => /*#__PURE__*/jsx(Box$1, {
-    sx: {
-      margin: 0.1
-    },
     children: /*#__PURE__*/jsx(BusinessObject, {
       type: props.type,
       data: option,
@@ -15859,7 +15857,50 @@ const useSelector = (selector, defaultValue) => {
   }, [value]);
 };
 
+// https://stackoverflow.com/questions/7394748/whats-the-right-way-to-decode-a-string-that-has-special-html-entities-in-it/7394787#7394787
+const decodeHtml$2 = html => {
+  const textarea = document.createElement("textarea");
+  textarea.innerHTML = html;
+  return textarea.value;
+};
+
+const render = (value, formState) => {
+  if (value === undefined || value === null) {
+    return value;
+  }
+  return mustache.render(value, formState);
+};
+const renderUrl = (value, formState) => {
+  if (value === undefined || value === null) {
+    return value;
+  }
+  return decodeHtml$2(mustache.render(value, formState));
+};
+const useRenderUrl = template => useSelectFormState(state => renderUrl(template, state));
+const useRender = template => useSelectFormState(state => render(template, state));
+
+const useQueryTemplateParam = queryTemplate => {
+  const selector = useCallback(state => {
+    const query = render(queryTemplate, state);
+    const o = qs.parse(query);
+    Object.keys(o).forEach(key => {
+      if (o[key] === "" || o[key] == undefined) {
+        delete o[key];
+      }
+    });
+    return JSON.stringify(o);
+  }, [queryTemplate]);
+  const queryParams = useSelectFormState(selector);
+  const object = useMemo(() => JSON.parse(queryParams), [queryParams]);
+  return object;
+};
+
 const BusinessObjectPickerMemoized = /*#__PURE__*/React.memo(BusinessObjectPicker);
+const useQueryParam$2 = uiSchema => {
+  const queryParamsSelected = useSelector(uiSchema["select:queryParams"]);
+  const queryParamFromTemplate = useQueryTemplateParam(uiSchema.queryTemplate);
+  return queryParamFromTemplate || queryParamsSelected;
+};
 const BusinessObjectPickerFieldReadOnly = ({
   formData: formDataProp,
   schema,
@@ -15888,12 +15929,12 @@ const BusinessObjectPickerField = ({
   required
 }) => {
   const formData = formDataProp || emptyArray;
-  const queryParamsSelected = useSelector(uiSchema["select:queryParams"]);
   const value = schema.type === "object" && isEmpty(formData) ? undefined : formData;
   const {
     error
   } = useFormControl();
   const label = uiSchema["ui:placeholder"] || schema.title;
+  const query = useQueryParam$2(uiSchema);
   return /*#__PURE__*/jsx(BusinessObjectPickerMemoized, _extends({
     error: error,
     value: value,
@@ -15903,7 +15944,7 @@ const BusinessObjectPickerField = ({
     onChange: onChange,
     required: required
   }, uiSchema == null ? void 0 : uiSchema["ui:props"], {
-    parameters: queryParamsSelected
+    parameters: query
   }));
 };
 BusinessObjectPickerField.propTypes = {
@@ -16330,28 +16371,6 @@ const DisableWrapper = ({
   }));
 };
 
-// https://stackoverflow.com/questions/7394748/whats-the-right-way-to-decode-a-string-that-has-special-html-entities-in-it/7394787#7394787
-const decodeHtml$2 = html => {
-  const textarea = document.createElement("textarea");
-  textarea.innerHTML = html;
-  return textarea.value;
-};
-
-const render = (value, formState) => {
-  if (value === undefined || value === null) {
-    return value;
-  }
-  return mustache.render(value, formState);
-};
-const renderUrl = (value, formState) => {
-  if (value === undefined || value === null) {
-    return value;
-  }
-  return decodeHtml$2(mustache.render(value, formState));
-};
-const useRenderUrl = template => useSelectFormState(state => renderUrl(template, state));
-const useRender = template => useSelectFormState(state => render(template, state));
-
 const ImageUploadReadOnly = ({
   formData,
   schema,