react-jsonschema-form - npm Package Compare versions

Comparing version 0.31.0 to 0.32.0

lib/components/fields/ArrayField.js

@@ -19,2 +19,6 @@ "use strict";
 
+var _FileWidget = require("./../widgets/FileWidget");
+
+var _FileWidget2 = _interopRequireDefault(_FileWidget);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -146,4 +150,9 @@
     value: function render() {
-      var schema = this.props.schema;
+      var _props = this.props;
+      var schema = _props.schema;
+      var uiSchema = _props.uiSchema;
 
+      if ((0, _utils.isFilesArray)(schema, uiSchema)) {
+        return this.renderFiles();
+      }
       if ((0, _utils.isFixedItems)(schema)) {
@@ -162,11 +171,11 @@ return this.renderFixedArray();
 
-      var _props = this.props;
-      var schema = _props.schema;
-      var uiSchema = _props.uiSchema;
-      var errorSchema = _props.errorSchema;
-      var idSchema = _props.idSchema;
-      var name = _props.name;
-      var required = _props.required;
-      var disabled = _props.disabled;
-      var readonly = _props.readonly;
+      var _props2 = this.props;
+      var schema = _props2.schema;
+      var uiSchema = _props2.uiSchema;
+      var errorSchema = _props2.errorSchema;
+      var idSchema = _props2.idSchema;
+      var name = _props2.name;
+      var required = _props2.required;
+      var disabled = _props2.disabled;
+      var readonly = _props2.readonly;
 
@@ -220,8 +229,8 @@ var title = schema.title || name;
     value: function renderMultiSelect() {
-      var _props2 = this.props;
-      var schema = _props2.schema;
-      var idSchema = _props2.idSchema;
-      var name = _props2.name;
-      var disabled = _props2.disabled;
-      var readonly = _props2.readonly;
+      var _props3 = this.props;
+      var schema = _props3.schema;
+      var idSchema = _props3.idSchema;
+      var name = _props3.name;
+      var disabled = _props3.disabled;
+      var readonly = _props3.readonly;
 
@@ -239,2 +248,26 @@ var title = schema.title || name;
         schema: schema,
+        placeholder: title,
+        value: items,
+        disabled: disabled,
+        readonly: readonly
+      });
+    }
+  }, {
+    key: "renderFiles",
+    value: function renderFiles() {
+      var _props4 = this.props;
+      var schema = _props4.schema;
+      var idSchema = _props4.idSchema;
+      var name = _props4.name;
+      var disabled = _props4.disabled;
+      var readonly = _props4.readonly;
+
+      var title = schema.title || name;
+      var items = this.state.items;
+
+      return _react2.default.createElement(_FileWidget2.default, {
+        id: idSchema && idSchema.id,
+        multiple: true,
+        onChange: this.onSelectChange,
+        schema: schema,
         title: title,
@@ -251,11 +284,11 @@ value: items,
 
-      var _props3 = this.props;
-      var schema = _props3.schema;
-      var uiSchema = _props3.uiSchema;
-      var errorSchema = _props3.errorSchema;
-      var idSchema = _props3.idSchema;
-      var name = _props3.name;
-      var required = _props3.required;
-      var disabled = _props3.disabled;
-      var readonly = _props3.readonly;
+      var _props5 = this.props;
+      var schema = _props5.schema;
+      var uiSchema = _props5.uiSchema;
+      var errorSchema = _props5.errorSchema;
+      var idSchema = _props5.idSchema;
+      var name = _props5.name;
+      var required = _props5.required;
+      var disabled = _props5.disabled;
+      var readonly = _props5.readonly;
 
@@ -332,5 +365,5 @@ var title = schema.title || name;
       var SchemaField = this.props.registry.fields.SchemaField;
-      var _props4 = this.props;
-      var disabled = _props4.disabled;
-      var readonly = _props4.readonly;
+      var _props6 = this.props;
+      var disabled = _props6.disabled;
+      var readonly = _props6.readonly;
 
@@ -337,0 +370,0 @@ return _react2.default.createElement(

lib/components/fields/SchemaField.js

@@ -169,3 +169,3 @@ "use strict";
   if (schema.type === "array") {
-    displayLabel = (0, _utils.isMultiSelect)(schema);
+    displayLabel = (0, _utils.isMultiSelect)(schema) || (0, _utils.isFilesArray)(schema, uiSchema);
   }
@@ -172,0 +172,0 @@ if (schema.type === "object") {

lib/utils.js

@@ -20,2 +20,3 @@ "use strict";
 exports.isMultiSelect = isMultiSelect;
+exports.isFilesArray = isFilesArray;
 exports.isFixedItems = isFixedItems;
@@ -31,2 +32,3 @@ exports.allowAdditionalItems = allowAdditionalItems;
 exports.setState = setState;
+exports.dataURItoBlob = dataURItoBlob;
 
@@ -107,2 +109,6 @@ require("setimmediate");
 
+var _FileWidget = require("./components/widgets/FileWidget");
+
+var _FileWidget2 = _interopRequireDefault(_FileWidget);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -128,3 +134,4 @@
     "alt-datetime": _AltDateTimeWidget2.default,
-    color: _ColorWidget2.default
+    color: _ColorWidget2.default,
+    file: _FileWidget2.default
   },
@@ -150,3 +157,4 @@ number: {
   "ipv6": _TextWidget2.default,
-  "uri": _URLWidget2.default
+  "uri": _URLWidget2.default,
+  "data-url": _FileWidget2.default
 };
@@ -316,2 +324,6 @@
 
+function isFilesArray(schema, uiSchema) {
+  return schema.items.type === "string" && schema.items.format === "data-url" || uiSchema["ui:widget"] === "files";
+}
+
 function isFixedItems(schema) {
@@ -453,2 +465,35 @@ return Array.isArray(schema.items) && schema.items.length > 0 && schema.items.every(function (item) {
   }
+}
+
+function dataURItoBlob(dataURI) {
+  // Split metadata from data
+  var splitted = dataURI.split(",");
+  // Split params
+  var params = splitted[0].split(";");
+  // Get mime-type from params
+  var type = params[0].replace("data:", "");
+  // Filter the name property from params
+  var properties = params.filter(function (param) {
+    return param.split("=")[0] === "name";
+  });
+  // Look for the name and use unknown if no name property.
+  var name = void 0;
+  if (properties.length !== 1) {
+    name = "unknown";
+  } else {
+    // Because we filtered out the other property,
+    // we only have the name case here.
+    name = properties[0].split("=")[1];
+  }
+
+  // Built the Uint8Array Blob parameter from the base64 string.
+  var binary = atob(splitted[1]);
+  var array = [];
+  for (var i = 0; i < binary.length; i++) {
+    array.push(binary.charCodeAt(i));
+  }
+  // Create the blob object
+  var blob = new window.Blob([new Uint8Array(array)], { type: type });
+
+  return { blob: blob, name: name };
 }

package.json

 {
   "name": "react-jsonschema-form",
-  "version": "0.31.0",
+  "version": "0.32.0",
   "description": "A simple React component capable of building HTML forms out of a JSON schema.",
@@ -37,2 +37,3 @@ "scripts": {
   "devDependencies": {
+    "atob": "^2.0.3",
     "babel-cli": "^6.6.5",
@@ -39,0 +40,0 @@ "babel-core": "^6.7.4",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

725630

increased by4.45%

Number of package files

35

increased by2.94%

Lines of code

2973

increased by8.58%

Worsened metrics

Dev dependency count

37

increased by2.78%

Number of low supply chain risk alerts

28

increased by3.7%

No dependency changes