ywana-core8 0.0.194 → 0.0.198

package/dist/index.umd.js

@@ -1022,6 +1022,234 @@
     }) : null, renderOptions());
   };
 
+  /**
+   * TYPES
+   */
+  var TYPES = {
+    STRING: 'String',
+    NUMBER: 'Number',
+    BOOLEAN: 'Boolean',
+    ARRAY: 'Array',
+    ENTITY: 'Object',
+    FUNCTION: 'Function'
+  };
+  /**
+   * FORMATS
+   */
+
+  var FORMATS = {
+    NONE: '',
+    DATE: 'date',
+    EMAIL: 'email',
+    HTML: 'HTML',
+    URL: 'URL'
+  };
+  /**
+   * CHECK
+   */
+
+  var CHECK = Object.values(TYPES).reduce(function (obj, name) {
+    obj['is' + name] = function (x) {
+      return toString.call(x) == '[object ' + name + ']';
+    };
+
+    return obj;
+  }, {});
+  /**
+   * Content Type
+   */
+
+  var ContentType = /*#__PURE__*/function () {
+    function ContentType(schema) {
+      this._schema = schema;
+    }
+
+    var _proto = ContentType.prototype;
+
+    _proto.checkType = function checkType(_ref, data) {
+      var type = _ref.type,
+          item = _ref.item;
+      var valid = true;
+      var validChildren = true;
+
+      if (item) {
+        var child = new ContentType(item);
+
+        switch (type) {
+          case TYPES.ARRAY:
+            valid = CHECK['is' + type](data);
+            validChildren = data.every(function (element) {
+              return child.validate(element);
+            });
+            break;
+
+          case TYPES.ENTITY:
+            valid = CHECK['is' + type](data);
+            validChildren = child.validate(data);
+            break;
+
+          case TYPES.NUMBER:
+            valid = CHECK['is' + type](data.value);
+            validChildren = true;
+            break;
+
+          default:
+            valid = true;
+            validChildren = true;
+        }
+      }
+
+      return valid && validChildren;
+    }
+    /**
+     * Validate entity data
+     * - Inspect required attributes only
+     * - Check attributes type
+     */
+    ;
+
+    _proto.validate = function validate(data) {
+      var _this = this;
+
+      var attributes = Object.entries(this._schema);
+      return attributes.filter(function (_ref2) {
+        var attr = _ref2[1];
+        return attr.required === true;
+      }).every(function (_ref3) {
+        var name = _ref3[0],
+            attr = _ref3[1];
+        return data[name] !== undefined ? _this.checkType(attr, data[name]) : false;
+      });
+    }
+    /**
+     * Content Type Form
+     */
+    ;
+
+    _proto.form = function form(data) {
+      var entries = Object.entries(this._schema);
+      var form = entries.reduce(function (form, _ref4) {
+        var id = _ref4[0],
+            field = _ref4[1];
+        form[id] = Object.assign({}, field, {
+          value: data[id]
+        });
+        return form;
+      }, {});
+      return form;
+    }
+    /**
+     * Content Type Sections
+     */
+    ;
+
+    _proto.sections = function sections(data) {
+      var form = this.form(data);
+      var fields = Object.values(form);
+      var sections = fields.reduce(function (sections, field) {
+        var section = field.section;
+        var title = section ? section : '';
+        if (!sections.hasOwnProperty(title)) sections[title] = {
+          title: title,
+          fields: []
+        };
+        sections[title].fields.push(field);
+        return sections;
+      }, {});
+      return Object.values(sections);
+    }
+    /**
+     * value 
+     */
+    ;
+
+    _proto.value = function value(data) {
+      var fields = Object.entries(this._schema);
+      var next = fields.reduce(function (next, _ref5) {
+        var name = _ref5[0],
+            field = _ref5[1];
+        var type = field.type,
+            item = field.item;
+        var entryData = data ? data[name] : null;
+
+        switch (type) {
+          case TYPES.STRING:
+            next[name] = entryData || field["default"];
+            break;
+
+          case TYPES.NUMBER:
+            next[name] = entryData || field["default"];
+            break;
+
+          case TYPES.BOOLEAN:
+            next[name] = entryData || field["default"];
+            break;
+
+          case TYPES.ENTITY:
+            var child1 = new ContentType(item);
+            next[name] = child1.value(entryData);
+            break;
+
+          case TYPES.ARRAY:
+            if (item === TYPES.STRING) {
+              next[name] = entryData ? entryData : [];
+            } else {
+              var child2 = new ContentType(item);
+              next[name] = entryData ? entryData.map(function (data2) {
+                return child2.value(data2);
+              }) : [];
+            }
+
+            break;
+
+          default:
+            next[name] = field;
+            break;
+        }
+
+        return next;
+      }, {});
+      return next;
+    };
+
+    return ContentType;
+  }();
+  /**
+   * Content
+   */
+
+  var Content = /*#__PURE__*/function () {
+    function Content(type, value) {
+      this.type = type;
+      this._type = new ContentType(type);
+      this._value = value;
+    }
+
+    var _proto2 = Content.prototype;
+
+    _proto2.isValid = function isValid() {
+      return this._type.validate(this._value);
+    };
+
+    _proto2.value = function value() {
+      return this._type.value(this._value);
+    };
+
+    _proto2.form = function form() {
+      return this._type.form(this._value);
+    };
+
+    _proto2.sections = function sections() {
+      return this._type.sections(this._value);
+    };
+
+    _proto2.update = function update(value) {
+      this._value = value;
+    };
+
+    return Content;
+  }();
+
   var isFunction$1 = function isFunction(value) {
     return value && (Object.prototype.toString.call(value) === "[object Function]" || "function" === typeof value || value instanceof Function);
   };
@@ -1185,6 +1413,7 @@
           min = column.min,
           max = column.max,
           _onChange = column.onChange,
+          format = column.format,
           options = column.options;
 
       if (id === "checked") {
@@ -1304,6 +1533,7 @@
             return /*#__PURE__*/React__default["default"].createElement(StringCellViewer, {
               id: id,
               value: cell,
+              format: format,
               options: options
             });
 
@@ -1338,11 +1568,19 @@
 
   var StringCellViewer = function StringCellViewer(_ref4) {
     var value = _ref4.value,
+        format = _ref4.format,
         options = _ref4.options;
     var option = options ? options.find(function (o) {
       return o.value === value;
     }) : null;
     var text = option ? option.label : value;
+
+    switch (format) {
+      case FORMATS.DATE:
+        text = new Date(text).toLocaleDateString();
+        break;
+    }
+
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "field-editor string-viewer"
     }, text);
@@ -2267,234 +2505,6 @@
     }) : null, /*#__PURE__*/React__default["default"].createElement(Text, null, title)), /*#__PURE__*/React__default["default"].createElement("main", null, children), /*#__PURE__*/React__default["default"].createElement("footer", null, actions))));
   };
 
-  /**
-   * TYPES
-   */
-  var TYPES = {
-    STRING: 'String',
-    NUMBER: 'Number',
-    BOOLEAN: 'Boolean',
-    ARRAY: 'Array',
-    ENTITY: 'Object',
-    FUNCTION: 'Function'
-  };
-  /**
-   * FORMATS
-   */
-
-  var FORMATS = {
-    NONE: '',
-    DATE: 'date',
-    EMAIL: 'email',
-    HTML: 'HTML',
-    URL: 'URL'
-  };
-  /**
-   * CHECK
-   */
-
-  var CHECK = Object.values(TYPES).reduce(function (obj, name) {
-    obj['is' + name] = function (x) {
-      return toString.call(x) == '[object ' + name + ']';
-    };
-
-    return obj;
-  }, {});
-  /**
-   * Content Type
-   */
-
-  var ContentType = /*#__PURE__*/function () {
-    function ContentType(schema) {
-      this._schema = schema;
-    }
-
-    var _proto = ContentType.prototype;
-
-    _proto.checkType = function checkType(_ref, data) {
-      var type = _ref.type,
-          item = _ref.item;
-      var valid = true;
-      var validChildren = true;
-
-      if (item) {
-        var child = new ContentType(item);
-
-        switch (type) {
-          case TYPES.ARRAY:
-            valid = CHECK['is' + type](data);
-            validChildren = data.every(function (element) {
-              return child.validate(element);
-            });
-            break;
-
-          case TYPES.ENTITY:
-            valid = CHECK['is' + type](data);
-            validChildren = child.validate(data);
-            break;
-
-          case TYPES.NUMBER:
-            valid = CHECK['is' + type](data.value);
-            validChildren = true;
-            break;
-
-          default:
-            valid = true;
-            validChildren = true;
-        }
-      }
-
-      return valid && validChildren;
-    }
-    /**
-     * Validate entity data
-     * - Inspect required attributes only
-     * - Check attributes type
-     */
-    ;
-
-    _proto.validate = function validate(data) {
-      var _this = this;
-
-      var attributes = Object.entries(this._schema);
-      return attributes.filter(function (_ref2) {
-        var attr = _ref2[1];
-        return attr.required === true;
-      }).every(function (_ref3) {
-        var name = _ref3[0],
-            attr = _ref3[1];
-        return data[name] !== undefined ? _this.checkType(attr, data[name]) : false;
-      });
-    }
-    /**
-     * Content Type Form
-     */
-    ;
-
-    _proto.form = function form(data) {
-      var entries = Object.entries(this._schema);
-      var form = entries.reduce(function (form, _ref4) {
-        var id = _ref4[0],
-            field = _ref4[1];
-        form[id] = Object.assign({}, field, {
-          value: data[id]
-        });
-        return form;
-      }, {});
-      return form;
-    }
-    /**
-     * Content Type Sections
-     */
-    ;
-
-    _proto.sections = function sections(data) {
-      var form = this.form(data);
-      var fields = Object.values(form);
-      var sections = fields.reduce(function (sections, field) {
-        var section = field.section;
-        var title = section ? section : '';
-        if (!sections.hasOwnProperty(title)) sections[title] = {
-          title: title,
-          fields: []
-        };
-        sections[title].fields.push(field);
-        return sections;
-      }, {});
-      return Object.values(sections);
-    }
-    /**
-     * value 
-     */
-    ;
-
-    _proto.value = function value(data) {
-      var fields = Object.entries(this._schema);
-      var next = fields.reduce(function (next, _ref5) {
-        var name = _ref5[0],
-            field = _ref5[1];
-        var type = field.type,
-            item = field.item;
-        var entryData = data ? data[name] : null;
-
-        switch (type) {
-          case TYPES.STRING:
-            next[name] = entryData || field["default"];
-            break;
-
-          case TYPES.NUMBER:
-            next[name] = entryData || field["default"];
-            break;
-
-          case TYPES.BOOLEAN:
-            next[name] = entryData || field["default"];
-            break;
-
-          case TYPES.ENTITY:
-            var child1 = new ContentType(item);
-            next[name] = child1.value(entryData);
-            break;
-
-          case TYPES.ARRAY:
-            if (item === TYPES.STRING) {
-              next[name] = entryData ? entryData : [];
-            } else {
-              var child2 = new ContentType(item);
-              next[name] = entryData ? entryData.map(function (data2) {
-                return child2.value(data2);
-              }) : [];
-            }
-
-            break;
-
-          default:
-            next[name] = field;
-            break;
-        }
-
-        return next;
-      }, {});
-      return next;
-    };
-
-    return ContentType;
-  }();
-  /**
-   * Content
-   */
-
-  var Content = /*#__PURE__*/function () {
-    function Content(type, value) {
-      this.type = type;
-      this._type = new ContentType(type);
-      this._value = value;
-    }
-
-    var _proto2 = Content.prototype;
-
-    _proto2.isValid = function isValid() {
-      return this._type.validate(this._value);
-    };
-
-    _proto2.value = function value() {
-      return this._type.value(this._value);
-    };
-
-    _proto2.form = function form() {
-      return this._type.form(this._value);
-    };
-
-    _proto2.sections = function sections() {
-      return this._type.sections(this._value);
-    };
-
-    _proto2.update = function update(value) {
-      this._value = value;
-    };
-
-    return Content;
-  }();
-
   /**
    * Content Form 
    */
@@ -2942,7 +2952,7 @@
     });
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "entity-editor"
-    }, /*#__PURE__*/React__default["default"].createElement("header", null, "\u2202", /*#__PURE__*/React__default["default"].createElement(Text, {
+    }, /*#__PURE__*/React__default["default"].createElement("header", null, /*#__PURE__*/React__default["default"].createElement(Text, {
       use: "caption"
     }, label)), /*#__PURE__*/React__default["default"].createElement("main", null, fields.map(function (field) {
       return /*#__PURE__*/React__default["default"].createElement(FieldEditor, {
@@ -4087,7 +4097,8 @@
       var title = section.title,
           fields = section.fields;
       return /*#__PURE__*/React__default["default"].createElement("section", {
-        key: title
+        key: title,
+        className: "content-viewer"
       }, /*#__PURE__*/React__default["default"].createElement("header", null, title), /*#__PURE__*/React__default["default"].createElement("main", null, fields.map(function (field) {
         return /*#__PURE__*/React__default["default"].createElement(FieldViewer, {
           key: field.id,
@@ -4097,6 +4108,12 @@
       })));
     }));
   };
+  /**
+   * Field Viewer
+   * 
+   * @param {} props 
+   * @returns 
+   */
 
   var FieldViewer = function FieldViewer(props) {
     var field = props.field,
@@ -4112,10 +4129,40 @@
           value: value
         });
 
+      case TYPES.ENTITY:
+        return /*#__PURE__*/React__default["default"].createElement(EntityViewer, {
+          field: field,
+          value: value
+        });
+
       default:
         return /*#__PURE__*/React__default["default"].createElement("div", null, label);
     }
   };
+  /**
+   * EntityViewer
+   */
+
+
+  var EntityViewer = function EntityViewer(props) {
+    var field = props.field,
+        value = props.value;
+    var item = field.item,
+        label = field.label;
+    var content = new Content(item, value);
+    var form = content.form();
+    var fields = Object.keys(form).map(function (key) {
+      return form[key];
+    });
+    return /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "entity-viewer"
+    }, /*#__PURE__*/React__default["default"].createElement("header", null, label), /*#__PURE__*/React__default["default"].createElement("main", null, fields.map(function (field) {
+      return /*#__PURE__*/React__default["default"].createElement(FieldViewer, {
+        field: field,
+        value: value[field.id]
+      });
+    })));
+  };
 
   function _catch(body, recover) {
     try {
@@ -4639,6 +4686,7 @@
               id: field.id,
               label: field.label,
               type: field.type,
+              format: field.format,
               onChange: field.id === "checked" ? checkOne : field.editable ? change : null,
 
               /* checked has it´s own handler */