@guillotinaweb/react-gmi 0.24.0 → 0.24.1

package/dist/react-gmi.modern.js

@@ -3036,13 +3036,15 @@ function useVocabulary(vocabularyName, path) {
 const plain = ['string', 'number', 'boolean'];
 function RenderField({
   value,
-  Widget
+  Widget,
+  schema
 }) {
   if (value === null || value === undefined) return '';
 
   if (Widget) {
     return /*#__PURE__*/React.createElement(Widget, {
-      value: value
+      value: value,
+      schema: schema
     });
   }
 
@@ -3084,6 +3086,55 @@ const FieldValue = ({
   value: value
 })));
 
+const DEFAULT_VALUE_NO_EDITABLE_FIELD = ' -- ';
+
+const getDefaultValueEditableField = intl => {
+  return intl.formatMessage({
+    id: "default_value_editable_field",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Click to edit"
+    }]
+  });
+};
+
+const VocabularyRenderField = ({
+  schema,
+  value,
+  modifyContent
+}) => {
+  var _schema$items;
+
+  const intl = useIntl();
+  const DEFAULT_VALUE_EDITABLE_FIELD = getDefaultValueEditableField(intl);
+  const vocabularyName = (schema == null ? void 0 : (_schema$items = schema.items) == null ? void 0 : _schema$items.vocabularyName) || (schema == null ? void 0 : schema.vocabularyName);
+  const vocabulary = useVocabulary(vocabularyName);
+
+  const getRenderProps = () => {
+    const renderProps = {
+      value: value != null ? value : modifyContent ? DEFAULT_VALUE_EDITABLE_FIELD : DEFAULT_VALUE_NO_EDITABLE_FIELD
+    };
+
+    if (schema != null && schema.vocabularyName) {
+      var _vocabularyValue$titl;
+
+      const vocabularyValue = get$1(vocabulary, 'data.items', []).find(item => item.token === value);
+      renderProps['value'] = (_vocabularyValue$titl = vocabularyValue == null ? void 0 : vocabularyValue.title) != null ? _vocabularyValue$titl : '';
+    } else {
+      var _renderProps$value;
+
+      renderProps['value'] = ((_renderProps$value = renderProps['value']) != null ? _renderProps$value : []).map(value => {
+        var _get$find$title, _get$find;
+
+        return (_get$find$title = (_get$find = get$1(vocabulary, 'data.items', []).find(item => item.token === value)) == null ? void 0 : _get$find.title) != null ? _get$find$title : '';
+      });
+    }
+
+    return renderProps;
+  };
+
+  return /*#__PURE__*/React.createElement(RenderField, getRenderProps());
+};
 function RenderFieldComponent({
   schema,
   field,
@@ -3091,17 +3142,10 @@ function RenderFieldComponent({
   modifyContent
 }) {
   const intl = useIntl();
-  const DEFAULT_VALUE_EDITABLE_FIELD = intl.formatMessage({
-    id: "default_value_editable_field",
-    defaultMessage: [{
-      "type": 0,
-      "value": "Click to edit"
-    }]
-  });
-  const DEFAULT_VALUE_NO_EDITABLE_FIELD = ' -- ';
+  const DEFAULT_VALUE_EDITABLE_FIELD = getDefaultValueEditableField(intl);
 
   const getRenderProps = () => {
-    var _schema$items;
+    var _schema$items2;
 
     const renderProps = {
       value: val != null ? val : modifyContent ? DEFAULT_VALUE_EDITABLE_FIELD : DEFAULT_VALUE_NO_EDITABLE_FIELD
@@ -3119,33 +3163,214 @@ function RenderFieldComponent({
       renderProps['value'] = (_val$toString = val == null ? void 0 : val.toString()) != null ? _val$toString : renderProps['value'];
     } else if (val && (schema == null ? void 0 : schema.type) === 'datetime') {
       renderProps['value'] = new Date(val).toLocaleString();
-    } else if (schema != null && (_schema$items = schema.items) != null && _schema$items.vocabularyName || schema != null && schema.vocabularyName) {
-      var _schema$items2;
+    } else if (schema != null && (_schema$items2 = schema.items) != null && _schema$items2.vocabularyName || schema != null && schema.vocabularyName) {
+      renderProps['Widget'] = VocabularyRenderField;
+      renderProps['schema'] = schema;
+    }
 
-      const vocabularyName = (schema == null ? void 0 : (_schema$items2 = schema.items) == null ? void 0 : _schema$items2.vocabularyName) || (schema == null ? void 0 : schema.vocabularyName);
-      const vocabulary = useVocabulary(vocabularyName);
+    return renderProps;
+  };
 
-      if (schema != null && schema.vocabularyName) {
-        var _vocabularyValue$titl;
+  return /*#__PURE__*/React.createElement(RenderField, getRenderProps());
+}
 
-        const vocabularyValue = get$1(vocabulary, 'data.items', []).find(item => item.token === val);
-        renderProps['value'] = (_vocabularyValue$titl = vocabularyValue == null ? void 0 : vocabularyValue.title) != null ? _vocabularyValue$titl : '';
-      } else {
-        var _renderProps$value;
+const SelectVocabulary = React.forwardRef((_ref, ref) => {
+  let {
+    vocabularyName,
+    className,
+    classWrap,
+    val,
+    dataTest,
+    multiple
+  } = _ref,
+      rest = _objectWithoutPropertiesLoose(_ref, ["vocabularyName", "className", "classWrap", "val", "dataTest", "multiple"]);
 
-        renderProps['value'] = ((_renderProps$value = renderProps['value']) != null ? _renderProps$value : []).map(value => {
-          var _get$find$title, _get$find;
+  const vocabulary = useVocabulary(vocabularyName);
 
-          return (_get$find$title = (_get$find = get$1(vocabulary, 'data.items', []).find(item => item.token === value)) == null ? void 0 : _get$find.title) != null ? _get$find$title : '';
-        });
+  const getOptions = () => {
+    if (get$1(vocabulary, 'data.items', null)) {
+      const vocData = vocabulary.data.items.map(item => {
+        var _item$title$default;
+
+        return {
+          text: (_item$title$default = item.title.default) != null ? _item$title$default : item.title,
+          value: item.token
+        };
+      });
+      return vocData;
+    }
+
+    return [];
+  };
+
+  const getProps = () => {
+    if (multiple) {
+      const currentValue = val || [];
+      return {
+        multiple: true,
+        size: 5,
+        value: currentValue,
+        options: getOptions()
+      };
+    }
+
+    return {
+      value: val != null ? val : '',
+      appendDefault: true,
+      options: getOptions()
+    };
+  };
+
+  if (vocabulary.data === undefined || vocabulary.loading) {
+    return /*#__PURE__*/React.createElement("div", null);
+  }
+
+  return /*#__PURE__*/React.createElement(Select, _extends({}, getProps(), {
+    className: className,
+    classWrap: classWrap || 'is-fullwidth',
+    dataTest: dataTest,
+    ref: ref
+  }, rest));
+});
+Select.propTypes = {
+  error: PropTypes.string,
+  disabled: PropTypes.bool,
+  loading: PropTypes.bool,
+  isSubmitted: PropTypes.bool,
+  size: PropTypes.number,
+  onChange: PropTypes.func,
+  multiple: PropTypes.bool,
+  className: PropTypes.string,
+  vocabularyName: PropTypes.string
+};
+
+const EditComponent = React.forwardRef((_ref, ref) => {
+  let {
+    schema,
+    val,
+    setValue,
+    dataTest,
+    className
+  } = _ref,
+      rest = _objectWithoutPropertiesLoose(_ref, ["schema", "val", "setValue", "dataTest", "className"]);
+
+  if ((schema == null ? void 0 : schema.widget) === 'textarea' || (schema == null ? void 0 : schema.widget) === 'richtext') {
+    return /*#__PURE__*/React.createElement(Textarea, _extends({
+      value: val || '',
+      className: className,
+      onChange: ev => setValue(ev),
+      ref: ref,
+      dataTest: dataTest
+    }, rest));
+  } else if ((schema == null ? void 0 : schema.type) === 'boolean') {
+    return /*#__PURE__*/React.createElement(Checkbox, _extends({
+      value: !!val,
+      className: className,
+      onChange: ev => setValue(ev),
+      ref: ref,
+      dataTest: dataTest
+    }, rest));
+  } else if ((schema == null ? void 0 : schema.type) === 'array') {
+    if (schema.items && schema.items.type === 'string') {
+      var _schema$items;
+
+      if (schema.items.vocabularyName) {
+        return /*#__PURE__*/React.createElement(SelectVocabulary, _extends({
+          vocabularyName: get$1(schema, 'items.vocabularyName', null),
+          val: val || [],
+          className: className,
+          classWrap: "is-fullwidth",
+          dataTest: dataTest
+        }, rest, {
+          onChange: setValue,
+          multiple: true
+        }));
+      } else if (schema != null && (_schema$items = schema.items) != null && _schema$items.vocabulary) {
+        return /*#__PURE__*/React.createElement(Select, _extends({
+          value: val || [],
+          className: className,
+          classWrap: "is-fullwidth",
+          dataTest: dataTest,
+          options: schema == null ? void 0 : schema.items.vocabulary.map(item => {
+            return {
+              text: item,
+              value: item
+            };
+          }),
+          multiple: true,
+          onChange: setValue
+        }, rest));
       }
     }
 
-    return renderProps;
+    return /*#__PURE__*/React.createElement(InputList, _extends({
+      value: val || [],
+      className: className,
+      onChange: ev => setValue(ev),
+      ref: ref,
+      dataTest: dataTest
+    }, rest));
+  } else if ((schema == null ? void 0 : schema.widget) === 'file') {
+    return /*#__PURE__*/React.createElement(FileUpload, _extends({
+      onChange: ev => setValue(ev),
+      label: get$1(val, 'filename', null),
+      dataTest: dataTest
+    }, rest));
+  } else if ((schema == null ? void 0 : schema.widget) === 'select' && schema.type === 'string') {
+    if (schema != null && schema.vocabularyName) {
+      return /*#__PURE__*/React.createElement(SelectVocabulary, _extends({
+        val: val || '',
+        className: className,
+        appendDefault: true,
+        classWrap: "is-fullwidth",
+        dataTest: dataTest,
+        onChange: setValue,
+        vocabularyName: get$1(schema, 'vocabularyName', null)
+      }, rest));
+    }
+
+    return /*#__PURE__*/React.createElement(Select, _extends({
+      value: val || '',
+      className: className,
+      appendDefault: true,
+      classWrap: "is-fullwidth",
+      dataTest: dataTest,
+      options: schema == null ? void 0 : schema.vocabulary.map(item => {
+        return {
+          text: item,
+          value: item
+        };
+      }),
+      onChange: setValue
+    }, rest));
+  }
+
+  const getInputType = () => {
+    switch (schema == null ? void 0 : schema.type) {
+      case 'integer':
+        return 'number';
+
+      case 'date':
+        return 'date';
+
+      case 'datetime':
+        return 'datetime-local';
+
+      default:
+        return 'text';
+    }
   };
 
-  return /*#__PURE__*/React.createElement(RenderField, getRenderProps());
-}
+  return /*#__PURE__*/React.createElement(Input, _extends({
+    value: val || '',
+    className: className,
+    dataTest: dataTest,
+    onChange: ev => setValue(ev),
+    ref: ref,
+    type: getInputType()
+  }, rest));
+});
+EditComponent.displayName = 'EditComponent';
 
 function IAttachment({
   properties,
@@ -4620,76 +4845,6 @@ function SearchVocabularyLabels(props) {
   return null;
 }
 
-const SelectVocabulary = React.forwardRef((_ref, ref) => {
-  let {
-    vocabularyName,
-    className,
-    classWrap,
-    val,
-    dataTest,
-    multiple
-  } = _ref,
-      rest = _objectWithoutPropertiesLoose(_ref, ["vocabularyName", "className", "classWrap", "val", "dataTest", "multiple"]);
-
-  const vocabulary = useVocabulary(vocabularyName);
-
-  const getOptions = () => {
-    if (get$1(vocabulary, 'data.items', null)) {
-      const vocData = vocabulary.data.items.map(item => {
-        var _item$title$default;
-
-        return {
-          text: (_item$title$default = item.title.default) != null ? _item$title$default : item.title,
-          value: item.token
-        };
-      });
-      return vocData;
-    }
-
-    return [];
-  };
-
-  const getProps = () => {
-    if (multiple) {
-      const currentValue = val || [];
-      return {
-        multiple: true,
-        size: 5,
-        value: currentValue,
-        options: getOptions()
-      };
-    }
-
-    return {
-      value: val != null ? val : '',
-      appendDefault: true,
-      options: getOptions()
-    };
-  };
-
-  if (vocabulary.data === undefined || vocabulary.loading) {
-    return /*#__PURE__*/React.createElement("div", null);
-  }
-
-  return /*#__PURE__*/React.createElement(Select, _extends({}, getProps(), {
-    className: className,
-    classWrap: classWrap || 'is-fullwidth',
-    dataTest: dataTest,
-    ref: ref
-  }, rest));
-});
-Select.propTypes = {
-  error: PropTypes.string,
-  disabled: PropTypes.bool,
-  loading: PropTypes.bool,
-  isSubmitted: PropTypes.bool,
-  size: PropTypes.number,
-  onChange: PropTypes.func,
-  multiple: PropTypes.bool,
-  className: PropTypes.string,
-  vocabularyName: PropTypes.string
-};
-
 const initialState$1 = {
   page: 0,
   items: [],
@@ -7364,134 +7519,6 @@ const buildPaths = segments => {
   return results;
 };
 
-const EditComponent = React.forwardRef((_ref, ref) => {
-  let {
-    schema,
-    val,
-    setValue,
-    dataTest,
-    className
-  } = _ref,
-      rest = _objectWithoutPropertiesLoose(_ref, ["schema", "val", "setValue", "dataTest", "className"]);
-
-  if ((schema == null ? void 0 : schema.widget) === 'textarea' || (schema == null ? void 0 : schema.widget) === 'richtext') {
-    return /*#__PURE__*/React.createElement(Textarea, _extends({
-      value: val || '',
-      className: className,
-      onChange: ev => setValue(ev),
-      ref: ref,
-      dataTest: dataTest
-    }, rest));
-  } else if ((schema == null ? void 0 : schema.type) === 'boolean') {
-    return /*#__PURE__*/React.createElement(Checkbox, _extends({
-      value: !!val,
-      className: className,
-      onChange: ev => setValue(ev),
-      ref: ref,
-      dataTest: dataTest
-    }, rest));
-  } else if ((schema == null ? void 0 : schema.type) === 'array') {
-    if (schema.items && schema.items.type === 'string') {
-      var _schema$items;
-
-      if (schema.items.vocabularyName) {
-        return /*#__PURE__*/React.createElement(SelectVocabulary, _extends({
-          vocabularyName: get$1(schema, 'items.vocabularyName', null),
-          val: val || [],
-          className: className,
-          classWrap: "is-fullwidth",
-          dataTest: dataTest
-        }, rest, {
-          onChange: setValue,
-          multiple: true
-        }));
-      } else if (schema != null && (_schema$items = schema.items) != null && _schema$items.vocabulary) {
-        return /*#__PURE__*/React.createElement(Select, _extends({
-          value: val || [],
-          className: className,
-          classWrap: "is-fullwidth",
-          dataTest: dataTest,
-          options: schema == null ? void 0 : schema.items.vocabulary.map(item => {
-            return {
-              text: item,
-              value: item
-            };
-          }),
-          multiple: true,
-          onChange: setValue
-        }, rest));
-      }
-    }
-
-    return /*#__PURE__*/React.createElement(InputList, _extends({
-      value: val || [],
-      className: className,
-      onChange: ev => setValue(ev),
-      ref: ref,
-      dataTest: dataTest
-    }, rest));
-  } else if ((schema == null ? void 0 : schema.widget) === 'file') {
-    return /*#__PURE__*/React.createElement(FileUpload, _extends({
-      onChange: ev => setValue(ev),
-      label: get$1(val, 'filename', null),
-      dataTest: dataTest
-    }, rest));
-  } else if ((schema == null ? void 0 : schema.widget) === 'select' && schema.type === 'string') {
-    if (schema != null && schema.vocabularyName) {
-      return /*#__PURE__*/React.createElement(SelectVocabulary, _extends({
-        val: val || '',
-        className: className,
-        appendDefault: true,
-        classWrap: "is-fullwidth",
-        dataTest: dataTest,
-        onChange: setValue,
-        vocabularyName: get$1(schema, 'vocabularyName', null)
-      }, rest));
-    }
-
-    return /*#__PURE__*/React.createElement(Select, _extends({
-      value: val || '',
-      className: className,
-      appendDefault: true,
-      classWrap: "is-fullwidth",
-      dataTest: dataTest,
-      options: schema == null ? void 0 : schema.vocabulary.map(item => {
-        return {
-          text: item,
-          value: item
-        };
-      }),
-      onChange: setValue
-    }, rest));
-  }
-
-  const getInputType = () => {
-    switch (schema == null ? void 0 : schema.type) {
-      case 'integer':
-        return 'number';
-
-      case 'date':
-        return 'date';
-
-      case 'datetime':
-        return 'datetime-local';
-
-      default:
-        return 'text';
-    }
-  };
-
-  return /*#__PURE__*/React.createElement(Input, _extends({
-    value: val || '',
-    className: className,
-    dataTest: dataTest,
-    onChange: ev => setValue(ev),
-    ref: ref,
-    type: getInputType()
-  }, rest));
-});
-EditComponent.displayName = 'EditComponent';
-
 let registry = {
   paths: {},
   views: {
@@ -11101,5 +11128,5 @@ class Auth {
 
 }
 
-export { AddItem, AddPermission, AllItemsCheckbox, ApplicationCtx, Auth, AuthContext, BaseForm, BehaviorNotImplemented, BehaviorsView, Button, Checkbox, ClientContext, ClientProvider, Config, Confirm, ContainerCtx, ContextToolbar, CreateButton, CreateContainer, DatabaseCtx, Delete, DownloadField, EditableField, EmailInput, FileUpload, Flash, FolderCtx, Form, FormBuilder, GroupCtx, GroupToolbar, GroupsCtx, Guillotina, GuillotinaClient, IAttachment, IImageAttachment, IMultiAttachment, IMultiImageAttachment, IMultiImageOrderedAttachment, IWorkflow, Icon, Input, InputList, Item, ItemCheckbox, ItemCtx, ItemModel, ItemTitle, ItemsActionsDropdown, ItemsActionsProvider, Layout, Link, Loading, Login, Modal, NotAllowed, Notification, Pagination, PanelActions, PanelAddons, PanelBehaviors, PanelItems, PanelNotImplemented, PanelPermissions, PanelProperties, PasswordInput, Path, PathTree, PermissionPrinperm, PermissionPrinrole, PermissionRoleperm, Permissions, PropertiesButtonView, PropertiesView, REGEX_EMAIL, REGEX_HEX_COLOR, REGEX_NUMBER, REGEX_URL, RItem, RemoveItems, RenderField, RenderFieldComponent, RequiredFieldsForm, RestClient, SearchInput, SearchLabels, SearchOptionsLabels, SearchVocabularyLabels, Select, Sharing, Table, TabsPanel, Tag, TagsWidget, TdLink, Textarea, TraversalContext, TraversalProvider, UserCtx, UserForm, UsersCtx, UsersToolbar, base64ToArrayBuffer, buildQs, classnames, defaultComponent, formatDate, generateUID, get$1 as get, getActionsObject, getClient, getNewId, isEmail, isEmpty, isHexColor, isNumber, isURL, lightFileReader, maxLength, messages$4 as messages, minLength, noop, notEmpty, parser, sleep, stringToSlug, toQueryString, useConfig, useCrudContext, useGuillotinaClient, useLocation, useRegistry, useRemoteField, useTraversal, useVocabulary };
+export { AddItem, AddPermission, AllItemsCheckbox, ApplicationCtx, Auth, AuthContext, BaseForm, BehaviorNotImplemented, BehaviorsView, Button, Checkbox, ClientContext, ClientProvider, Config, Confirm, ContainerCtx, ContextToolbar, CreateButton, CreateContainer, DatabaseCtx, Delete, DownloadField, EditComponent, EditableField, EmailInput, FileUpload, Flash, FolderCtx, Form, FormBuilder, GroupCtx, GroupToolbar, GroupsCtx, Guillotina, GuillotinaClient, IAttachment, IImageAttachment, IMultiAttachment, IMultiImageAttachment, IMultiImageOrderedAttachment, IWorkflow, Icon, Input, InputList, Item, ItemCheckbox, ItemCtx, ItemModel, ItemTitle, ItemsActionsDropdown, ItemsActionsProvider, Layout, Link, Loading, Login, Modal, NotAllowed, Notification, Pagination, PanelActions, PanelAddons, PanelBehaviors, PanelItems, PanelNotImplemented, PanelPermissions, PanelProperties, PasswordInput, Path, PathTree, PermissionPrinperm, PermissionPrinrole, PermissionRoleperm, Permissions, PropertiesButtonView, PropertiesView, REGEX_EMAIL, REGEX_HEX_COLOR, REGEX_NUMBER, REGEX_URL, RItem, RemoveItems, RenderField, RenderFieldComponent, RequiredFieldsForm, RestClient, SearchInput, SearchLabels, SearchOptionsLabels, SearchVocabularyLabels, Select, Sharing, Table, TabsPanel, Tag, TagsWidget, TdLink, Textarea, TraversalContext, TraversalProvider, UserCtx, UserForm, UsersCtx, UsersToolbar, VocabularyRenderField, base64ToArrayBuffer, buildQs, classnames, defaultComponent, formatDate, generateUID, get$1 as get, getActionsObject, getClient, getNewId, isEmail, isEmpty, isHexColor, isNumber, isURL, lightFileReader, maxLength, messages$4 as messages, minLength, noop, notEmpty, parser, sleep, stringToSlug, toQueryString, useConfig, useCrudContext, useGuillotinaClient, useLocation, useRegistry, useRemoteField, useTraversal, useVocabulary };
 //# sourceMappingURL=react-gmi.modern.js.map