Skip to content

Commit b6f2063

Browse files
author
Amarnath Ravikumar
committed
Merge branch 'master' of github.com:mozilla-services/react-jsonschema-form into dev-description
2 parents 206862c + 29ab430 commit b6f2063

File tree

8 files changed

+63
-35
lines changed

8 files changed

+63
-35
lines changed

‎src/components/fields/ArrayField.js‎

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -22,15 +22,15 @@ function ArrayFieldTitle({TitleField, idSchema, title, required}) {
2222
if (!title) {
2323
return null;
2424
}
25-
const id = `${idSchema.id}__title`;
25+
const id = `${idSchema.$id}__title`;
2626
return <TitleField id={id} title={title} required={required} />;
2727
}
2828

2929
function ArrayFieldDescription({DescriptionField, idSchema, description}) {
3030
if (!description) {
3131
return null;
3232
}
33-
const id = `${idSchema.id}__description`;
33+
const id = `${idSchema.$id}__description`;
3434
return <DescriptionField id={id} description={description} />;
3535
}
3636

@@ -108,6 +108,7 @@ class ArrayField extends Component {
108108
onReorderClick = (index, newIndex) => {
109109
return (event) => {
110110
event.preventDefault();
111+
event.target.blur();
111112
const {items} = this.state;
112113
this.asyncSetState({
113114
items: items.map((item, i) => {
@@ -184,7 +185,7 @@ class ArrayField extends Component {
184185
<div className="row array-item-list">{
185186
items.map((item, index) => {
186187
const itemErrorSchema = errorSchema ? errorSchema[index] : undefined;
187-
const itemIdPrefix = idSchema.id + "_" + index;
188+
const itemIdPrefix = idSchema.$id + "_" + index;
188189
const itemIdSchema = toIdSchema(itemsSchema, itemIdPrefix, definitions);
189190
return this.renderArrayFieldItem({
190191
index,
@@ -215,7 +216,7 @@ class ArrayField extends Component {
215216
const Widget = (multipleCheckboxes) ? CheckboxesWidget : SelectWidget;
216217
return (
217218
<Widget
218-
id={idSchema && idSchema.id}
219+
id={idSchema && idSchema.$id}
219220
multiple
220221
onChange={this.onSelectChange}
221222
options={{enumOptions: optionsList(itemsSchema)}}
@@ -234,7 +235,7 @@ class ArrayField extends Component {
234235
const {items} = this.state;
235236
return (
236237
<FileWidget
237-
id={idSchema && idSchema.id}
238+
id={idSchema && idSchema.$id}
238239
multiple
239240
onChange={this.onSelectChange}
240241
schema={schema}
@@ -286,7 +287,7 @@ class ArrayField extends Component {
286287
const additional = index >= itemSchemas.length;
287288
const itemSchema = additional ?
288289
additionalSchema : itemSchemas[index];
289-
const itemIdPrefix = idSchema.id + "_" + index;
290+
const itemIdPrefix = idSchema.$id + "_" + index;
290291
const itemIdSchema = toIdSchema(itemSchema, itemIdPrefix, definitions);
291292
const itemUiSchema = additional ?
292293
uiSchema.additionalItems || {} :
@@ -330,6 +331,7 @@ class ArrayField extends Component {
330331
const {SchemaField} = this.props.registry.fields;
331332
const {disabled, readonly} = this.props;
332333
const hasToolbar = removable || canMoveUp || canMoveDown;
334+
const btnStyle = {flex: 1, paddingLeft: 6, paddingRight: 6, fontWeight: "bold"};
333335

334336
return (
335337
<div key={index} className="array-item">
@@ -352,24 +354,24 @@ class ArrayField extends Component {
352354
<div className="btn-group" style={{display: "flex"}}>
353355
{canMoveUp || canMoveDown ?
354356
<button type="button" className="btn btn-default array-item-move-up"
355-
style={{flex: 1, paddingLeft: 6, paddingRight: 6}}
357+
style={btnStyle}
356358
tabIndex="-1"
357359
disabled={disabled || readonly || !canMoveUp}
358360
onClick={this.onReorderClick(index, index - 1)}>⬆</button>
359361
: null}
360362
{canMoveUp || canMoveDown ?
361363
<button type="button" className="btn btn-default array-item-move-down"
362-
style={{flex: 1, paddingLeft: 6, paddingRight: 6}}
364+
style={btnStyle}
363365
tabIndex="-1"
364366
disabled={disabled || readonly || !canMoveDown}
365367
onClick={this.onReorderClick(index, index + 1)}>⬇</button>
366368
: null}
367369
{removable ?
368370
<button type="button" className="btn btn-danger array-item-remove"
369-
style={{flex: 1, paddingLeft: 6, paddingRight: 6}}
371+
style={btnStyle}
370372
tabIndex="-1"
371373
disabled={disabled || readonly}
372-
onClick={this.onDropIndexClick(index)}>✖︎</button>
374+
onClick={this.onDropIndexClick(index)}>✖</button>
373375
: null}
374376
</div>
375377
</div>
@@ -386,7 +388,7 @@ function AddButton({onClick, disabled}) {
386388
<p className="col-xs-2 col-xs-offset-10 array-item-add text-right">
387389
<button type="button" className="btn btn-info col-xs-12"
388390
tabIndex="-1" onClick={onClick}
389-
disabled={disabled} style={{fontWeight: "bold"}}>＋</button>
391+
disabled={disabled} style={{fontWeight: "bold"}}>➕</button>
390392
</p>
391393
</div>
392394
);

‎src/components/fields/BooleanField.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ function BooleanField(props) {
3636
const widget = uiSchema["ui:widget"];
3737
const commonProps = {
3838
schema,
39-
id: idSchema && idSchema.id,
39+
id: idSchema && idSchema.$id,
4040
onChange,
4141
label: title || name,
4242
placeholder: description,

‎src/components/fields/ObjectField.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -114,12 +114,12 @@ class ObjectField extends Component {
114114
return (
115115
<fieldset>
116116
{title ? <TitleField
117-
id={`${idSchema.id}__title`}
117+
id={`${idSchema.$id}__title`}
118118
title={title}
119119
required={required} /> : null}
120120
{schema.description ?
121121
<DescriptionField
122-
id={`${idSchema.id}__description`}
122+
id={`${idSchema.$id}__description`}
123123
description={schema.description}
124124
/> : null}
125125
{

‎src/components/fields/SchemaField.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -167,7 +167,7 @@ function SchemaField(props) {
167167
required={required}
168168
type={schema.type}
169169
displayLabel={displayLabel}
170-
id={idSchema.id}
170+
id={idSchema.$id}
171171
classNames={uiSchema.classNames}>
172172
<FieldComponent {...props}
173173
schema={schema}

‎src/components/fields/StringField.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ function StringField(props) {
2828
const widget = uiSchema["ui:widget"] || schema.format;
2929
const commonProps = {
3030
schema,
31-
id: idSchema && idSchema.id,
31+
id: idSchema && idSchema.$id,
3232
label: title || name,
3333
placeholder: description,
3434
onChange,

‎src/utils.js‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -301,7 +301,9 @@ export function shouldRender(comp, nextProps, nextState) {
301301
}
302302

303303
export function toIdSchema(schema, id, definitions) {
304-
const idSchema = {id: id || "root"};
304+
const idSchema = {
305+
$id: id || "root"
306+
};
305307
if ("$ref" in schema) {
306308
const _schema = retrieveSchema(schema, definitions);
307309
return toIdSchema(_schema, id, definitions);
@@ -314,7 +316,7 @@ export function toIdSchema(schema, id, definitions) {
314316
}
315317
for (const name in schema.properties || {}) {
316318
const field = schema.properties[name];
317-
const fieldId = idSchema.id + "_" + name;
319+
const fieldId = idSchema.$id + "_" + name;
318320
idSchema[name] = toIdSchema(field, fieldId, definitions);
319321
}
320322
return idSchema;

‎test/performance_test.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ describe("Rendering performance optimizations", () => {
9595
foo: {type: "string"}
9696
}
9797
};
98-
const idSchema = {id: "root", foo: {id: "root_plop"}};
98+
const idSchema = {$id: "root", foo: {$id: "root_plop"}};
9999

100100
it("should not render if next props are equivalent", () => {
101101
const {comp} = createComponent(ObjectField, {

‎test/utils_test.js‎

Lines changed: 40 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -464,7 +464,7 @@ describe("utils", () => {
464464
it("should return an idSchema for root field", () => {
465465
const schema = {type: "string"};
466466

467-
expect(toIdSchema(schema)).eql({id: "root"});
467+
expect(toIdSchema(schema)).eql({$id: "root"});
468468
});
469469

470470
it("should return an idSchema for nested objects", () => {
@@ -481,10 +481,10 @@ describe("utils", () => {
481481
};
482482

483483
expect(toIdSchema(schema)).eql({
484-
id: "root",
484+
$id: "root",
485485
level1: {
486-
id: "root_level1",
487-
level2: {id: "root_level1_level2"}
486+
$id: "root_level1",
487+
level2: {$id: "root_level1_level2"}
488488
}
489489
});
490490
});
@@ -511,20 +511,44 @@ describe("utils", () => {
511511
};
512512

513513
expect(toIdSchema(schema)).eql({
514-
id: "root",
514+
$id: "root",
515515
level1a: {
516-
id: "root_level1a",
517-
level1a2a: {id: "root_level1a_level1a2a"},
518-
level1a2b: {id: "root_level1a_level1a2b"},
516+
$id: "root_level1a",
517+
level1a2a: {$id: "root_level1a_level1a2a"},
518+
level1a2b: {$id: "root_level1a_level1a2b"},
519519
},
520520
level1b: {
521-
id: "root_level1b",
522-
level1b2a: {id: "root_level1b_level1b2a"},
523-
level1b2b: {id: "root_level1b_level1b2b"},
521+
$id: "root_level1b",
522+
level1b2a: {$id: "root_level1b_level1b2a"},
523+
level1b2b: {$id: "root_level1b_level1b2b"},
524524
},
525525
});
526526
});
527527

528+
it("schema with an id property must not corrupt the idSchema", () => {
529+
const schema = {
530+
type: "object",
531+
properties: {
532+
metadata: {
533+
type: "object",
534+
properties: {
535+
id: {
536+
type: "string"
537+
}
538+
},
539+
required: [ "id" ]
540+
}
541+
}
542+
};
543+
expect(toIdSchema(schema)).eql({
544+
$id: "root",
545+
metadata: {
546+
$id: "root_metadata",
547+
id: { $id: "root_metadata_id" }
548+
}
549+
});
550+
});
551+
528552
it("should return an idSchema for array item objects", () => {
529553
const schema = {
530554
type: "array",
@@ -537,8 +561,8 @@ describe("utils", () => {
537561
};
538562

539563
expect(toIdSchema(schema)).eql({
540-
id: "root",
541-
foo: {id: "root_foo"}
564+
$id: "root",
565+
foo: {$id: "root_foo"}
542566
});
543567
});
544568

@@ -557,9 +581,9 @@ describe("utils", () => {
557581
};
558582

559583
expect(toIdSchema(schema, undefined, schema.definitions)).eql({
560-
id: "root",
561-
foo: {id: "root_foo"},
562-
bar: {id: "root_bar"}
584+
$id: "root",
585+
foo: {$id: "root_foo"},
586+
bar: {$id: "root_bar"}
563587
});
564588
});
565589
});

0 commit comments

Comments
 (0)