How to use the react-jsonschema-form/lib/utils.orderProperties function in react-jsonschema-form

To help you get started, we’ve selected a few react-jsonschema-form examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github department-of-veterans-affairs / vets-website / src / js / common / schemaform / fields / ObjectField.jsx View on Github external
orderAndFilterProperties(schema, uiSchema) {
    const properties = Object.keys(schema.properties);
    const orderedProperties = orderProperties(properties, _.get('ui:order', uiSchema));
    const filteredProperties = orderedProperties.filter(prop => !schema.properties[prop]['ui:hidden']);
    const groupedProperties = _.groupBy((item) => {
      const expandUnderField = _.get([item, 'ui:options', 'expandUnder'], uiSchema);
      return expandUnderField || item;
    }, filteredProperties);

    return _.values(groupedProperties);
  }
github balena-io-modules / rendition / src / unstable / components / Form / fields / ObjectField.tsx View on Github external
readonly,
			idPrefix,
			onBlur,
			onFocus,
			registry = getDefaultRegistry(),
		} = this.props;
		const { definitions, fields, formContext } = registry;
		const { SchemaField, TitleField, DescriptionField } = fields;
		const schema = retrieveSchema(this.props.schema, definitions, formData);
		const title = schema.title === undefined ? name : schema.title;
		const description = uiSchema['ui:description'] || schema.description;
		let orderedProperties: string[];

		try {
			const properties = Object.keys(schema.properties || {});
			orderedProperties = orderProperties(properties, uiSchema['ui:order']);
		} catch (err) {
			return (
				<div>
					<p style="{{">
						Invalid {name || 'root'} object field configuration:
						<em>{err.message}</em>.
					</p>
					<pre>{JSON.stringify(schema)}</pre>
				</div>
			);
		}

		const Template = registry.ObjectFieldTemplate || DefaultObjectFieldTemplate;
		const templateProps = {
			title: uiSchema['ui:title'] || title,
			description,
github Talend / ui / packages / forms / src / deprecated / fields / ObjectField.js View on Github external
schema={schema}
					formData={formData}
					uiSchema={uiSchema}
					registry={this.props.registry}
					definitions={definitions}
				/&gt;
			);
		}

		const title = schema.title === undefined ? name : schema.title;
		const description = uiSchema['ui:description'] || schema.description;
		let orderedProperties;

		try {
			const properties = Object.keys(schema.properties);
			orderedProperties = orderProperties(properties, uiSchema['ui:order']);
		} catch (err) {
			return (
				<div>
					<p style="{{">
						Invalid {name || 'root'} object field configuration:
						<em>{err.message}</em>.
					</p>
					<pre>{JSON.stringify(schema)}</pre>
				</div>
			);
		}

		const Template = registry.ObjectFieldTemplate || DefaultObjectFieldTemplate;

		const templateProps = {
			title: uiSchema['ui:title'] || title,
github cloudwan / gohan_webui / src / Form / formComponents / fields / ObjectField.js View on Github external
actions.hide.forEach(propertyKey =&gt; {
            if (
              this.state[key] === value ||
              (value === '' &amp;&amp; (this.state[key] === null || this.state[key] === undefined))
            ) {
              delete schema.properties[propertyKey];
            }
          });
        }
      });
    });

    let orderedProperties;
    try {
      const properties = Object.keys(schema.properties);
      orderedProperties = orderProperties(
        properties, Object.keys(schema.properties).reduce((result, item) =&gt; {
        if (!result.includes(item)) {
          result.push(item);
        }

        return result;
      }, schema.propertiesOrder)
        .filter(item =&gt; properties.includes(item)) || uiSchema['ui:order']
      );
    } catch (err) {
      return (
        <div>
          <p style="{{color:">
            Invalid {name || 'root'} object field configuration:
            <em>{err.message}</em>.
          </p></div>
github Talend / ui / packages / forms / src / deprecated / fields / CollapsibleFieldset.js View on Github external
errorSchema,
				idSchema,
				name,
				required,
				disabled,
				readonly,
				onBlur,
				registry,
			} = this.props;
			const { definitions, fields, formContext } = registry;
			const { SchemaField, TitleField, DescriptionField } = fields;
			const schema = retrieveSchema(this.props.schema, definitions);
			let orderedProperties;
			try {
				const properties = Object.keys(schema.properties);
				orderedProperties = orderProperties(properties, uiSchema['ui:order']);
			} catch (err) {
				return (
					<div>
						<p style="{{">
							Invalid {name || 'root'} object field configuration:
							<em>{err.message}</em>.
						</p>
						<pre>{JSON.stringify(schema)}</pre>
					</div>
				);
			}
			const iconTransform = !formData.isClosed ? 'flip-vertical' : '';
			return (
				<fieldset>
					<div role="button" id="{`${idSchema.$id}__title_bar`}">
						{title &amp;&amp; (</div></fieldset>